webサイトをデザインする前に知っておきたい、色がもたらす心理効果【色彩心理学】
服を買う際、同じ色の色違いで迷うことはありませんか？
私はよく迷います。
同じ形の服なのに色が違うだけで受ける印象が違うため、
「自分に合うのはどっち？」
「着ていく用途を考えるとどちらの印象の方が合っているかな？」
と考えます。
このように色によって人に与える印象は異なります。
それは服だけに限らず、企業のロゴやwebサイトのカラーにおいても同じことが言えます。
今回はwebサイトのデザインを考える前に知っておきたい、色彩心理学についてお送りします。
色彩心理学とは
色彩心理学とは、簡単に言えば色がどのように人間の心理に影響を与えるかを研究する学問です。
耳にしたことのある人もいるかと思いますが、学問としての歴史はそう古くはなく、2003年に誕生した心理学の一種だそうで、心理療法にも活用されています。
では、学問の1つである色彩心理学が、なぜwebサイトのデザインと関係があるのでしょうか?
色彩心理学とwebサイトは似たもの同士
webサイトにはそれぞれ何かしらの目的があります。
コーポレイトサイトであれば、自社の情報の発信、顧客や株主に対しての報告、世間に対する信用の形成・企業イメージの形成など。
ECサイトであれば、ユーザーに商品を購入してもらうことや商品の詳細を知ってもらうことなど。
web広告のリンク先に使われているようなLP(ランディングページ)であれば、商品の注文や問い合わせの獲得など。
つまりwebサイトは人の心理に影響を与え、その人にある特定の認知・行動をとってもらうように働きかけるものと言えます。
webサイトを構成する要素として、内容はもちろん大切ですが、どのような色がどこに使われているか、という点も無視はできません。
したがって、webサイトを構成する要素の1つである「色」が、どのように人に影響を与えるのかを考えること、つまり色彩心理学はwebサイトの制作過程において欠かせない視点なのです。
逆に言えば、色彩心理学に対する知識を持つことで、webサイト上でどのような影響を与えるために何色を選べばいいのか、ということが見えてくるはずです。
それでは色彩心理学の世界では、何色がどのような影響を与えるといわれているのか、具体的に触れていきましょう。
赤は情熱や興奮、警戒など
赤といえば、赤信号、闘牛の赤いマント、戦隊もののリーダー、熟した果実の色などが挙げられます。
赤色は一説では、人に対して下記のような影響を与えるといわれています。
“赤は暖色の代表的な色で、あたたかみを感じる色です。赤に囲まれた部屋では体感温度が2~3°C上 がるという実験結果も報告されています。
これは赤の光が「交感神経」を刺激し、脈拍と体温が上がり 血流がよくなるためと考えられています。”
引用:カラーセラピーランド (http://www.i-iro.com/psychology)
つまり赤色は身体を興奮状態にさせる色、ということでしょう。
人が興奮状態にあるときとは、どんなときでしょうか。
自分の今までを振り返ると、警戒していたり、活動的になっていたり、感情が激しく動いたりするときだったと思います。
人間はときに原因から結果が得られたのではなく、結果から原因があったと認識することがあると聞いたことがありませんか。
「卵が先か、鶏が先か」のような話ですが、「感情的になったから興奮しているのか」「興奮したから感情的になったのか」というように区別できないこともあるのです。
赤色によって興奮状態になることで、警戒させたり、アクティブにさせたり、強いエネルギーを感じさせたりする効果があり、赤色は人の注意・注目を集めます。
webサイトでは赤色を申込みボタンや購入ボタンに使用することで、ユーザーに注目されやすくボタンを見逃すことを防ぎ、人を興奮・活動的にさせることで購買意欲に働きかけることができると言われています。
一方で、赤信号や止まれの道路標識など行動を抑制させる(=警戒を促す)色でもあるため、購買行動を阻止してしまうという説もあり、一概にwebサイト上でプラスの効果を発揮する色とは言えません。
また熟した果実が赤色であることから、「赤色=食べても良いもの」と認識されるため食欲をそそる色でもあり ます。
食品業界や飲食業界の企業ロゴ・ブランドカラーでも赤は使用されやすい色であり、マクドナルド・ケンタッキー・すき屋・コカコーラ・明治乳業などがロゴに赤色を使用しています。
オレンジはあたたかさや親しみなど
オレンジ色といえば、夕焼けや炎などの色が挙げられます。
全体的にあたたかい、陽気な印象を与え、親しみやすさを感じさせます。
さらに先ほど紹介した赤色と同様に、熟した果実の色の1つであり、消化や新陳代謝を良くして食欲を増進させる効果があると言われています。
そのためキッコーマンや吉野家のように食品業界や飲食業界の企業ロゴに使用されていたり、親しみやすさ・あたたかさを感じてもらえる特色からauのロゴマークに採用されていたりします。
生活に身近なBtoC商材のサイトであれば、オレンジ色を使用することで親しみやすさを感じてもらうと良いかもしれません。
黄色は明るさや希望、危険など
黄色といえば、光や太陽の色、蜂の色が挙げられます。
光や太陽のイメージがあるため、明るさや希望に満ち足りた状態をイメージしやすい、ポジティブな面をもった色です。
戦隊ものでもイエローは、明るくお調子者、陽気なキャラクターとして描かれやすいのも、この黄色のイメージ からくるのでしょう。
クールだったり、闇を抱えていたりするイエローレンジャーというものは見たことがないのではないでしょうか?
また自然界では黄色と黒の組み合わせを持つ生物は、「俺に手をだしたら危ないぞ」と外敵を威嚇していると言われています。
このような特徴を活かしたのが立ち入り禁止区域を区切るのに使うトラテープです。
黄色は単色では明るいイメージを与える色ですが、他の色との組み合わせ次第では警戒を促すこともできる色です。
緑は癒しや安定、健康など
緑といえば、植物の色が挙げられます。
植物や自然に触れることで癒されたりリラックスをできたりすることから、情緒の安定や健康をイメージさせることができます。
病院・クリニックのwebサイトに使われやすい色です。
さらに緑色は、あたたかいと感じる暖色と冷たいと感じる寒色の中間の色であり、刺激が少ないバランスの取れた色というのもあります。
青信号(「青」とは言うものの緑色)に使われているのもあり、「~することができる」「異常がない」状態も連想させられます。
赤色と同様、緑もそのような理由からwebサイトでは問い合わせボタンに使用するとクリック率が上がると言わ れていますので、赤ボタンと緑ボタンの両方を用意しABテストを行ってみると良いでしょう。
青は爽やか、落ち着きなど
青といえば、青い海や青い空、ダイエットを狙った食欲の低下などが挙げられます。
青い海や青い空の写真は透明感があってクリアな印象を与えますよね。
その印象を利用し、青を使うことで爽やかさを出すことができます。
また一時期、TVで話題になったこともあったと思いますが、青い色を視界に取り入れると勉強に集中できる、食欲が抑えられダイエットに効果がある、と言われています。
青は副交感神経を刺激して興奮を沈め、冷静になれる効果があると言われているからです。
そのため、飲食業界・食品業界ではあまり使われることがなく、爽やかさや冷静さというイメージを狙って堅い業界のブランドカラーに使用される傾向にあります。
また、人身事故防止のために青色の電灯を設置している駅のホームがあります。
これはスコットランドで青色防犯灯を用いたら犯罪が激減した、という実験の結果を元にしており、青色が人を 落ち着かせた結果と考えられています。
紫は神秘や高貴、性的なイメージなど
紫といえば、水晶や占い、袈裟の色などのイメージが挙げられます。
よく占い師の服の色や占いサイトで使用されているのを目にするのではないでしょうか。
占い師が持っているイメージの強い水晶玉。
これも、もともとの水晶の色の1つに紫色があるため「占い⇒水晶玉⇒紫」と連想する原因かもしれません。
また仏教では高位のお坊さんが身にまとう袈裟の色として使用され、聖徳太子の冠位十二階制度では最高位を示す色でした。
占いや宗教などでは、そのミステリアス、高貴なイメージから重宝されている色です。
また、紫色が好きな人は欲求不満、と言われることもあり、性的なイメージも持たれています。
筆者が中学時代に所属していた演劇部で、不思議な雰囲気を出すシーンのライトの色を話し合った際、部員は紫 色を候補に挙げましたが、大人が見るとアダルティなイメージがある、と顧問の先生から指摘を受けて別の色にしたことがあります。
観客が子どもであれば紫でも良かったかもしれませんが、コンクールの審査員である大人の視点に合わせた結果でした。
このように年齢やその人の人生経験によって、抱くイメージが変わる色でもあります。
黒は暗い、落ち着きなど
黒といえば、何も見えない闇や夜、タキシードや燕尾服などの正装のイメージがあります。
まず間や夜の色である黒は、すべての色を吸収し遮断する色です。
そのため怖い・暗いイメージを持たれやすい色です。
日本のお葬式で黒い服をまとって参列するのも、そのような負のイメージから来るのかもしれません。
また一方で、タキシードや燕尾服など正装の色も黒であり、黒は物を引き締めて見える効果があるため、ピシッとした・整った印象を与えます。
そのため会計事務所や監査法人などのホームページでは黒を使用して、落ち着いた・きちんとしたイメージをユ ーザーに与えることもできます。
白は医療やピュアなど
白といえば、白衣や洗剤、穢れのない純真無垢なイメージが挙げられます。
何色にも染まらない黒とは反対に、白は何色にも染まる色です。
「一切の汚れがない状態⇒清潔」というイメージや、汚れが目立つために医療現場の白衣に用いられることから、清潔さやクリーンな色と捉えられやすく、医療現場でよく使用される色です。
また「黒⇒闇」の対比の色として、「白⇔光」というイメージを持たれ、正義や純粋さなどを表す際にも使用されます。
ターゲットや目的に合わせた色使いを
商材・サービスによってユーザーに抱かせたいイメージは異なるでしょう。
また同じ企業のwebサイトでも、コーポレイトサイトか、特定の商品のキャンペーンサイトかでは目的が異なります。
目的が異なれば、それを達成するための手段も異なってくるように、webサイトの色使いも異なるはずです。
また、「なんとなくこの色で」・「好きな色だから」という理由よりも、「~~の印象をユーザーに与えられる から」と説明できたほうが、クライアントに納得してもらいやすいはずです。
今回の記事では触れませんでしたが、国によって色の持つイメージが異なるため、どの国・民族向けにwebサイトを作るかでも、選ぶ色は異なってくるでしょう。
奥深い色の世界。
この機会に詳しく学んでみてはいかがでしょうか?
参考：
