CSS編集用デザインを選んでフォントの設定を変更する

Ameblo にはいろんなデザインが用意されていますが、Ameblo でまず初めにやるべき設定として、人に読んでもらう ブログ を書くなら「CSS編集用デザイン」を選んで、CSSの編集をします。

Ameblo の フォント設定

CSSの最後に

/* その他、拡張があれば記述 */

という記述があるので、この後に

body {font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', meiryo,sans-serif;}

この１行を追加して保存します。 これだけで、windows環境でも 読みやすいフォント に変わります。

自分の趣味の記録のためとかそういう場合は、文字が読みにくくても本人がわかればいいだけなんですが、人に読んでもらうことが目的なのであれば、できるだけ 読みやすい文字 に 変更するべきだと思います。

Ameblo の blogは、読みにくい

Ameblo でブログ書いてる人って結構多いんですが、windows環境 のPCで見ると 文字が読みにくいんです。
フォントの設定を見てみると

body { font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif, メイリオ, Meiryo; font-size: 16px; }

というふうになっています。

まあ、これは Ameblo に限ったことではないんですが、今時 フォントの設定 が「MS Pゴシック」というのは、どうなんでしょうか？ それに、font-family の最後に設定されている「メイリオ」もこの位置にあるのはおかしいです。

CSSの分かる人には分かる話なんですが、CSS で font-family を指定した場合、先頭に書かれたものが優先されます。複数の フォント が指定されている時は、表示するPCにその フォント が無ければ、２番目・３番目…という風に前から順番に見ていってPCの中に フォント があればその フォント が表示されます。 どれも当てはまらない場合は、PC や ブラウザ に設定されている 標準フォント が使用されます。
「sans-serif」という フォント は、通常は ゴシック系 の 汎用代替フォント として指定します。

ですので、普通は「sans-serif」の後に「メイリオ」を持ってくるなんてことはしません。