コントラストは違いを際立たせます。大きさ、色、太さ、形、間隔など、さまざまな要素のコントラストが考えられます。大きな見出しと小さな本文はコントラストを生み出します。グレーのフォームに鮮やかな赤いボタンを配置するのも同様にコントラストを生み出します。コントラストがないと、デザインは平坦になります。すべてが等しく競い合い、何も際立ちません。逆にコントラストが強すぎると、ページがごちゃごちゃして、視線が落ち着く場所がなくなってしまいます。

コントラストは単なる美観の問題ではありません。読みやすさにも影響します。背景とのコントラストが低いテキストは読みにくく、特に視覚障害のある方にとっては読みづらいものです。ウェブコンテンツアクセシビリティガイドラインでは、通常の本文テキストのコントラスト比は少なくとも4.5対1と定められています。デザイナーは輝度差を計算するツールを使ってこれを確認します。高コントラストは明るい日光の下や低品質の画面でも見やすく、低コントラストは雰囲気作りに役立ちますが、意図的な選択であるべきで、偶然にそうなってはなりません。

コントラストを生み出す方法

• サイズ：大きいサイズと小さいサイズ。
• 色：補色関係、または暖色系か寒色系か。
• 重量：太め vs. 細め。
• 空間：混雑した空間と孤立した空間。

コントラストは意図的に用いることで最も効果を発揮する。画面ごとに強いコントラストを一つだけ用いる方が、互いに競合するコントラストを五つ用いるよりも効果的な場合が多い。