よい色とはウェブサイトの目的を達成させる色のこと

Googleなどの検索結果に画面のサムネイルなどは出ません。検索エンジンからウェブサイトに訪れる人は、どのような色が使われているページなのかはわからないのです。

ウェブサイトが何らかの商品を売りたい、サービスの内容を伝えたい、そして購入してほしいのであれば、これがウェブサイトの最も重要な目的ということになります。デザイナーや画家、写真家のページのように、見た目そのものがコンテンツであるという場合を除いて、色はウェブサイトの目的を達成するために使われるただの手段なのです。

また最近ではFacebookやTwitterからの流入も増えており、OGP画像をあらかじめ見てから訪問されることも増えています。これもOGP画像はリンク先のページを想像させ、クリックして訪問してもらうための「ただの手段」なのです。

色がただの手段であるならば、たいして重要なものではないと思われるかもしれませんが、それは違います。

既に検索エンジンやSNSで選別された、興味を持ってページに訪問してくれた人に対して、その期待に応える好ましいと思われる色や、スムーズにこちらの伝えたい情報を伝えられる色にしておく必要があるのです。 

それを踏まえた上で、ウェブサイトにおけるよい色とは、「美しい色をつくること」「ウェブサイトの目的に役立つ色をつくること」「ターゲットとなる訪問者に好まれる色をつくること」の3つのバランスがよく、ウェブサイトそのものの目的を達成する手助けになる色であると考えています。


図:ウェブサイトにとってのよい色とは、「美しい色」「役に立つ色」「好まれる色」の3つのバランスがよく、目的を達成させるための色のこと

美しい色をつくること

1つ目は美しい色のウェブサイトを作ることです。これは、家に客人を招く時に、快適に過ごしてもらうために掃除して待つというのと同じような事と考えられます。不快な色や不調和な色をあえて使うことはまずないと思いますが、訪問者に対して不愉快な気分にさせないために、きれいな色に仕上がるように、色彩調和論などを学び、その美しさでもてなすような色彩を作り出しましょう。

美しい色に対するアプローチも様々ですが、以下の2点くらいを学んでおくと、配色を論理的にすることができます。

色彩調和論に学ぶ

色彩調和論という言葉を聞かれたことはあるでしょうか? ピタゴラスやアリストテレスといった偉大な哲学者をはじめ、ニュートンやゲーテ、ノーベル化学賞を受賞したドイツのオストワルトなどの著名人を含め、多くの人によって、どのようにすれば美しい配色が作れるかということを数千年にわたって考えられてきました。先人達にならい、その中から使いやすい物を選んで使うのも一つです。

このウェブサイトではそれらを整理してまとめ上げたジャッドの色彩調和論などについて、少しだけ学ぶことにします。

自然の色をまねる

そして自然の色に学んでみましょう。少なくとも木々の緑や紅葉、夕焼けなどを見て不愉快に感じられる人は少ないと思われます。嫌いな人が少ないとわかっている色を、上手に使ってあげれば、多くの人にとって美しいと思われる配色が出来上がることでしょう。

ウェブサイトの目的に役立つ色をつくること

本来ウェブサイトを訪れてくれる人は何らかの情報を求めて集まっているはずです。企業のウェブサイトはもちろんのこと、個人の日記などについても同じようなことが言えるでしょう。

そのような訪問者に対して、読みやすい配色をするのは当然のこととして、情報の価値を高めるような配色をしなければなりません。

あなたが最も伝えたい情報を、スムーズに円滑に伝えるために誤った色彩の使い方をしないことは大変重要なことです。

これには色が持つ心身に与える効果や認知に関する機能を活用しなければなりません。

色彩の機能を使う

私たちは普段、知らないうちに色の影響下に置かれています。信号で止まるという状況の場合、「ああ、信号が赤になったから、車のブレーキを踏んで止まらなければならないな」などと、毎回考えている人はいません。

また交差点などで銀行を探す時には、看板の色で探すことはありませんか? 自分の使う銀行の色を記憶していて、銀行の名前よりも先に色で判断しようとします。

このように経験や教育などから得た色の知識を知らずに使っているわけです。ウェブサイトにも使いやすさや重要な部分の見つけ方に色の機能を利用することで、機能的な配色にすることが出来ます。

心理的・生理的影響を使う

色には心や体に影響を与えるという効果もあります。よく知られた例を挙げてみます。

  • アメリカのサンタクララ刑務所では、凶悪犯を収容する部屋にピンク色を塗ったところ、囚人の攻撃性が減りおとなしくなった
  • 自殺の名所として有名なロンドンのブラックフライア・ブリッジを黒から緑に塗り替えたところ投身自殺者の数が34%に減少した
  • 青は副交感神経に作用し、体温、血圧、脈拍を下げる効果があります。赤はその逆の効果を持っています

このような心理的な効果を利用して、色彩を決定していくことも可能です。具体的にどのような効果があるのかは、後ほど色彩の心理的効果のページで触れていくことにします。

訪問者に好まれる色をつくること

色を決めるにあたっては、どんな人が見てくれるのかという事を考えることが重要です。平たく言えば「あなたの好みだけで色を選ばず、訪れた人のことを考えて色を選ぼう」ということです。

ターゲットを考えた配色

例えば30代の男性に向けたモバイル製品のオンラインショップが、かわいらしいピンクを基調としたデザインだと購買意欲は沸くでしょうか? 対象の年齢や商品の性質から考えた場合、もっとシャープな印象を与える配色を選んだ方がよいでしょう。

美しいだけの配色では、本当に心に響く配色が出来上がるとは限りません。見てもらいたいターゲット層や商品、サービスの特性に合った色は何かを考えなければならないのです。

流行っている色・季節に合った色を取り入れる

長期間にわたって同じデザインで用いられるウェブサイトなら、流行色をそれほど意識することもありませんが、一定の期間ごとにイメージを変えられる場合などは、その時に流行している色などを取り入れるのもよいでしょう。

このような場合には、流行の先端としてファッション業界などの情報をチェックします。PANTONE社のウェブサイト(日本語)日本流行色協会のウェブサイトをご覧いただくと、現在流行色とされている色の情報なども掲載されています。

また日本には春夏秋冬のしっかりとした四季がありますので、季節感を考えた配色も重要です。それぞれの季節で皆さんは何色を思い浮かべるでしょうか?