余白ってなんのためにある？デザインで「空白」が大事な理由を初心者向けに解説

「もったいないから情報を詰め込もう」——デザインを始めたばかりのころ、こう考えたことはないだろうか。

でも不思議なことに、情報を詰め込めば詰め込むほど「伝わらない」デザインになってしまうことが多い。その答えのカギが、余白にある。

余白とは「何もない空間」ではない

余白とは、デザイン上に意図的に作る「何も置かない空間」のこと。ホワイトスペースとも呼ばれる。

「空白 = 無駄」に見えるかもしれないけど、実は逆だ。余白は読み手にとっての「呼吸できる空間」であり、デザイナーが伝えたいことを強調するための「道具」でもある。

NOTE

「余白（よはく）」はデザイン用語として使われるが、実際には白い背景だけじゃなく、どんな色の背景でも「意図的に空けた空間」はすべて余白と呼ぶ。

具体的に考えてみよう。

チラシを作るとき、A4の面に文字・写真・ロゴ・キャッチコピーをすべてぎゅっと詰め込んだとする。

これが「余白がない状態」の実態だ。

NOTE

居酒屋のメニューと高級レストランのメニューを比べると一目瞭然。余白の量がブランドのイメージを左右する。

余白があることで、読み手の目が「どこを見ればいいか」を自然に判断できるようになる。

重要な要素の周りに余白をたっぷり取ると、その要素が「浮き上がって」見える。これが「目立たせる」技法のひとつだ。

近い要素は「仲間」、離れた要素は「別グループ」として人は読む。これをゲシュタルトの近接の法則という。

見出しとその下の本文の間隔を狭く、次の見出しとの間隔を広くするだけで、「どこまでがひとかたまりか」が自然に伝わる。

余白の「差」で情報の関係性を表現できる。均等に並べるより、意図的に差をつけることが大事。

文字と文字の間（字間）、行と行の間（行間）——これらも「文字レベルの余白」だ。

行間が詰まりすぎると視線が迷子になる。適切な行間（文字サイズの1.5〜1.75倍が目安）があることで、スムーズに読み進められる。

余白が多いデザインは「高級感」や「余裕」を感じさせる。高級ブランドのカタログや美術館のポスターが、なぜ広大な余白を使うのかはこのためだ。

逆に、余白を絞ってギュッとした構成は「お得感」や「活気」を演出できる。スーパーのチラシや年末セール広告がその例。

1つでも当てはまるなら、余白を意識的に増やしてみよう。

デザインの参考にしたいブランドやWebサイトを見つけたら、余白に注目して観察してみよう。

これを繰り返すだけで、余白に対する「感覚」が育ってくる。

NOTE

余白の具体的な取り方や数値設計についてはデザインで余白を正しく使うための5つの原則も合わせて読んでみてほしい。

余白は「空き」ではなく、デザインを機能させる意図的な設計だ。

余白の数値を具体的に計算したいときはこちらのツールが便利です。

このサイトの無料ツール

カラム幅・ガター・マージンをまとめて設計できる余白計算ツール
インストール不要、データはブラウザに自動保存。

jun

グラフィックデザイナー歴8年。印刷・広告・パッケージを中心に活動。制作現場で感じた「ちょっとした不便」を解消するツールを作り、このサイトで公開しています。