タイポグラフィの基本ルール｜文字だけで伝わるデザインの組み方

写真もイラストもないのに、文字だけでかっこいいポスターがあります。あれは特別なフォントを持っているからではありません。組み方で差がついています。

文字を読みやすく、意図どおりに見せるための組み方をまとめてタイポグラフィと呼びます。書体選び、サイズ、行間、字間、置く場所まで全部が入ります。

このレッスンでは、タイポグラフィが指す範囲、守ると崩れない4つのルール、キャッチコピーの改行、避けたいオルファンまで説明します。読み終えたら、文字だけのデザインを1枚組めるようになりますよ。

タイポグラフィ・フォント・カリグラフィーの違い

近い言葉が3つあります。指しているものが違うので、先に切り分けます。

言葉	指しているもの	ひとことで言うと
フォント	文字のデータ。游ゴシック、Noto Sans など	文字の素材
タイポグラフィ	その文字を選んで組む行為と、その結果	組み方
カリグラフィー	手で文字を美しく書く技術	手書き

フォントは道具、タイポグラフィは使い方です。同じ游ゴシックでも、サイズと行間と置き方で仕上がりはまったく変わります。だから「いいフォントを買えば解決する」とはなりません。

カリグラフィーは1文字ずつ手で書きます。ペンの角度や筆圧で線の太さを作る技術で、既にある活字を組むタイポグラフィとは作業そのものが別です。ロゴで手書き風の文字を作る仕事は、レタリング（1文字ずつ形を描き起こす作業）と呼び分けます。

タイポグラフィは読ませるための技術です。読みにくいのに雰囲気がある文字組みは、目的を外しています。

崩れない4つのルール

初めて文字だけのデザインを組むなら、この4つだけ守れば形になります。

サイズの3段階は、差をはっきりつけてください。見出しを本文の1.2倍にしても、差として伝わりません。1.5倍以上を目安にします。この考え方はジャンプ率で数字つきで説明しています。

書体を2種類にするときは、性格が違うものを組み合わせます。ゴシック体と明朝体、太いのと細いの。似た書体を2つ並べると、そろえ損ねたように見えます。

キャッチコピーは意味で改行する

キャッチコピーは、文字組みの差が一番出るところです。同じ言葉でも、改行の位置で読みやすさが変わります。

枠の右端で自動的に折り返すと、意味の途中で切れます。読む人はいったん頭の中で言葉をつなぎ直すので、そのぶん伝わるのが遅れます。改行は手で入れてください。

電車の中吊り広告や駅のポスターを見ると、キャッチはほぼ手で改行してあります。1行目と2行目の長さが近く、意味の切れ目で分かれている。次に乗ったとき、1枚だけ確かめてみてください。

最後の1つが一番早く判定できます。読んで詰まるところで切れていたら、改行位置が合っていません💡

オルファンを残さない

オルファンは、段落の最後に1語や1文字だけが取り残された行のことです。「オルファン＝孤児」で、仲間から離れた行を指します。段落の1行目だけが前の段の最後に残る形はウィドウと呼び分けます。

放っておくと、その1文字が余白の中で浮いて目立ちます。読む人は意味のない場所で目を止めることになります。

直すときに長体（文字を横に縮めて縦長にすること）をかけて無理やり詰めないでください。その行だけ文字が細くなって、かえって目立ちます。

文字だけで1枚を成立させる

写真もイラストも使わずに1枚組んでみると、タイポグラフィの練習になります。飾りが使えないぶん、判断が文字組みだけに集中するからです。

やることは3つです。主役を1つ決める・大きさで差をつける・余白で区切る。文字の大きさの差が主役を作り、余白がグループを分けます。

実例はスマホの設定画面です。写真もイラストもなく、見出し・項目名・説明文の3段階と余白だけで区切ってあります。文字だけでも迷わず読めるのは、大きさの差とグループ分けができているからです。

Appleの製品ページも同じ作りです。製品名を思い切り大きく、その下の1行を小さく。書体は1種類で、太さとサイズの差だけで主役を作っています。飾りの線も枠も使っていません。差をつける道具が大きさと余白しかないと決めると、こういう形になります。

埋めたくなったら、大きくするか、余白を増やす。飾りを足すより先に、この2つを試してください。

文字を極端に大きくして紙の端まで伸ばす、縦組みと横組みを組み合わせる、1文字だけ色を変える。この3つは、文字だけの構成で効きやすい手です。ただし1枚で1つまでにしてください。

ミニ実践：ポスターの工夫を3つ書き出す

10分の観察です。作る前に、見る目を作ります。

1. 好きなポスターや本の表紙を1枚選びます。駅で撮った写真でも、本棚の1冊でもかまいません
2. 書体が何種類使われているか数えます。たいてい1〜2種類です
3. 一番大きい文字と一番小さい文字の大きさを、何倍か目で見積もります
4. 改行の位置を書き写して、なぜそこで切ったのか考えます
5. 気づいた工夫を3つ、言葉にしてメモします

「かっこいい」で止めずに、「書体1種類・差は4倍・意味で改行」まで言葉にしてください。言葉にできた工夫は、自分の作品で再現できます◎

よくある質問

タイポグラフィとフォントの違いは何ですか？

フォントは文字のデータそのもの、タイポグラフィはそれを選んで組む行為と結果です。フォントを選ぶところから、サイズと行間を決めて配置するところまでがタイポグラフィです。同じフォントでも、サイズ・行間・配置の決め方で仕上がりは大きく変わります。

タイポグラフィの基本ルールを教えてください

4つです。書体は2種類まで、文字サイズは3段階、行間は文字サイズの1.5〜1.75倍、そろえる線を1本決める。この4つを守るだけで、崩れた印象は消えます。慣れたら書体1種類で組んでみてください。太さの差だけで作れると分かります。

タイポグラフィの仕事はいくらで請けますか？

文字組みだけを切り出して発注する仕事は、ほとんどありません。ロゴ制作、タイトル文字の作成、バナーや紙面のデザインといった案件の一部として見積もります。値段は成果物の点数と用途で変わるので、「タイポグラフィ一式でいくら」という相場は決まっていません。見積もるときは、制作物の種類と修正回数で考えてください。

おしゃれな文字組みにするコツはありますか？

足すより減らすほうが早いです。書体を1種類に絞る、色を2色にする、飾りを外して余白を広げる。そのうえで、主役の文字だけ思い切り大きくします。要素が少ないほど1つずつの判断がはっきり見えるので、整った印象になります。

次に学ぶこと

整理します。フォントは素材、タイポグラフィは組み方。書体2種類・サイズ3段階・行間1.5〜1.75倍・そろえる線は1本。キャッチコピーは意味で改行。オルファンは言葉を削って収める。

次は行間を数字で決められるようにしましょう。行間と文字組みで、用途別の目安と箇条書きの組み方までまとめています。

書体そのものの選び方はフォントと書体の基本とフォントの選び方へ。学ぶ順番はデザインの基本コースにまとめています。