【検証】本物のデザイナーだけが知っているCVエリアのボタンは何色がよいか?

ふと気づいてしまった!
毎月何本もランディングページ(LP)デザインしているけど、いつの間にか私の中でCVエリアのボタンは緑色が鉄則!のような風習や決まり事みたいな考え方になっていて、広告クリエイティブに不可欠な「何故」という思考回路が機能していないのではと思ったのです。

デザインの量産をして横展開をしたとはいえ数十本ものボタンが全て同じ色というのに疑問をもたなかったのはちょっと問題ですね。

【関連記事】
CVエリアデザインのポイント。改善できればランディンページ(LP)は強くなる。

今回は、問題のCVエリアのボタンの色をまとめサイトからピックアップし、google検索から探してきたクリエイティブと比較検証してみてデザイン提案にいかせれる記事にしたいと思います。

ランディングページ(LP)のまとめサイトからボタンの色を調査

まとめサイトのランディングページ集めましたからデータを集めていきます。
※それにしても最近はあんまり集めてないのかな?情報が増えてない気がするけど

まとめサイトの調査条件

  • 商材ジャンルは美容・化粧品で、30サイト程CVエリアを確認してボタンの色をチェックしていく
  • 集めたデータは数値で紹介(尚、今回は純粋に色をみたいのでテキストの検証は行わない)
  • 確認するボタンはファーストビュー直下のCVエリアのみ
  • ファーストビュー直下にCVエリアが無い場合は、スクロールして最初のCVエリアのボタンをカウントする
  • CVエリアに複数ボタンがあり、且つ色が違う場合もあるが全てカウントする
  • 追尾ボタンはカウントしない
  • デザイン検証でもあるので赤やピンク、青や水色のように配色は細かくわける
  • リンク先のnot foundは無視する

まとめサイトの調査結果

さて、結果ですが、このような結果になりました。

緑と赤が同じ数です。最初は赤やピンクが多かったですが、古いランディングページを確認していくと緑が多くなりました。
もっと過去のページまでさかのぼれば緑色一強でしょう。

【関連記事】
CVボタンデザインって案外時間がかかる!だからまとめファイルを作成しよう

情報コンテンツぽいランディンページ(LP)に緑色のボタンを採用している傾向がありましたが、その中でもバランスよく配色してデザイン処理されたCVエリアがありました。

モイストゲルクレンジング


クリエイティブはこちら

様々な色が確認できましたが、多種多様な色はブランドカラーに合わせてCVボタンの配色を調整したものがほとんどです。
特徴的なのは白、黒、ベージュでランディングページ(LP)のメインカラーが白でテキストは黒メインならこのあたりのボタンの配色が使われます。他にも高級感があるページはベージュのボタンを採用していました。

プロージョン炭酸ミストハンディセット


クリエイティブはこちら

競合ページからボタンの色を調査

競合ページの調査条件

  • google検索で美容、化粧品、スキンケア、各訴求の掛け合わせから広告表示されたページを対象
  • まとめサイトのリタゲが効いているのでオーガニック検索わからなくなったので、ちょっと妥協してしまうが過去記事のURLから調査もする
  • まとめサイトと同じ調査項目で調べていく
  • 検索結果が記事の場合は省く

【関連記事】
【厳選】化粧品(コスメ)のランディングページ(LP)ファーストビューデザイン7選

競合ページの調査結果

さて、結果ですが、このような結果になりました。

集計はまとめページの半分ですが、競合ページの調査結果も緑と赤が同じ割合です。
仮説として様々な類似媒体からランディンページ(LP)を調査しても割合は変わらないかもしれません。
さらにCTAのテキストとボタンの配色を掛け合わすと何色が多いとか分かるそう。
夏休みの宿題として調べてみたいと思います。本物のデザイナーの道はまだまだ先ですね。

CVエリアデザインのポイント。改善できればランディンページ(LP)は強くなる。

2018.05.27

CVボタンデザインって案外時間がかかる!だからまとめファイルを作成しよう

2017.12.03

【厳選】化粧品(コスメ)のランディングページ(LP)ファーストビューデザイン7選

2018.05.20

ということで、ランディングページ(LP)のCVエリアのボタンは緑色が定番だが、そこそこ調査すると赤色がほぼ同じくらいあり、私のデザインの考え方が凝り固まったものだと分かりました。

スポンサード広告 by google