新聞を開くと、本文よりも先に見出しが目に留まります。この順序こそが、視覚的な階層構造の働きです。デザイナーは、サイズ、色、コントラスト、間隔、位置などを工夫して要素を配置し、読者が意図した順序で情報を見られるようにしています。目的は装飾ではなく、読者を導くことです。階層構造のないページでは、読者は何が重要かを自分で判断しなければならず、ほとんどの人はそれをしようとはしません。

サイズは最も直接的なツールです。大きな見出しは小さなキャプションよりも目立ちます。色とコントラストはより繊細な効果を持ちます。灰色のフォームに赤いボタンが1つだけあると、パターンが崩れるため目を引きます。位置も重要です。欧米の読者は左上から右下へと視線を移動させるため、重要なコンテンツをその経路に沿って配置すると効果的です。余白はここで静かに効果を発揮します。要素を周囲に空白で囲むことで、線や枠を追加することなく重要性を伝えることができます。

階層構造を構築するためのツール

• スケール：大きい要素から先に読み取る。
• 対照：大きな違いは注目を集める。
• 色彩：暖かく彩度の高い色合いが主流となる。
• 間隔：孤立は重要性を暗示する。

すべてが主張しすぎると、階層構造は機能しなくなります。すべての要素が太字で大きく、色鮮やかだと、何も際立ちません。抑制こそが、強調を効果的にする鍵なのです。