
デザインの良い、悪いを決める大きな要因であるコントラスト。
コントラストとは強弱、メリハリをつけることで、見る人に印象づけ、面白みをあたえるテクニックである。コントラストには2つの要素が必要である。2つの要素に違いをつけることで、生まれるデザインだ。
2つの要素に違いをつけるにはいろいろな方法がある。
フォントの大小、線の太さ、色、形、サイズ、余白の大きさなどで差をつける。この差、違いは少しではなく、大きくつけることがコントラストである。
今回はこのコントラスト(強弱)の方法について見ていこう。
コントラストは、読者をはっとさせてページ引き込むような視覚的な面白さを加えたり、異なる要素の間に組織的な構造を作りだすための効果的なデザイン手法である。
重要なのは、コントラスト効果を発揮させるには、コントラストは強く、大きく、大胆に行うということである。
コントラストは2つの要素が異なる場合に適応できる。コントラストの原則というのは、2つの項目が同じでないなら、はっきり違いを出すことで生まれる。
例えば、大きな活字と小さな活字で対比させる。太い線と細い線、寒色と暖色、滑らかな肌合いと粗い肌合い、小さな画像と大きな画像など、違いを大きくつけることで、情報をまとめ、ページデザインに面白みを与えることである。ページが面白そうに思えれば、そのページを読んでもらうことができる。
コントラストの原則は“コントラストをつけるのに臆病になってはならない” である。
(図1)の上部は「見出し」と「本文」にあまり差がない場合、下部ははっきりとした差を付けた場合。

(図1)
コントラストとは文字の太さやサイズによって階層をつくることだ。
本文より小見出しを小見出しよりタイトルを目立つように、心がけて大きくする。
コントラストは重要な箇所とそうでない箇所に思い切って強弱をつけること。差が大きくなると、遠くから見ても一目で内容が分かり、それだけで、全体の構造や重要な箇所を把握でき、理解しやすくなる。
ジャンプ率とは本文の文字サイズに対するタイトルや見出しの文字サイズの比率である。
ジャンプ率が低いと落ち着いた印象になり、逆に高いと躍動感が生まれる。また、注目すべき点が明確になり、読みやすくなる。絶対的な大きさではなく、本文に対するタイトルや見出しの相対的な大きさで決まる。(図2)の左はジャンプ率が低いデザイン、右は高いデザイン。

(図2)
ジャンプ率が低いものは、「じっくり読ませる」ようなコンテンツに向いている。
ソフトウェア開発に使われるアプリの「使い方マニュアル」などに多く見られる。
逆に高いものは、バナー広告やポスターやチラシデザインなどに応用するとよい。
ページ上のコントラストは私たちの目を引く。私たちの目はコントラストが好きなのだ。
コントラストを行うとき、同一ページにある2つの異なる要素は似せてはならない。コントラストを効果的にするには、2つの要素をはっきり意思をもって、異にすることだ。コントラストはデザインの善し悪しを決める大きなファクターであると考えよう。
コントラストは重要なところ、注目させたいところ、焦点を当てたい情報を整理し、強弱をつけることで、視覚的なメリハリを与えるということである。
そして、大きい=目立たせる。ということではなく、重要なものはより大きくし、重要でないものはより小さくすることでデザインで差異化をつけることである。つまり、明確な意思をもって、情報を階層化すること。それが「コントラストをつける」ということである。
この「コントラストの原則」を使い情報を階層化しあるECサイト構築し、訪れたユーザーにとって分かりやすく、面白みのある情報を提供していただきたい。