IE7はメイリオ、IE6/FFはMS Pゴシ、Mac Safari/FFはヒラギノ角ゴを表示

font-family.jpg

自宅ではMacを使ってますが、職場はWindows環境なので普段はWindows Firefoxをメインに使ってます。

最近メイリオを指定しているサイトがぼちぼちと。ところがFirefoxやIE6なんかで見てるとアンチの切れたメイリオが表示されて非常に読みづらいのです。VistaのFirefoxはどうだかわからないけれども、XPでメイリオがインストールされていてFirefoxやIE6環境ではとても見てられない。

てな訳で一つの案としてこんなフォントの指定を考えてみました。

body { font-family: "MS Pゴシック", sans-serif; }
*:first-child+html body {
	font-family: "メイリオ", "MS Pゴシック", sans-serif;
}
html>body {
	font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Osaka, sans-serif;
}

まずはWin IE6へMS Pゴシを指定。続いてWin IE7のみにメイリオを適用させる。メイリオがない環境へはMS Pゴシ。で最後にWin FF、Mac Safari/FFにヒラギノを適用。この際、Hiragino Kaku Gothic Pro W3まで記述してしまうとSafari3ではフォントウェイトが太くなってしまうので注意。

とりあえずこんなセットはいかがでしょうか?ってなことでエントリーしておきました。