もう迷わない「font-family」のベースを決めた

ポイント

• 多くのWebサイトが設定しているフォントを参考にする
• Webフォントを読み込まないで、Windows・Mac両方で問題なく表示される

文字サイズ

• Google推奨「16px」は可読性が高い
• 日本の多くのサイトは「15px」を使用

スタンダードなWebサイト

body, html {
   font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
   font-size: 16px;
   line-height: 1.8em;
}

トレンドを汲んだWebサイト

• 流行の游ゴシック体を取り入れる
• 文字コンテンツがメイン

body, html {
   font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiry;
   font-size: 16px;
   line-height: 1.8em;
}