テキストの大きさを自由に調整する

テキストの大きさを変えるHTMLコード例

<p style="font-size: 20px;">ダミーテキストダミーテキスト</p>

• 「ダミーテキスト」部分に、大きさを変えたいテキストを記入します。

• 「font-size: 20px;」は、テキストの大きさが20pxになるコードです。20px部分を自由な数字に変更して調整します。

編集画面の例

大見出し・中見出し・テキストの入力欄に、上記のコード例のようにサイズを指定したHTMLを入力すると、指定したサイズでテキストが表示されます（変更前は指定なしのデフォルトサイズ、変更後はコードで指定したサイズで表示されます）。

変更前

変更後

最適なテキストサイズは？

閲覧する端末によって変動しますが、デスクトップ環境では下記が目安です。PC・SPの見え方を確認しながら調整してください。

見出し（Headings）

見出しは、コンテンツの階層構造を示す重要な要素であり、本文よりも大きく設定します。

• 大見出し（h1）：24px〜36px以上

• 中見出し（h2、h3）：20px〜28px

• 小見出し（h4、h5）：本文サイズにやや近い、18px〜22px

リード文（Lead Paragraph）

リード文は、本文の導入部分であり、読者の興味を引きつける役割があります。本文よりも少し大きく、見出しほどは大きくないサイズが適しています。

• 一般的に：18px〜20px

本文（Body Text）

本文は、サイトの大部分を占めるため、最も読みやすさが重要になります。

• 一般的に：16pxが標準的で、最も読みやすいとされています。