ブログをきれいに表示するためにフォントを指定する　【CSS,font-family】

海外の人が作ったと思われるWordPressやBloggerのテンプレートをそのまま使うと、日本語表示ではきれいに表示されないことが個人的には多いなと思います。原因は、日本語フォントが明示的に指定されていないからだと思われます。

そこで、フォント指定をして、お手軽に表示確認を行う時に私が使っている方法です。

■方法その１
bodyタグの後ろに以下の部分を挿入する

<style>
body{
  font-family:Helvetica,Arial,'ヒラギノ角ゴ Pro W3','メイリオ','ＭＳ Ｐゴシック',sans-serif;}
</style>

■方法その２
bodyタグの後ろに以下の部分を挿入する

<script type="text/javascript">
<!--
if (navigator.userAgent.indexOf('Mac OS X')>-1) {
  document.write("<style> body {font-family:Helvetica,Arial,'ヒラギノ角ゴ Pro W3',sans-serif; } </style>");
}else{
  document.write("<style> body {font-family:Helvetica,Arial,'メイリオ','ＭＳ Ｐゴシック', sans-serif; } </style>");
}
// -->
</script>

最終的にテンプレートを修正する場合は、方法１のフォント順で問題ないと思います。
方法その２のような手段を使って、機種毎？に細かく指定してもよいとは思います。

【参考にした記事】
・cssのフォント指定を再考するぜ2011 autumn | DAICHIFIVE blog
・CSSのfont-family：ヒラギノとＭＳ Ｐゴシックとメイリオの悩ましい関係 - webデザイナーのナナメガキ
・覚書 » Webfontの振り分け
・IEでCSSで指定してもフォントのサイズが小さくならない