【Web】メイリオについて
引き続きDreamweaverのテキスト改訂を行っております。
さらに気になっているのが、CS4からのフォントセットです。
今までは、ＭＳ Ｐゴシック、osaka、ヒラギノ角ゴ Pro W3の３点セットだったわけですが、ここへ来て、セットの中にメイリオが入ってきました。
Webデザイン上で、とーっても気になるメイリオの問題点・・・
フォントがでかい。行間が広い。
厳密には、フォントがでかいわけじゃないんですけどね・・・
スクリーンショットで比較画像を作ってみました。
上段がIE7、下段がFirefox3での結果です。
グレーの文字がメイリオ。赤い文字がＭＳ ゴシックです。
それほどサイズに違いはないです。
強いてあげれば、「プ」の文字が上下に各１ピクセルずつ大きいくらいですかね？
ただ、メイリオの位置付けは、一応プロポーショナルフォント。
なので、ＭＳ ゴシックと比較するのは間違いで、ＭＳ Ｐゴシックと比較しなくてはいけないわけです。
メイリオはちょっと変わっていて、和文部分は等幅、欧文部分がプロポーショナルの合成フォントみたいな感じです。
なので、今までＭＳ Ｐゴシックとかで、作っていたサイトは、メイリオにすると、文章がかなり長くなってしまい、あげく崩れることもありえます。
さらに心配なのが、メイリオで作っても、メイリオが入っていないＸＰ以下のWindowsやら、Ｍａｃやらで見ると、結局ＭＳ Ｐゴシックとか、ヒラギノで表示されちゃうので、ブラウザごとに見た目が激しく変わってしまう可能性が出てきました。
う〜ん・・・
そして、もっと問題なのが、行間。
メイリオで指定すると、line-heightの指定をしなくても、ものすごく広い。
なんとなく測ってみたら、line-height:1.6に相当するくらいでした。
う〜・・・・
まぁ、これに関しては、あらかじめbodyに対してline-height:1.0を指定しておくことで統一できたので、大丈夫なのかな？
問題は、これをどうやって、かなり時間的にカツカツの授業中に説明するかですよねぇ・・・・
まいったなぁ・・・