読みやすいWebの文字サイズ。文章16pxが目安。最小12px

DTP→Webに脱皮中ですが、コーダー泣かせのデータを作っていました。プロとして両方できるよう違いを調べ中です。

「Webの文字サイズってどう決めればいいの！」の解決策です。

文字サイズ、文章16pxが読みやすい。12pxより小さくしない

覚えておきたいのは次の２つ。

• パソコンで読みやすい文字サイズは「文章=16px」
• Copyrightなど「最小サイズ=12px」

スマホは14pxくらいが読みやすいけれど、その辺はコーダーさんが考えて調整してくれるので、基本的には16pxを基準に考えることにしました。

文字サイズはデバイスで変わる。文字サイズを比率で指定

タイトルやサブタイトルは、DTPと同じで倍率で文字サイズを考えます。

• 見出しは1.5〜2倍を目安に調整
• タイトルは3倍を目安に調整

文字サイズはデバイスによって変わるので「ベースとなる親の文字サイズに対して何％か」でコードを書く事もあります。デザイナーが指定する文字の単位はpxですが、コードを倍率で書く場合cssの文字指定は「％、em、rem」が使われます。

読みやすさの基準

ターゲット層やデザインコンセプトによって、文字サイズや余白のとり方は変わります。考える時の基準として

• ターゲット層（年齢、見る場所、関心、体調）
• フォント（書体、サイズ、行間、太さ）
• 背景とのコントラスト
• 1行の文字数
• レイアウト（余白）

こういった点を気をつけたい所です。

でも具体的に「どんな人に、どのくらいの文字が読みやすいか」など、まだ確信が持てません。おいおい調べます！

DTP→Webスキルアップに役立つ本紹介はコチラ