本文組みの文字サイズ・1行の文字数の基本とは?
縦組み・横組み問わず、本文組みにおける「文字のサイズ(級数)」、1行に組む「文字数」は、グラフィックデザイン・Webデザインにおいて、とても重要な要素となっています。「判型や段数数・画面のサイズ・ターゲットユーザーの年齢・読み易い文字数」等を考えて、文字のサイズ(級数)と1行に組む文字数を決定していきます。デザインの基本の中の基本的な事項ですので業界未経験者のグラフィックデザイナー・Webデザイナー志望の方は是非、この機会に理解して下さい。
1. 最初に組む方向を決定します
グラフィックデザインの場合
書籍や雑誌・広告・チラシのデザインをする前に、最初に「横組み」か「縦組み」か決定致します。原稿の内容、読者のターゲット属性や、著者の希望等を考慮して決定していきます。又雑誌でしたら右開きか左開きかルールが決まってますので、左開きの場合は基本的には「横組み」がメインとなります。雑誌は、特に右開きでも「縦組み」のみのレイアウト・組版にならず、縦組み・横組み、2種類が混在する場合も多いです。
Webデザインの場合
Webサイトの場合、ターゲットとするエンドユーザーの端末は「PC」「タブレットPC」「スマートフォン」いずれの場合も、基本的には横組みとなります。ブラウザーが横組みを基本として開発されており、又ページをめくって読むのではなく、上から下方向にスクロールして読むという性質がある為、視線誘導の計画が上から下、左から右という限られたフォーマットになっていますので、「横組み」が基本となります。
2. 読者対象を考慮して本文の文字のサイズを決定します。
グラフィックデザインの場合
壮年者を対象とする本(書籍・雑誌)の場合、12級以上が基本となります。文字が11級以下でしたら、可読性が落ちますので、少し大きく級数を設定します。基本的には11Q〜14Qの間で設定される事が多いです。本文組みの文字のサイズ(級数)が決定すると、小見出し、中見出し、大見出し、ノンブル等の他の要素の文字のサイズ(級数)も決定できるようになりますので、最初に本文の文字のサイズ(級数)を決定しましょう。
文字のサイズ(級数)の決め方のポイント
書体(フォント)によっても、同じ級数でも大きく感じたり、小さく感じたりするので、実際に仮の原稿で組んで検証を行ってから、決定するのがポイントです。その際は、必ずプリンターで出力して確認して下さい。
Webデザインの場合
Webデザインの場合は、基本的に本文はデバイスフォントで表示されます。エンドユーザーの端末によって、表示される書体(フォント)も異なります。一般的な文字のサイズは12px〜14pxが主流となっています。
表示させる書体を完璧にデザイナーが選択できない事がポイント
Webデザインの場合は、本文のデバイスフォントで表示させる、書体をWebデザイナーが選択できない事がポイントとなります。Mac、Windowsでも異なり、スマートフォンが普及した事によって様々な日本語フォントが搭載されていますので、完全にはコントロールできない状況になっています。
表示させる書体(フォント)を完璧にコントロールできない状況でも、文字のサイズを単位が「px」で指定できますので、必ずサイズだけはしっかりデザインする際に計画して決定して下さい。
3. 1行の文字数を決定します。
横組みの場合「35字から、多くても40字前後」
グラフィックデザイン・Webデザイン共通で「横組み」の場合は「35字から、多くても40字前後」が読み易いと感じる限界の数字が基本となっています。これ以上の文字数ですと、1行読み終わった後に、次の行の行頭の文字を目で探す際、右端から左端へ視線を移動する際に、移動距離が長いと、どの行を読もうとしているのか見落とし易くなり、可読性が下がります。もちろん「35字から、多くても40字前後」という基準の数字は読み易さを最優先に考えた基準の文字数ですので、これに限る必要はありませんが、デザイナー未経験者の方は基準となる数字を覚えておいて下さい。
視線の流れの例
下の例の通り、読んでいる人は行末「目のイラスト」のから、次の行の行頭「丸い印」へ視線を移動させます。この移動距離が長いと、行頭を見失いますので、文字数が重要なポイントとなってきます。この具体例では文字数を「41」文字で設定して組んでいます。
書体:ZENオールド明朝 – Regular
縦組みの場合「少なくて15字前後、多くて50字前後」
縦組みのデザインは基本的にはグラフィックデザインに限りますが、一般的に少なくて15字前後、多くて50字前後となっています。50字を越えると、横組みと一緒で、次の行の行頭の文字を目で探す際、下端(行末)から上端(行頭)へ視線を移動する際に、移動距離が長いと、どの行を読もうとしているのか見落とし易くなり、可読性が下がります。
視線の動きがポイントです!
グラフィックデザイン・Webデザインにおいて「本文の文字のサイズ(級数)、1行の文字数」の他に、レイアウト・文字のジャンプ率をデザイナーがコントロールし、ユーザー(読者)の視線誘導の計画を行います。グラフィックデザイン・Webデザインの基本は視線誘導の設計とも言われていますので、いかに1行の文字数の設定が重要か良く分かると思います。是非この機会に「視線の動き」「視線誘導」を意識してデザイナー未経験者の方はデザインをさらに勉強してみて下さい。スキルアップに繋がるはずです!
最終更新日:
併せて読みたい! デザイナーの為の組版・文字の組み方講座 | 和文本文組みのトピック
- アメリカ政府が開発したオープンソースライセンス フォント「Public Sans」
- フリーフォントを使用するのをやめよう!5つ厳選!世界の欧文フォントメーカー&販売サイト
- Typekit「モリサワ リュウミン」の日本語Webフォントの設定方法
- Google Fontsの日本語Webフォント「Noto Serif Japanese」の設定方法
- 括弧の正しい使い方と組み方の基本
- 温度の単位「°C」の表示方法と組み方の基本とは?
- 欧文の「見出し」の左揃えの基本
- 和文の「タイトル・見出し」の字間の基本
- 見出しにおける約物のバランスと合成フォント
- 和文本文組の和欧間の空きの設定
- a.m. と p.m. の正しい表記と組み方は?