この余白、どっちが正解？レイアウトにおける余白のセンスを磨いておこう

現場で使えるデザインセンスを、2択クイズで身に付ける「デザインクイズチャレンジ」。

DTPオペレーター・イラストレーターのhamkoです。

今回、私は「余白」についてのクイズを出題します。

早速ですが、3問クイズを出します。

以下の3つの作例を見て、AとB、あなたはどちらの「余白」がよいと感じますか？

1問目「横書き・二段組みの間隔」（難易度★）

2問目「レイアウト全体の余白」（難易度★）

3問目「印刷向けデータの余白」（難易度★★）

いかがでしたか？

私が考える答えは……

1問目の答え：B

2問目の答え：A

1．二段組みの「段間」はしっかり空けよう

まずは1問目を振り返りましょう。

あなたが読みやすいと感じたのはどちらでしょうか？

AとBの違いは「段組み」の間隔の広さでした。

「段組み」とは、文章を2つ以上のブロックに分けて配置するレイアウト方法です。

1行あたりの文字数を減らすことで、長い文章を読みやすくするのに用いられます。

私は「B」を正解に選びました。

Bのほうが「段組み」の間隔が広いため、段ごとのまとまりが明確になり、視線が自然に流れて読みやすく感じられるためです。

なお、こうした段組みのレイアウトで、隣り合う段の間にあるスペースを「段間」と呼びます。

ここで、あらためて作例A・Bを見てみましょう。

どちらも横書きの二段組みで、文章やフォントの種類、サイズは同じです。

ただし、Aの段間は狭く、Bの段間は広くなっています。

段間が狭いと、次のような理由で文章が読みにくいものになってしまいます。

• 下の行に進むべきか、右の行に進むべきか迷いやすい
• 文章がぎっしり詰まって見え、読む意欲が削がれる

読みやすい段組みにするには、段間を広めにとり、左右の段が別の文章のブロックだとわかるようにすることが大切です。

段間の広さは、段組みで使っているフォントのサイズを基準に考えるとよいでしょう。

少なくとも2文字分は確保したいところですが、横書きの場合は視線の移動が横方向になるので、もう少し広げたほうが読みやすくなります。

実際に、作例Aは1.5文字分、作例Bは3文字分に設定していますが、後者のほうが読みやすく感じられます。

このように、状況に応じて2文字分以上のスペースを確保することも検討しましょう。

なお、段間だけでなく、1行あたりの文字数（行長）も読みやすさに影響します。

行長について詳しく知りたい場合は、以下のクイズを参考にしてみてくださいね。

この文字間や行間、どっちが正解？文字の余白のセンスを磨いておこう

2．余白のとり方でレイアウトの印象が変わる

続いて、2問目を振り返りましょう。

どちらの作例も文字や画像などの要素は同じですが、配置や余白の使い方が異なります。

私は「A」を正解に選びました。

まずは、掲載内容を見てみましょう。

今回の作例は「ゴールドカードのオファー」です。

こうしたカードは社会的ステータスの象徴でもあることから、招待による特別感・限定感を演出するのが一般的です。

そのため、デザインにも高級感や余裕を感じさせる雰囲気が求められます。

あらためて作例A・Bを見比べてみましょう。

作例Bは、文字や画像が中央に詰まっていて余白が少ないため、やや窮屈な印象です。

視線を休めるスペースがなく、情報の見極めが難しくなります。

一方、作例Aは要素ごとに程よく余白を設けているため、全体を落ち着いて見渡しやすいレイアウトになっています。

余白を広くとることで、それぞれの情報を個別に認識しやすくなり、ゆったりとした印象が生まれます。

落ち着いた雰囲気や贅沢な空間の使い方は、高級感や特別感の演出につながります。

もちろん、お得感をアピールするチラシやDMのように、情報量の多さを重視するコンテンツでは作例Bのような構成でも問題ありませんが、今回のように高級感を重視する場合には合いません。

このように、余白の広さでレイアウト全体の印象が大きく変わることを覚えておきましょう。

3．印刷データでは裁ち落としも考慮した余白に

最後は、3問目の振り返りです。

この問題では、作例A・Bどちらにもトンボ（トリムマーク）がついていました。

トンボとは、印刷物を最終的なサイズにカットするための目印です。

実は、これが大きなヒントになっています。

印刷物は、最終的に上下左右を裁ち落とすことで目的のサイズに仕上げます。

このトンボは、その裁断位置を示すための重要なマークです。

トンボのパーツのうち、内側の線を「仕上がりトンボ」と呼び、このラインで断裁することを示しています。

それでは、あらためて作例A・Bを比較してみましょう。

それぞれを仕上がりトンボで断裁すると、以下のようになります。

作例Aと作例Bを比べると、作例Bは紙の端ギリギリに飾り罫が配置されていて、余白がほとんどありません。

一方、作例Aは、紙の端からしっかり余白をとっています。

オフセット印刷では、刷り上がった紙を重ねてまとめて断裁するため、断裁位置にズレが生じることがあります。

そのため、作例Bのように余白が少ないと、断裁が少しズレただけでデザインのバランスが崩れたり、最悪の場合は飾り罫が途中で切れてしまう可能性があります。

印刷物には物理的な制約があり、こうしたズレは特性上避けることができません。

デザインの段階で対策しましょう。

作例Aの場合は、断裁の位置から余裕をもって余白をとっているため、少しズレた程度でバランスが大きく変わることはなく、デザインパーツが欠けることもありません。

印刷物をデザインをする際は、断裁のズレを考慮し、余裕をもった余白を確保することが大切です。

こうした理由から、私は「A」を正解としました。

今回は飾り罫を例にしましたが、テキストや写真などその他のオブジェクトも同様です。

欠けたら困る要素は、断裁される位置から確実に離して配置しましょう。

まとめ：余白のセンスを磨くためのポイント

今回は「余白」に関するクイズと、適切な余白の扱い方を解説しました。

最後に、今回のノウハウのまとめです。

1. 段組みの段間は最低でも2文字分以上
2. 高級感を演出するなら余白はたっぷりと
3. 印刷物では、裁ち落とし付近に重要な要素を配置しない

記事内でご紹介した「エリア内文字オプション」や「グループ化」「生成拡張」といったIllustratorの機能を覚えておけば、余白の調整がスムーズに行なえますので、ぜひ活用してみてください。

今回のノウハウが、制作物のクオリティアップにつながれば幸いです。

お相手はDTPオペレーター・イラストレーターのhamkoでした。

本コーナーでは、あなたのデザイン力のアップにつながる様々なクイズが用意されています。
ぜひほかのクイズにもチャレンジしてみてください。


※本コンテンツは、デザイナーがそれぞれの視点で理想とするデザインを語っています。
クイズの正解はひとつではなく、あくまで参考としてご活用ください。