【思わずクリックしたくなる】魔法のCVボタンデザインの法則

こんな疑問にお答えします。

せっかく作ったサイトから問い合わせや申し込みが全くこないとしんどいですよね？ぼくも初めてサイト作成をした頃は反応が全くなくて悩んでいました。

CVボタンとはあなたのサイトにきたユーザーに行動を促すためのボタンのこと

もっとサイト評価を上げるためにやるべきことがボタンを変える？そんな方法でいいの？と思いますよね。ぼくも初心者の頃はCVボタンのことなんて気にもしませんでした。

でも実はCVボタンはとても奥が深く、結果の出ているサイトほど、常にテストを繰り返して最善を追求し続けているんです。

実際にぼくもCVボタンのデータをとり、改善をするようになってから驚くほどサイト評価が上がった経験をしました。

今回はそんなCVボタンについて、クリックされるために必要なことをまとめてみました。

この記事を最後までご覧いただくことで、あなたのサイトの改善点がわかり、問い合わせや申し込みの数に変化が現れるかもしれません。

これまでCVボタンを気にしていなかった方はぜひご覧ください。

クリックされるCVボタンのデザインとは

クリックされるCVボタンはどんな特徴があるのか？

デザイン面から整理してみましょう。

押せることが明確なデザイン

CVボタンは押せることが一目でわかるようなデザインにすることをおすすめします。

CVボタンなのかどうかわからないようなデザインで、スルーされてしまうともったいないですよね？

一目でボタンだとわかるように、

こうすることでこれはボタンだと認識されやすくなりすね。

クリック率の高いCVボタン色

以前は緑が最もクリック率が高いと言われていたんです。

ブラウザのFire Foxは緑、青、紫、オレンジで緑のボタンが一番クリックされたという結果を発表しています。

緑には「平和、安全、自然、爽やか、健康、癒し」というイメージがあります。

また、信号機の進めはどこの国に行っても緑。

ぼくたちは本能的に緑は安全、進めだと認識しているんですよね。

だから無意識に緑のボタンを安心してクリックしてしまうというわけです。

しかしこれは以前の話。

最近ではオレンジがいいといわれているんです。理由はAmazon。

訪問者が1番慣れ親しんでいるボタンの色が今はオレンジだということ。

ターゲットユーザーがその時、何に慣れ親しんでいるかをリサーチし、合わせる事で信頼性が増すわけです。

ちなみにこの記事の書き出しも、きっとあなたも普段使っているアプリをイメージしてもらえるように工夫してあります。

気づいてもらえました？

⬆ 最初に戻る

アイコンだけのCVボタンはやめた方がいい

CVボタンの目的によりますが、問い合わせや購入ボタンがアイコンだけだったら、騙されそうで押すのに勇気が入りますよね？

疑われたらおしまい、そのCVボタンは好奇心に溢れた人しか押さないクリック率の低いCVボタンになります。

ユーザーが安心できるよう、何のCVボタンなのか丁寧に説明しましょう。

CVボタンの位置はクリック率を変える

こんな構成のサイト、よく見ません？

知りたい情報の前に広告が多数出てきて、イラっとするあれです。

少し前までCVボタンはページの上部、中部、下部の3ヶ所に設置すべきと言われていたんです。

必要な場所に必要な分だけボタンを配置することは、ユーザーにとってもメリットになります。

CVボタンの位置、数は検証を繰り返してベストな方法を見つける必要があるんです。

クリックされるCVボタンのコピーとは

CVボタンに使用するコピー（文言）によってもクリック率は変わります。

ここからはクリックされやすいCVボタンのコピーについて解説していきます。

「送信」のCVボタンはクリック率を下げる

ソーシャルメディア専門家Dan Zarrella氏は以下のように発信しています。

送信ボタンのデフォルト テキストは「送信」なので、最初に行ったのは、このデフォルトを維持したランディング ページと、デフォルトを変更したページのコンバージョン率を比較することでした。40,000 を超える HubSpot のお客様のランディング ページを調べました。

「送信」というラベルが付いた送信ボタンのあるランディング ページは、他の文言を使用したページよりもコンバージョン率が低い傾向があることがわかりました。

私は人々に 5 つの異なるボタン (ランダムに並べたもの) を見せて、それらのボタンをクリックするように依頼しました (すばやく、あまり考えずに)。400 人以上がこれらのボタンの 1 つをクリックしました。

最もパフォーマンスの高いバリエーションは「click here」と「go」であることがわかりました。

Dan Zarrella：Don’t “Submit” To Landing Page Button Text

ぼくもサイト作成初期のころは『送信』とのみ表記されたCVボタンを設置していました。当然全くクリックされなかったわけですが、あなたもやってしまっていませんか？

もし使用しているようでしたら今すぐ変えましょう。

ベネフィットを伝える

CVボタンにはやることだけではなく、ユーザーのベネフィット（利益）を明記しましょう。

よく使われるのは『無料』です。

無料ならやってみようか？もしハズレだとしてもタダだしと思わずクリックしたくなりますよね。

緊急性を伝える

緊急性を伝えるために『今すぐ』は効果絶大です。

人は急ぐ理由がなければ、すぐに行動なんてしないんですよね。

後回しにすると絶対に後悔しますよ！とアピールしましょう。

数字を使う

数字を使うことでユーザーはより具体的にイメージします。

よりも

の方がボタンを押しやすくないですか？

説得力を持たせたい時、数字は強力なワードになるんです。

行動を誘うマイクロコピー

ボタンの前後に文字が添えられていることがありますよね？あれをマイクロコピーといい、実は重大な役割を果たしているんです。

マイクロコピーについては【悪用厳禁】マイクロコピーとは？人を動かすマジックワードの効果や使い方を徹底解説で詳しく解説していますので、ぜひご覧ください。

CVボタンはテスト検証して改善することが大切

クリックされやすいCVボタンの特徴、やめた方がいいCVボタンデザインについてお伝えしてきました。

では何が正解なのかは仮説と検証を繰り返し、数値データを分析するしかありません。なぜならCVボタンのクリック率は時代、ユーザー、あなたのサイトイメージなど、影響する要因が複数あるから。

CVボタンのクリック率分析はgoogleアナリティクスを使えば簡単にできます。

これまで

という方は無料で使えるツールですので今すぐ設定しましょう！