ファーストビューのABテストで注目するべき5つの要素 ｜ SiTest (サイテスト) ブログ

ランディングページやウェブサイトで成果を上げるためにはファーストビューの質がとても重要になります。
しかし、ファーストビューにも様々な要素がありますので、どこをどのようにテストすれば成果が出るのかについては悩みどころです。

本記事では、ファーストビューのABテストで注目するべきポイントについて解説していきます。

ファーストビューのテストをするにあたって、変数はいくつあるのかをまず把握しましょう。
一般的なファーストビューの場合、以下のような5つの要素から構成されています。

上記の5つの要素がファーストビューでABテストを行うべき変数です。
ファーストビューのテストを実施する際には、上記5つの変数に対してどのようなクリエイティブが最適なのかを検証していけば良いわけですね。

では、それぞれの要素はどのように最適化ができるのか、順に解説していきます。

キャッチコピーで意識するべきポイントはいくつかありますが、大前提として「ユーザー目線に立つこと」です。
ユーザーが何を望んでいるのか、ユーザーが抱えている課題は何なのか、といったようにユーザー側から見ることで、離脱されないキャッチコピーを作ることができます。

ファーストビューのキャッチコピーを考えるうえでのポイントは以下の3つです。

最も重要かつ簡単にユーザー目線のキャッチコピーを作成できる考え方が「商品の機能ではなく、メリットを全面に押し出す」ことです。
これだけで、ユーザー目線にぐっと近くなります。

実際の事例として、借金問題解決のサポートをしている法律事務所のランディングページでは、以下のようにコピーを変更したところ、コンバージョン率が改善しています。

サービスや商品の内容ではなく、それらを使用した後に得られるメリットを記載してあげるとユーザーに刺さりやすいです。

また、ユーザーにメリットをしっかりイメージしてもらうためにも、専門用語や社内用語は避け、できるだけシンプルで短い文章になるよう心掛けましょう。

ファーストビューに表示する画像に関しても、とにかくユーザーの思考を意識しましょう。
ここで意識することは、ユーザーの属性です。

ファーストビューの画像は、ページ全体のデザインにも影響を与えることがあります。

また、ちょっとしたコツですが、ターゲットとしているユーザーが自分のことをどのように感じているかも重要です。
例えば、10代の学生が学生の画像を見たときに「自分はこんなに幼くない」と感じる場合もあり、逆に50代くらいの方が同じ年齢の人の画像を見たときに「まだこんなに年を取っていない」と感じる場合もあります。

いくつかの年齢層・性別なども試してみると良いです。

なお、上記の画像に関しては BtoC の面が強いですが、BtoB でも考え方は同じです。
ユーザーの目線に立ち、その商品サービスを使ったシーンを想像できるような画像を表示しましょう。

補足事項で意識することは「信頼感」です。
キャッチコピーの訴求が魅力的であっても、信用されなければ100％効果を発揮することができません。

そこで、定量的なデータや受賞歴などの情報を補足情報をファーストビューに追加することで信頼感をプラスすることができます。
また、信頼感だけでなくユーザーがアクションを取るハードルを下げる効果もあります。

よく使われる補足情報としては以下のようなものが挙げられます。

その他にも、競合との細かい差別化ポイントなども有効かもしれません。
どの訴求が最もユーザーに刺さりやすいのか、一つ一つテストしてみましょう。

どの組み合わせが良いのか、また、どの訴求がコンバージョンに影響しないのかを検証するために多変量テストしてみるのも有効です。

CTA の改善は、ファーストビューと同様に重要な要素ですので、詳細は別記事にてご紹介しますが、ポイントとしてはファーストビュー内かすぐ下に設置することを推奨します。
CTAをファーストビュー付近に設置するメリットは2つあります。

ファーストビューにCTAを設置すれば、ユーザーがアクセスしたタイミングでそのページの目的や役割を伝えることができます。
また、CTAを見ずに離脱するユーザーは入力フォームにも到達できませんが、CTAを見せることによって先につながる可能性が増えます。

各要素の最適化はここまでの内容で進められると思います。
最後にデザインについて解説します。

デザインといってもWebデザイナーのように高等な知識に基づく必要はありません。
Web担当者が意識することは以下の2点です。

全体の視認性を確認する

ファーストビューには様々な要素があります。
それらの要素がひと目でしっかり認識できるかどうかを確認して下さい。
特にテキストには注意して下さい。
背景画像、背景色、フォント等によって、文字が見えにくくなることは多々あります。
せっかく良いキャッチコピー、良い訴求でABテストしてもデザインのせいで正しい検証ができない場合もあります。

次のコンテンツが見えるように縦幅は気持ち短めにする

ファーストビューが画面ピッタリに収まっていると、その下にある次のコンテンツや情報が見えず、スクロール意欲を刺激できなくなってしまいます。
次にある情報をチラ見せすることで、ファーストビューだけ閲覧して離脱されることを防ぎます。

本記事では、ファーストビューに焦点を当ててABテストをする要素を解説いたしました。
ファーストビューを改善していくにあたって重要な考え方は2つです。
「ユーザー目線に立った訴求でユーザーを惹きつけること」と「次のコンテンツまでスクロールさせること」です。

これらを意識して要素を一つずつ検証していけば、着実にファーストビューが改善されていきます。

おすすめ記事

弊社の開発、販売するABテストツール「SiTest（サイテスト）」はヒートマップ解析機能とEFO（エントリーフォーム最適化）機能を備えたオールインワンのウェブサイト改善ツールです。
今回ご紹介した内容は、SiTest のABテスト機能で検証が可能です。

無料トライアルで全機能が体験できますので、お気軽にお問合せくださいませ。

→ 無料トライアルのお問合せはこちら

→ SiTest 概要資料のダウンロードはこちら