第12回:灰色を使ったホームページ 白と黒の間の灰色

自分のホームページに合う色の選び方(全12回)
第12回:灰色を使ったホームページ
執筆:坂本 邦夫(フォルトゥナ)
この連載では色のイメージとホームページの色が合わなければ、せっかく内容がよくできても、訪問者は中身を読まれず
に去ってしまうこともあります。この連載では訪問者のイメージに合わせることができるように、色のイメージとその心理
的な効果を説明し、色によって向いているサイトと向いていないサイトを解説していきます。
第12回目は灰色の持つ意味や心理的な効果、それに向いたホームページと向かないホームページについてまとめてい
ます。
白と黒の間の灰色
この連載もいよいよ最終回、最後の1色となりました。今回は灰色の使い方について考えてみましょう。
白でも黒でもない灰色は、「グレーゾーン」に代表されるようにはっきりしない場合に使われることが多い色です。ファッショ
ンなどでは無難な色として使われていますが、また同じ灰色でも明るい灰色と暗い灰色では受ける印象も変わってきま
す。
他のどの色と組み合わせられるか、写真と上手く見合わせられるかが、灰色を使う上でのキーポイントです。
暗い空は灰色の濃淡で明るい印象は感じられない
灰色のイメージと基本的な使い方
灰色で連想される
イメージ
陰気、穏やか、上品、疑惑、無機質、落ち着き、信頼、クール、スタイリッシュ、寂しさ、憂鬱、不安、
あいまい、地味、迷い、薄暗い
灰色で連想される
物
ビル、煙、灰、石、砂、ねずみ、コンクリート、雲、セメント、廃墟、都会、冬空
灰色の持つよいイメージはクールやスタイリッシュというところにあります。では全面に灰色を敷いたホームページがクー
ルかというとそういう訳ではありません。コンクリートやセメントのイメージから、冷たく無機質に感じられることもあります。
灰色をかっこよく見せるための基本は、黒や鮮やかな色を使って、しっかりと明暗で差を付けることと、直線的なパーツを
組み合わせることです。これによってぼんやりとした灰色が引き締まって見えます。
黒、鮮やかな色を組み合わせた灰色で引き締まった表現に
明るく柔らかい表現をしたいのであれば灰色はあまり向いておらず、はっきりとした白をつかうべきです。検索エンジンや
Facebookなどの背景は白です。そのような白いページから灰色のページに移動すると、どうしても暗く感じられてしま
います。暗さやおちついた雰囲気を表現したいという目的であればよいのですが、そうでなければ白を選ぶのが無難で
す。
大きな灰色の背景は暗く感じられ、明るいイメージを出したい時には不利になる
また曲線はもやもやしたイメージが出やすいため、灰色のシャープな部分を出したい場合には、できるだけ直線的な形
にします。もちろん雲や煙などの具体的なイメージがある場合には、曲線を使いましょう。
もやもやした灰色と直線の灰色
灰色が合う業種・合わない業種
灰色があまり主張をしない色であることから、写真やイラストなどを引き立たせるような業種で多く使われています。例え
ば写真家やデザイナーが自分の作品を展示するギャラリーページ、ファッションブランドなどがその代表例です。
赤や緑・青と言った色みのある色(有彩色と言います)を背景に使うと、背景の方が目立ってしまい、写真のよさを活かし
にくくなります。写真や作品で使われている色は様々で、どこにどのような色が使われているかわからないことも多いた
め、どんな色とでも合わせやすい灰色は、作品を見せるというホームページの目的に最適なのです。
並んだ写真の背景で使われた灰色。鮮やかな色は写真より背景に視線が向かいがち
またその無機質なイメージから、機械・金属部品を扱うような企業でもよく使われます。暗めの色や黒と組み合わせて使
われることも多いです。
さらに男性向けのページでは青系の色と、女性向けのページでは赤系や紫系の色・シルバーやゴールドと組み合わせ
られています。いずれもしっかりとしたきれいな写真があってこそ活きてくる配色です。他の色と組み合わせる場合には、
灰色の分量をできるだけ多く、追加する色をできるだけ小さく使うようにしましょう。そうしなければ地味な灰色は他の色
の強さに負けてしまいます。
男性向け・女性向けでよく見られる灰色の組み合わせ例
灰色はホームページでは主役ではなく、写真などの何かを引き立たせるための色であると考えて配色を行えば、灰色と
他の色のよさの両方が出て、少ない色数でまとまりのいい配色に仕上がります。
最後に
全12回の連載で、赤・青・緑・黒・オレンジ・ピンク・黄・白・茶色・紫・灰色と11色の色の様々なイメージや使い方につい
て解説してきました。これらの色のイメージや使い方はあくまで基本で、時には例外も存在します。
しかし、例外にたどり着くためには、ホームページの「目的」に合った色かどうかを考えて、基本から外れていてもよいの
かどうかを見極めることが重要です。ホームページの主役はあくまでも中身なのです。その大事な主役を作る人の好み
だけで損ねてしまうことがありますが、これはあまりにももったいない話です。
また一度決めた色を使い続けることで、訪問者に覚えられやすくなるという効果もあります。そのためにも最初に1色を
決めるときに、できるだけ慎重に考え、その後変えなくてもいいように、しっかりしたイメージを持って色を選ぶように心が
けましょう。
色選びの3つのポイント
1. 色を選ぶ場合には、「この色を使いたい」だけでなく、「この色は使わない方がよい」というマイナスのイメージや訪問
者の期待する色も合わせて考える
2. どんな色でも使いすぎると中身の邪魔をする。多く使いたい場合には文章が入らない部分の背景に色を使うように
する
3. どの色を選ぶか迷ったら、周囲の3人以上の人に聞くこと。1人だけに聞くと好みだけを言われ、意見が分かれるだけ
のこともある
坂本 邦夫(さかもと・くにお)
カラー&Webデザイン フォルトゥナ 代表
http://www.color-fortuna.com/
1973年、大阪府東大阪市生まれ。関西大学文学部史学地理学科卒業。
2004年、色彩に関するノウハウをまとめたウェブサイト「基礎からわかるホームページの配色」を公開。以後、W
eb制作コンサルティングを主な業務としながら、書籍や雑誌などへの寄稿・セミナーなどで、ウェブにおける色
彩環境の向上を使命として活動。日本色彩学会正会員。
主な著書に『ウェブ配色 決める! チカラ - 問題を解決する0からスタート
ホームページ配色入門』(ワークスコーポレーション)、『ウェブ配色 コーディネートカタログ』(技術評論社)など。
Copyright 2017 はじめてWEB All Rights Reserved.
http://hajimeteweb.jp/