Webサイト制作における「一般的に気を付けるべき」「通例とされている」事があります。
ここではそんな【業界あるある】をお伝えします。

【あるある】はたくさんあります。
今回はその1と銘打ちまして、いくつかご紹介していこうと思います。

しかし、【あるある】ってどういう事?と疑問に思う人も居ると思いますので…
第1回目となる今回は、これぞと思われる「緑色ボタン」をご紹介します!

緑色のボタンはコンバージョンにつながりやすい

Webでサービスを提供する機会は多くあります。
ECサイトで言えば、商品の提供・販売になります。

「購入はこちら」「買い物かごに入れる」「定期購入を申し込む」など、
消費者に案内するボタンがあります。
このボタンのクリック率(反応率)が良いのが緑色といわれています。
ECサイトでのクリック率は、お問い合わせや資料請求と違いダイレクトに購入につながりますので、
とても重要ですね!

どうして緑色が良いと言われるようになったのでしょうか?

これは2009年、Mozilla社がおこなった実験が元になっています。
Mozilla社は、Webブラウザーの「Firefox」の会社です。
1週間ごとにFirefoxダウンロードボタンの色を変更し、ダウンロード数に変化が出たかを実験しました。

↓↓実験ページ

Firefox is Green

     ボタンの色      クリック数
 緑 色  930,752
 青 色  256,344
 紫 色  255,894
 橙 色  255,811

この時、緑色が断トツでクリックされたことから、緑色が効果が高い…と言われるようになりました。

 

本当に緑色のボタンで効果は出るのか?

緑だから効果が出るとは限りません!これは、Mozilla社の背景色と、
ダウンロードボタンの色の「組み合わせ」も影響したと言えるからです。

 

赤のボタンの方が、コンバージョンが増える

緑ボタンの話とともに、赤ボタンの話もよく聞きます。

https://blog.hubspot.com/blog/tabid/6307/bid/20566/The-Button-Color-A-B-Test-Red-Beats-Green.aspx

こちらのテストでは、緑のボタンから赤のボタンに変更したところ、
赤の方が良い結果が出たと記載されています!

つまり、一概に「緑色」にすれば良くなる…とは言えないのです。

 

ただ、色が人に与える影響が大きいのは本当の話です。
心理学でいうと、緑が与えるのは「安心感」です。
Mozilla社の背景の色味との影響もあるとは思いますが、「無料サービス」であるFirefoxですので、
安心であることが気になるもの。提供するものと、消費者心理は密接につながっていると言えます。

 

緑色=安心
青=清潔感
赤=ぬくもり
オレンジ=陽気

 

ダイエットをしている時に青色の皿を使うと、食欲が落ちてダイエットに効果的!
また、逆に赤い皿を使うと、食欲がアップして良くない…そんな話も聞いた事があるかもしれません。
青は沈静の色。また逆の赤色は、興奮の色ですね!

赤ボタンが購入意欲を高めるのもまた、心理学的には正しい結果と言えます。

 

ボタンの色味だけでは、コンバージョンにつながらない

ボタンをクリックしてもらうには、色味だけではだめです。
平面の画面の中で「ボタン」と認識しやすいように立体感を出したり、誘導の加工を入れたり、
フォントを工夫してみたりと、色味以外にも気を付けるべき事がたくさんあります!

そして背景との色味。サイト内の色味と合わせ、変更していくべきです。

 

簡易的な入門本では「緑色にすべし」なんて言葉が見られますが、
安易に従うと、クリック率を下げる可能性もありますので、注意しましょう!

 

商品や顧客(消費者)に合わせて、正しい色味を選ぶことが大切です。

 

Written by Hirano