ホワイトスペース

要素の周囲に意図的に取る、何も置かない余白。

解説

ホワイトスペースは、要素の周囲に意図して取る、何も置かない余白です。埋め残した隙間ではなく、読みやすさのために確保する領域を指します。白色である必要はなく、背景が何色であっても、要素が置かれていない部分をこう呼びます。情報を詰め込むほど、読む側はどこを見ればよいのか分からなくなります。

見出しの上を空ける、手順のステップ間を空ける、表のセル内に余白を確保する。こうした扱いによって、どこからどこまでが一つのまとまりかが目で分かります。見出しの上下を同じ幅にすると、その見出しがどちらの文章に属するのか読み取りにくくなります。上を広く、下を狭く取るのが基本の形です。

画面いっぱいに文字が詰まっていると、顧客は必要な箇所を探す前に読むのをやめます。手順を1ステップずつ離して置けば、いま自分がどこを実行しているかを見失いません。余白を取ると1画面に載る情報量は減ります。それでも、スクロールの手間より、探せないことのほうが問い合わせを生みます。

「空きがもったいない」「1ページに収めたい」という要望は、社内からよく出ます。余白を削って詰め込んだページが読まれず、結局は電話がかかってくれば、費用は別の場所で発生します。FAQの閲覧数や、記事を見た後の問い合わせ率を見ながら判断すると、見た目の好みではなく結果で話ができます。