CVR（コンバージョン率）を高めるためには、コンバージョンボタンの工夫が欠かせません。
配置やフォントサイズ、配色などのデザインを見直すと、今までユーザーをコンバージョンまでたどり着かせることができなかったWebサイトも、大きく効果を出すことができます。
そこで今回は、CVRを高めるコンバージョンボタンを作成するポイントについて紹介します。
目次
そもそもコンバージョンボタンとは何か？
コンバージョンボタンとは、Webサイトに訪問してきたユーザーが、商品の購入や問い合わせなどの具体的な行動を起こすきっかけとなるボタンのことです。「CTR（コール・トゥ・アクション）」とも呼ばれ、ユーザーの具体的な行動を喚起します。
例えば、ECサイトで商品を購入するとき、ユーザーは必ず決済ボタンをクリックします。
このボタンを押したことをきっかけに、ユーザーは訪問者から顧客に転換（コンバージョン）したとみなされます。
コンバージョンボタンの完成度とCVRには密接な関係があります。
例えば、AI技術を活用した事業を展開する株式会社WACULは「コンバージョンボタンのテキストに補足の文章を追加すると、CVRが約1.45倍になった」という調査結果を発表しています。
「資料請求」などのシンプルなテキストよりも「3分で分かる△△資料ダウンロード」などの具体的な文言の方がユーザーは行動を起こしたくなる、という結果が数字に表れています。
このように、思わず「押したい」と思わせるボタンを作ることは、CVRの向上にとって非常に重要です。
参照：縦長LPはコンバージョンに寄与するのか？BtoBにおけるランディングページ(LP)のベス
トプラクティスに関する調査
CVRを高めるコンバージョンボタンのポイント
では、デザインにおいてはどのような工夫を施す必要があるのでしょうか。
ここでは、効果の高いコンバージョンボタンを作成するポイントについて解説します。
配置
ユーザーの視界に入りやすい場所にボタンを配置することが大切です。
長い文章を下までスクロールしてようやく見つけられるボタンよりも、ページを開いた瞬間に視界に飛び込んでくるボタンの方が、押される確率は上がります。
ひと目見て「このボタンを押せばアクションが起こる」と分かるような配置が大切です。
色
MozillaのFirefoxのダウンロードボタンで行ったテストでは、緑色のボタンの方がクリック率が高いというデータがでており、そこから現在までコンバージョンボタンの色は、一般的に緑色が有効だといわれてきました。
しかし、株式会社ビーワークスが行った調査では、必ずしも緑色が有効とはいえず、ターゲットユーザーや商材、企業イメージなどのさまざまな条件によって変化することがわかります。
「どの色のボタンにするか」にこだわるよりも、自社のイメージや狙うターゲット、または「サイト全体の中でボタンが適度に目立っているか」などを重視して色を選ぶと良いでしょう。
参照：Firefox is Green｜Blog of Metrics
参照：【検証】クリックされるボタンの色は？｜WebNAUT
大きさや距離
インターフェースの予測モデルとして「フィッツの法則」が挙げられます。
ユーザーのマウス操作において、ボタンなどのクリックする対象が大きいほど、または距離が近いほど選択しやすくなる、という法則です。
フィッツの法則では、マウスポインターを指し示しやすい場所は次の4箇所だと説明しています。
- ・現在マウスポインターがある場所
- ・ディスプレイの四隅
- ・ディスプレイの上下左右の4辺
- ・マウスポインターからなるべく近く、面積がより大きいもの
この法則から、コンバージョンボタンのサイズを大きさや位置は、CVRを高めるために重要だということがわかります。
CTA
ユーザーが行動したくなるような分かりやすい言葉を使いましょう。
例えば「商品詳細」ではなく「詳しく見る」「今すぐ調べる」など、ユーザーが普段から使う言葉を意識すると、ユーザーの目にもとまりやすくなります。
ユーザー側にある表現に変更することが大切です。
フォント
ボタンの文字を読みやすく目立たせる工夫も大切です。
文字を太字にしたり、目立つフォントに変更したり、ページ全体の文章に対してボタンの存在が際立つようにすると良いでしょう。
コンバージョンボタンを作成する際の注意点
続いて、コンバージョンボタンを作るときに注意すべきポイントを紹介します。
必要以上に加工しすぎない
ボタンを目立たせることは重要ですが、やりすぎると逆効果になってしまいます。
例えばボタンを多く設置しすぎると、ユーザーはどれを押せば良いのか迷ってしまい、決定を回避する傾向があります。
一つ、興味深い実験を見てみましょう。
コロンビア大学のシーナ・アイエンガー氏による「ジャム実験」では、ある食料品店で6種類と24種類のジャムをそれぞれ別の場所に並べて、試食コーナーに立ち寄る客の様子を観察しました。
試食した人数は24種類のコーナーの方が6種類並べたときよりも40%多いという結果でしたが、実際にジャムを購入したのは6種類のコーナーが全体の30%だった一方で、24種類の場合はわずか3%だったそうです。
この結果から、「選択肢が多すぎると判断が難しくなる」ということが分かります。
どうしても複数のボタンを設置しなければならないときは、ボタンの大きさを変えるなどの方法で優先順位を付けると良いでしょう。
参照：Sheena Iyengar|TEDSalon NY2011
誤解を与える文言にしない
「ここをクリック」や「メールを送る」など、ボタンを押した後に何が起きるかが分からない文言は、ユーザーに不安感や抵抗感を与えてしまいます。
「今すぐ相談する」、「空メールで登録する」などの分かりやすい文言で、そのボタンがどんなアクションを起こすのか明記することが大切です。
コンバージョンボタンの効果検証
コンバージョンボタンの効果を検証する手法の一つに、「A/Bテスト」があります。一つのコンバージョンボタンに複数のバリエーションを用意してユーザーを振り分け、どれがもっとも良い結果になるかを検証するテストです。
例えば50%のユーザーにはコンバージョンボタンが赤色のページ、残りの50%には緑色のページを見せます。
テストを行う際、バリエーションは一つの要素以外すべて同じにします。
ボタンの色のみを変更する、フォントのサイズのみを変更するなどです。
A/Bテストを行うと、自社にとって有効なコンバージョンボタンがどのデザインなのかを知ることができます。
なおテストの際は、「ボタンのサイズを変えればクリック数が増加するのではないか」など、予め仮説を事前に立てておくことが必要です。
コンバージョンボタンを使った成功事例
動画配信サービスのNetflixは、ページに訪れた瞬間に会員登録のための赤色のコンバージョンボタンが視界に入るデザインが特徴的です。明度の低い背景を設定し、白のテキストと赤のボタンを目立たせています。
「登録を開始」という文言を使い、ユーザーの能動的な行動を促す工夫がされているのも特徴の一つです。
また、ページを下にスクロールしていくと、「よくある質問」の下に再度コンバージョンボタンが設置されています。
まとめ
ここまで、CVRを高めるためのコンバージョンボタンの作り方について紹介してきました。
CVRを増加させるための施策はCTR以外にも、LPのレイアウトや、テキストの使い方など含めると多岐にわたります。
今回の記事のコンバージョンボタンが全てではないですが、配置、デザイン、配色、文言などに注意して、ユーザーが迷わず押せるボタンに仕上げることが大切です。
また、CTAの効果検証を実施する際には、複数の要素を一度対応するのではなく、一つひとつみたい指標のそばにコンバージョンボタンを設置するのも、直感的に商品やサービスを理解した感覚のままクリックへと行動を移せるため有効です。
この記事をシェアする