webサイトのお問い合わせボタンは何色にすべき？
by C研 ｜
webサイトに設置するCall to action（例えば「お問い合わせ」「ダウンロード」）のバナーボタンは何色にすればよいいでしょう。色によって大きく差がでるのでしょうか。もし、差が出るのであれば、ぜひ改善したいところです。赤系がいいとも緑系がいいとも言われていますが、実際のところはどうなのでしょうか。
今回は、ボタンの色を何色にすべきか考えてみます。
緑のFirefox
まず最初に、Firefoxの話です。
Firefoxは１週間ごとにバナーボタンの色を変えて（緑、青、紫、オレンジ）、そのダウンロード率を調査しました。その結果、緑のボタンがダウンロード率が高かったという結果が出ています。
ただしよく見ると、その差は1%程度。多くのトラフィックがあるFirefoxでは1%は大きな差ですが、これを有意差と考えるかは意見が分かれるところでしょう。
アパレルブランドのローラ・アシュレイも同様のテストを実施し、緑色のほうがそうでない場合に比べて11%良い結果が出たとしています。実際にローラ・アシュレイのサイトは緑色のボタンです。日本ではVectorも緑色のボタンですね。
ローラ・アシュレイ
Vector
赤のほうがいいという結果も…
では緑色がいいのか。
Hubspotの調査では逆の結果が出ています。
緑と赤で比べて、赤のほうが21%もいい結果を出したとしています。
赤は「情熱的」で目立ちますが、「注意！」という意味もあります。赤はあまり良くないという説もありますが、これを覆す結果です。
※Hubspotより転載
ちなみに、Hubstpot自体はオレンジ色のボタンを使っています。
amazonのボタンもオレンジですね。amazonに慣れている人が多い現在では、オレンジもなじみ深いのでしょう。
まとめ
ボタンの色について海外の事例を紹介しましたが、日本では感じ方が違うかもしれません。例えば、緑色は海外では病院を連想させますが、日本はそうでもないように思えます。また、サイト全体のデザインとの兼ね合いも考慮する必要がありそうです。
緑なのか、赤なのか、オレンジなのか。
テストをして、自社で最も良い色を選択することをおすすめします。
(↓ バリュードライブも試行錯誤中)
参考記事：
Firefox is Green
maxymiser Case Studuies
The Button Color A/B Test: Red Beats Green
