サイトのフォント変更について 2012:02:13:18:51:55

ここ最近、サイトのHTMLフォント変えたんですけど、お気付きでしょうか。

"Meiryo"ってフォントに変えたんだけど、

たぶん以前よりかは、だいぶ見やすくなったと思います。

(OSやブラウザの環境によっては、今までと

特に変化のない方もいらっしゃるかも知れません。)

この"Meiryo"っていうのは、従来の"MS Pゴシック"から

進化したフォントで、綺麗で見やすいのが特徴です。

なお「Vista」からのWindowsでは標準搭載されてて、

XPでも、マイクロソフトから無料で配布されてるので、

良かったら使ってみてください。

ということで、このサイトは現在"Meiryo"を想定して、

デザインを組んでいるのですが(Winのみ、Macは後述に記載)、

当初変えようとした時は、色々問題がありました。

というのも、この綺麗なフォントは諸刃の剣で、

文字間や行間が従来の"MS Pゴシック"よりかなり広いんです。

なので、それまで普通に入ってたHTMLテキストが枠からはみ出すなど、

致命的なデザインの崩れが発生したんです。

で、これは実際マイクロソフトでも問題になってて、

後にそれを改善すべく、"MS Pゴシック"と比較的行間などが近い、

"Meiryo UI"なるフォントをマイクロソフトがリリースし、

Win7以降に標準搭載しました。

そういう訳で、当初はこの"Meiryo UI"を使おうと思ってたんですが、

よくよく考えると、MACはどうなんだろうと思いました。

実際MACを所有していないので、確かめようがなかったのですが、

http://rinrin.saiin.net/~aor/fonts/fonts

上記URLで調べると、MACでは"ヒラギノ角ゴ Pro W3"が先頭に紹介されていたので、

MAC用にはこのフォントを指定して、WINではこれを基準に考えることにしました。

で色々調べた結果、この"ヒラギノ角ゴ Pro W3"と、

一番行間や文字幅などが近いWinフォントが"Meiryo"だったので、

やっぱり"Meiryo UI"は諦めて、ただの"Meiryo"を使うことにしました。

そんな訳で、結局このサイトの全ページ、テキストを修正するハメになったのは

言うまでもありません(笑)。

場合によっては、文字数が多く微調整できないページもあったりで、

その際は新たにもう一個ページを増やしたりと、何気に物凄く時間掛かりました。

なので、当サイトのように、デザインをCSSでガッチガチに固めたサイトを

持っている方は、フォントを変更する際は本当に要注意です。

(まぁ自分の場合はさらにフォントサイズも弄ったので大変だったんですが。。)

そういう訳で、現在はおそらくWinもMacユーザーも、

あまり変わらないバランスで観閲できてると思います。

(おそらく・・・たぶん・・・そうだといいな)

なおWinXP以下で、この"Meiryo"が入っていない方は、

従来の"MS Pゴシック"で表示されるようになってるので、

結構ページの余白が大きいんじゃないかなと思います。

ま、逆(余白が足りなくてはみ出す)じゃないからイイかなと思って、

そこは割り切ったんですけど。

ちなみに、調整段階で一番頭に来たのが、OSではなく、

ブラウザ、てかIEのバージョン毎の違いでした。

本当頭に来るんだけど、Internet Explorerってバージョン毎に、

全然行間とか違うんですよ。

IE9でちょうど良くても、それ以下ではダメとか、

IE5、6、7、9で大体OKでも、IE8だけアウトとか。。

多少裏技っぽいこともして改善を図ったんですが、

限界もあってある程度は妥協しました。

なので、環境によってはアウトの人も、

ひょっとしたらいらっしゃるかも知れません。。

本当にマイクロソフトはいい加減してほしい。

デザイナーさん達の間では、他のブラウザと仕様が違うので、

それだけでもよく怒られてるIEですが、さらにIEの中でも

こんだけ仕様にバラツキがあるんだから、嫌われるハズだよと、

つくづく今回も実感しました。

ちなみに当サイトの推奨ブラウザはGoogle Chromeです。

このサイトに関して言えば、たぶん一番見やすいと思います。

なのでもし良かったら、これを機にブラウザ乗り換えてください。

・・・なんかコレ定期的に言ってる気がするけど(笑)。

暁/SILENCE