弊サイト、Nihongo PCは、先日新しいサーバーに引越したのを機に、MovableTypeもバージョンアップし、Webのデザインはそこで用意されているテンプレートを利用しています。
以前は、CSSファイルを作り直してデザインを変更したりしたのですが、ブラウザ毎の見映えを確認する作業の大変さに挫けてしまい^^;、今は、MTで用意されたテンプレートをそのまま使っています。
ところが、このデザインですと英語版Windows Vista+英語版Operaの組み合わせでは、何故かフォントが汚いのです。 英語版Windows XP+英語版Operaの組み合わせでは綺麗なフォントで表示されるのですが、英語版Windows Vistaでは駄目です。
どんな風に汚いかというと、こんな風。
文字の一部で、フォントの違い(?)や大きさの違いがあるようです。
原因はよくわからないのですが、とりあえずテストをしてわかったことをまとめておきます。
まず、各ブラウザの基本的な動作は(英語版Windows XP,Windows Vista共)
1. HTMLのエンコードに、Shift-JIS(日本語のエンコードの一つ), Big5(Simplified Chineseのエンコードの一つ), GB2312(Traditional Chineseのエンコードのひとつ)など、言語が判別できるエンコードが使われていて、フォントの指定が無い場合はブラウザの各言語のデフォルトフォントに設定される。
参照: Default Fonts in Browser
つまり、日本語の場合、OperaはMS PMincho、それ以外はMS PGothic。 Simplified Chineseの場合は、全てのブラウザでSim Sum。
2. HTMLのエンコードにUTF-8が使われて、フォントの指定が無い場合は各ブラウザで使われているSim Sum(Simplified Chineseのデフォルトフォント)が指定される。
各ブラウザのフォントは以下の通り。
Encode:Shift-JISを指定した場合。
Internet Explore 7
Firefox
Google Chrome
Opera
Safari
Encoding: UTFを指定した場合。
Internet Explore 7
Firefox
Google Chrome
Opera
Safari
はじめは、Operaのフォントの乱れはUTFを使った日本語ページが中国語用のフォントで表示されたのではと考えたのですが、CSSを調べてみてもそうではなさそう。
では、どんなフォントが使われているのか、見てみたところ trebuchet msというフォントが有効になっている模様。
この trebuchet msというフォント、ざっと調べてみても、イマイチどういうフォントなのかわからないのですが^^;、Operaでは trebuchet msが有効になって、Operaの trebuchet msが使われているために、文字が不揃いで汚いフォントになっているようです。(ただし、英語版Windows Vistaでのみ。)
ただ、Firefox,Safari,IE7では trebuchet msではなく、日本語用のフォントが有効になっているので(Chromeはちょっと微妙。)、これらのブラウザではUTFを使ったページの言語をどこかで判断しているのでしょうかね～?
それにしても、Operaの trebuchet ms、せめてフォントの大きさを揃えてくれるだけでも少し綺麗になると思うのですが、どうしてこんな不揃いなフォントになっているんでしょう??
Leave a comment