デザインの丘 EPISODE 06

目立たせる・まとめる
レイアウト4原則(後半)

4原則の後半は「目立たせる(強弱)」と「まとめる(近接)」。この2つが身につくと、ページの中で読者の視線を案内できるようになります。

目立たせる — 全部大事は、全部その他

「これも大事、あれも大事」と全部を大きく太くすると、結局ぜんぶ同じに見えます。強弱の基本は「1画面にスターは1人」。いちばん見てほしいもの(多くの場合、売りのひとことか、お誘いのボタン)を決めて、それだけを大きく。ほかは思いきって脇役にします。

ハムちゃん
ハムちゃんぜんぶ目立たせたくなる気持ち、痛いほど分かる…。でも全員主役の劇は、誰も覚えてもらえないんだ…。

まとめる — 距離が意味をつくる

人の目は、近くにあるもの同士を「仲間」と認識します。だから関係あるものは近づけ、関係ないものは離す。メニュー名と値段はくっつける、別の商品とはしっかり離す。写真とその説明文は近く、次の話題は遠く。文字にしなくても、距離が「これは仲間です」と語ってくれるのです。

4原則・総まとめ

ハムちゃん
ハムちゃん4原則がそろったね! 明日からよそのサイトやポスターが「あ、ここがそろってない」って見えるようになるよ。それが上達の証拠なんだ。
きょうのまとめ