投稿日時:

前回のWeb系コラムでは「色の持つ効果」についての第一回ということで、青を取り上げました。
今回は色シリーズの2回目として、「白」についてのお話をします。

「白」を使ったWebサイトを数多く目にする機会があると思います。実は「白」も青同様にWebサイトでもっとも多く使われている色の一つです。

明るい、清潔なイメージを「白」はもっています。「白」は背景色としても最もよく使われる色です。「白」が背景色にあるとき、その上にある文字や色がよりはっきり目立つという特徴があります。また暗い背景では、文字色としてもよく使われます。

ではそのような白の使い方に注意しながら、いくつかサイトを見ていきましょう。

rebeccaminkoff

ファッション系のWebサイトやショッピングサイトに多いことですが、背景色に白が使われています。これにより、さまざまな色を持つ商品画像が並んでいても、それぞれをしっかり目立たせることができます。

Visual Supply Co
  

背景色に白が使われています。非常に大きいほぼ無彩色のメインビジュアルの画像が、次々と移り変わっているのが特徴的です。画像の余白にも白が多く取り入れられています。
これによりポイントとなるカラーの金色が目立ち、少ない配色ながらも、コントラストの強さがより強調される構成になっています。ゆったりしたレイアウトが、その構成を支えているWebサイトです。

JUNGSIK 02jungsik

すっきりと清潔な印象を与えつつ、画像を引き立てている白の使い方です。
シンプルなデザインで、料理の彩度や明度のコントラストがうまくつかわれています。白が基本的な色になっているとき、どのような色が入ってもイメージ箱割れず、画像が大きい場合は大きなインパクトを与えることができます。

このように白は各パーツを分けてそれぞれをしっかり見せることができます。それにより、伝えたい情報をより強調して伝達することができます。余白には白を使っておくという使い方ではなく、各パーツの情報をしっかり伝えるために、余白の取り方も計算して幅をとることに留意するのも大事なWebデザインと言えます。

(担当:斉藤 万幾子