CTAボタンのデザイン例

画像はここまで解説してきたことを踏まえた、CTAボタンのデザイン例です。これらを参考に、自社サイトのメインカラーやブランドイメージ、目的に合ったCTAボタンを作ってみましょう。

ボタンもテキストも！CTA作成・改善時のポイント

CTAのためのボタンやテキストの作成・改善をするときに、覚えておきたい4つのことを紹介します。これらを常に念頭に置くことで、CTAの効果をより高められるでしょう。

数を増やしすぎない

CTAのためのボタンやリンクは数を抑えて配置しましょう。特にCTAボタンが多すぎると押し売り感が強くなり、ユーザーに敬遠されたり、情報収集・読了の妨げになったりしかねません。

CTAボタンはWebページの中盤や最後など、ここぞというタイミングで表示させましょう。

選択肢は少なめに

CTAボタンは数を抑え、一度にひとつだけ表示させるのが鉄則です。しかし、「電話で問い合わせる」「メールで問い合わせる」など、複数のCTAボタンを並べなければならないこともあるでしょう。

この場合も、選択肢をなるべく抑えるのが鉄則です。選択肢が多すぎると選ぶことが面倒になったり、選ぶことに疲れてしまったりするものです。結局どのボタンも押されずに離脱されてしまう、ということも珍しくありません。

このことはコロンビア大学のシーナ・アイエンガー教授が提唱した「ジャムの法則」で立証されています。教授はスーパーマーケットのジャム売り場で試食販売を行います。このとき6種類のジャムを売るパターンAと、24種類のジャムを売るパターンBを用意し、どちらの購入率が高いのかを調べました。

結果、購買率は24種類のジャムで3％、6種類のジャムで30％となりました。このように、選択肢が多すぎると人は選べなくなることがわかっています。

配置にもこだわる

CTAボタンの配置にもこだわりましょう。Webページの途中にボタンを設置するなら中央、画面に常に表示するボタンは左下に設置するのがベターです。

人の目線は左上から右下へとアルファベットのZの文字のように動きます。横書きが前提のWebコンテンツでは特にそうです。この目線の動きにあわせて、ファーストインプレッションを残したい場合は左上に置くのが効果的です。

分析・改善をし続ける

CTAのためのボタンやテキストは、一度作って終わりではありません。ABテストを行い、データを集計・分析し、改善し続けることで、少しずつ成果を高めていきましょう。

具体的にはページの閲覧数や離脱率、ボタン・リンクのクリック率、遷移先でのCV率などのデータを集めます。

CTAの改善にはABテストが役立ちます。ABテストとはいくつかのパターンを用意し、それをページ訪問者にランダムに表示することで、最も成果の出るパターンを見つける方法です。

ABテストとは何か、どのように行えばいいのかは、こちらの記事で解説しています。

関連記事：ABテストとは？効果的なやり方のポイント・おすすめツール、検証ポイントまで解説