remove
powerd by nog twitter

IE 帝國 その戦略と大衆支配の構造

フォント指定はマジやばいっす!

Osaka で生まれた...

マックって、言いませんねん。マクドってみんな、四ドル。 マック言うたら、パソコンのアレですわ、アイマックとかのアレ。 そう、Macintosh のコト、以下、Mac と略しますよ。誰が月見バーガーやねん! ちゃうで、パソコンのマックや。 ホンデですね、Mac の標準フォント、それが近年まで "Osaka" というヤツでしたねん。 なんで、 "Osaka" って? 知らんけど、欧文フォントで "Chicago" とかあるから、そーいうノリと違いますか?

Windows のヒト、ワケ分からんでしょ? でも、これ重要。 何でって、フォント指定するときに "MS Pゴシック" って、指定されたら Mac の人間、お手上げや。 しやから、"Osaka" とかの Mac 用フォントも併記してくれなあかんワケです。 まあ、フォントを固有フォント名で指名するときは Win と Mac それぞれのフォントを選ばなねー。 一方、ジェネリック・フォントというヤツを指定して serif で明朝系、sans-serif でゴシック系、とかそういう方法も あるんですが、コレはコレで、問題があるってなワケで...。


sans-serif はヤバい、マジやばい

sans-serif でゴシック系、でもこれゴシップ系。 何がゴシップって、IE5.5 だと文字化けする可能性があって、マジやべえ。 IE5.5 って渋谷じゃみんな使ってるし、全国的にも10人に1人が使ってるらしいんですけど。 そんなに大勢のヒトに文字化け見せちったら、チョーやべえ。 それに、Yahoo! のサーファーが IE5.5 使ってたら、文字化けバカサイトって思われるYO! マジ、サーファーは尊敬してるんでー、 ぶっちゃけカタルシス、みたいな。

それに、この前、アツシんトコ行って、ブクロのアツシね。 ブクロってアキバ近いじゃん? だから、最新型の IE6 がスッゲー普及してんの。 チョーサイバーシティー。 そんで、アツシも IE6 使ってたんだけど、IE6 だったら sans-serif で文字化けしねーハズじゃん? 事実、 文字化けしてなかったけど、テキストがー、なってなくてー、太字系になっててー、スゲー読みにきーの。 理由はわかんないっすけど、IE って sans-serif と相性悪いみたい。 だから、安全策として固有フォント選ぶしかないみたいな?

font-family: 'Osaka','MS Pゴシック',sans-serif;

上みたいに指定したらー、結局、Mac なら "Osaka" 、Win なら "MS Pゴシック" になるんでー、 語尾に付けてる sans-serif が意味無くねえ? これだったら結局、誰も指名しないデー、 勝手に付いてくるデフォルトに甘んじるのと一緒、みたいな。 結局、ジェネリック使えねーじゃん。 ぶっちゃけ、フォント指定じたいがハァッ、って感じ。


半角英数字だけ太くする方法

ここから真面目に書いていきます。 とりあえず言えるのはジェネリック・フォント、特に sans-serif の指定はリスキーだと言えます。 そこで固有フォントで指定する場合ですが、 極力一般的に普及しているフォントを選びたいものです。 しかし、一般的なモノを選ぶと (Win なら "MS UI Gothic" / "MS Pゴシック" / "MS ゴシック" / "MS P明朝" / "MS 明朝" くらい)、 自然と限られてくるワケであり、それならあえて指定する必要も無いというジレンマ。 フォント指定自体がそれ程意味を持たず、やるべきではないのかもしれません。 企業サイトなども基本的には指定していないと思われます。

しかし、「フォントはどこに収納してあるんですか?」でも書きましたが、 「IE6 + Windows XP」の組み合わせだとうまい具合に表示されるんですよ、 sans-serif で。 "MS Pゴシック" との主な違いとして半角英数字が太めに表示されるという特徴があります。 アルファベット、特に小文字は日本語と比べて小さく表示されるので読みにくい感じがします。 ところが、「IE6 + Windows XP」の組み合わせで表示される sans-serif では半角英数字だけが太字気味になるので、 非常に使い勝手がいいワケです。 この使い勝手を sans-serif を使わずに実現させる為にはどうすればいいのか? これを課題に考察していきたいと思います。

様々なフォントを試してみます。"MS UI Gothic" 、"MS Pゴシック" 、"Microsoft sans serif"...。 しかし、半角英数字は太字では表示されません。 そこで、font-weight プロパティで bold を指定してみます。 これだと、日本語も太字になる。 全文が太いという文章は想像以上に読みにくいモノです。これも没。 いったい、どうすれば...。 頭の片隅に答えがあるような気がするのに、それがハッキリとしない。

...どうやら思い違いをしていたようです。 よくよく考えてみれば、アルベットさえ太くなればいいハナシ。 欧文フォントのみ太字になればいいハナシ。 だったら、標準状態で太く描画されるゴシック系のフォントを指定すればいい。 'Arial Black'、太すぎる。 しかし、考え方としてはこれでいいワケです。 欧文フォントを指定した範囲に登場する和文フォントは実質、無指定のデフォルトと同じ扱いとなります。 和文に関してはデフォルト・フォント(普通はゴシック系)で構わない、 欧文(半角英数字)だけ太目のフォントを指定してやればいいワケです。

'Lucida Sans Unicode' というモノが Windows に広く付随しているゴシック系のフォントであり、 やや太目に欧文を表示するフォントだと分かりました。 あとは、Mac で似た形状を持つフォント('Chicago' が似ている)を選び、本文に関しては以下のように指定しました。 この方法だと問題のある IE5.5 はもちろん、Mozilla や Netscape などのブラウザでも同様に表示されるハズです。

font: medium/1.8 'Lucida Sans Unicode',Chicago,Arial;

最後の 'Arial' は保険です。 ちなみに後から知ったんですが、'Lucida Sans Unicode' を IE にて認知すると、 和文フォントが "MS UI Gothic" に強制変換されるらしいです(下のキャプチャー画像参照)。

IE での表示
IE6 で閲覧。日本語のフォントは "MS UI Gothic" に置換されている。

Firefox での表示
Firefox で閲覧。半角英数字は IE と同様のフォント('Lucida Sans Unicode')だが、 日本語に関しては "MS Pゴシック" をデフォルト・フォントに割り振っている為、 "MS Pゴシック" で表示されている。 「で」「る」「ッ」あたりの仮名文字に注目。


文字化けの謎

一般的に「IE5.5 で文字化け」と称される疑惑ですが、これをもう少し具体的に解明したいと思います。 マイクロソフトのサポート情報によると、以下の条件下で発生するようです。

どうやら、(イ)、(ロ)、(ハ)、が全て揃うと文字化けを起こすようです。 つまり、IE6 であっても(ロ)を満たし、OS が 95 / 98 / Me / NT あたりならば文字化けを起こすワケです。 (ロ)の条件がどの程度のユーザーに当てはまるのかは分かりかねますが、 (イ)かつ(ハ)という環境のユーザーは'04年現在で 30% 程度いると推測されます。 ただし、文字化けと言っても全てのパターンにおいて、”□□□□□□” になるワケではないと思います。 症状が軽症であり、日本語が表示される場合にしても、sans-serif に相当するフォントが 適切に選択されない可能性があります。 例えば、「Windows Me + IE6」という環境にて sans-serif が指定されたファイルを表示させたら、 和文が太字で、欧文が普通の太さという妙な具合で表示されました。 このとき、(ロ)の条件が満たされていたのかは謎ですが...。

マイクロソフトのサポート情報で8割方は説明し尽くされているものの、完全な説明とは言い難く 一部釈然としない気もします。 それにしても、多くのウェブサイトにて「sans-serif は IE5.5 で文字化け」という具合に記述されていました。 マイクロソフトの説明では IE5.5 が特にどうのこうの、という風には受け取れなかったのですが、 ヒトの噂には根拠があるもので、少なくとも IE5.5 だと文字化けを起こす可能性が顕著に高いのでしょう。 そして、IE6 なら大丈夫みたいな風潮も IE6 のユーザーが古いOSを使っている率が少ないからでしょう。

参考;[IE5]sans-serif を指定した HTML ファイルを表示すると文字化け


半死のプロパティ

莫大なシェアを誇る IE、例えば中途半端なバージョンアップ版である IE5.5 でも '04年現在で 10% 程度のシェアを持っています。 IE5.x と IE6 を合わせれば 90% 程度、かなりの寡占状態です。 結局、これだけのシェアがあるので IE の問題は、CSS全体の問題となります。 IE で実装されていないプロパティは存在しないも同然であり、 IE で不都合を生じるプロパティや値は誰からも敬遠されて問題児扱いになります。 また、12pt などと絶対指定したフォントに関しては、ユーザー操作によって拡大・縮小できないという概念にしても IE が作り出したものです。

IE6 でも問題は多いのですが、調べてみると IE5.x以前においては問題がありすぎるようです。 そして、IE の持っている不備はブラウザの持っている不備と捉えられ、 HTMLファイルを作成する際に多くの制約を作り手に与えてしまいがちです。 特にフォント関連においてウェブ設計者たちは多くを諦めるか、IE流にアレンジするコトで妥協するしかありません。 この風潮はやはり、弊害でしょう。 できるコトとできないコト、両者を区別するものとして合理的で整合性のある判断基準は無く、 ただ IE にて可能か不可能かというだけの理屈で多くを片付けなければなりません。 そして、IE のやるコトにはそれほど一貫性があるとも思えず、バグが見つかってもほったらかし。 それでも IE に合わせていくしかない。 「何だかなー」って、阿藤快じゃなくとも言いたくなりますよ。


©webman60kg
E-mail : webman60kg@infoseek.jp