ランディングページの正しいABテストの方法｜具体的な手順や参考パターンも紹介

運用中のランディングページ、しっかりと運用できていますか？サイトを有効に使い成果を出そうと思えば、地道な分析・改善は必要不可欠です。ランディングページが自社商材の販促を担い、しっかりと機能するかどうかは、改善が正しくできているかどうかにかかっていると言っても過言ではありません。

そして、改善を効果的にする作業の中でも、ABテストは欠くことができないものです。今回はABテストとは何かという基本を解説するとともに、実際のABテストのやり方を手順に沿い具体例を交えながら、わかりやすくお伝えしていきます！

この記事を読んだらわかること

・ABテストとは何か。
・ランディングページにとって改善がどれだけ重要か。
・ABテストでよくある間違い
・ランディングページのファーストビューやアクションにおけるABテスト参考パターン
・具体的なABテストの手順
・ABテストが簡単にできるGoogle オプティマイズの使い方

目次【表示】

WEBコンサルタントのご紹介

弊社は、上場企業も含め300社以上のランディングページ制作に携わってきました。
ランディングページは、企画構成が重要で、これを怠ると思うような結果は出ません。
我々は数多くの制作実績から蓄積された経験と企画構成力で商材に合わせた売れるためのランディングページを提案できますので、お気軽にご相談ください！

ZERO式ランディングページ制作はこちら

ABテストとは？

ABテストとは、ランディングページ内の一部コンテンツを複数パターン同時に試して、どちらが効果であるのかを分析する作業です。例えばコンバージョンボタンの大きさや色、ファーストビューの画像・コピーなどの細かなパーツを変えた時、どちらがユーザーにより支持されるのかを実践レベルで知ることができます。

ランディングページの売上を伸ばすためには不可欠

ランディングページを制作して配信しただけで商材が売れるようになるわけではありません。コンバージョンを向上させるには、サイトの改善・最適化がどうしても必要です。

ABテストをくり返すうちに、自ずと売れるランディングページに育っていくケースもあります。地道で大変な仕事ではありますが、ランディングページの問題点を改善・最適化し成果につなげるためにはABテストを避けて通ることはできません。

連動させる広告も、もちろん改善・最適化が必要ですが、肝心の流入先であるランディングページがユーザーにとって魅力あるものでなければ、リスティング広告等も意味をなさなくなってしまいます。

ABテストでよくある間違い

ABテストはプロにしかできない難しい作業ではありませんが、ともすると重大なミスをおかしてしまいがちです。

ここでは、ABテストを行ううえでよくある3つの間違いについて解説していきます。

ランディングページに合わせて広告文も変更してしまう

ランディングページの流入経路として最も有力なメディアの1つであるリスティング広告は、キーワードや訴求ポイントをランディングページと揃えるのが基本セオリーです。

しかし、ABテストを行っている最中には、リスティング広告のコピーやキーワードを変更してしまうと、広告になびくユーザー層が変わってしまいます。つまり、変更した広告文に惹きつけられたユーザーがランディングページを訪れることになるのです。

例えば、肌荒れに効果的な化粧水のランディングページで、肌荒れと乾燥肌という2種類の訴求ポイントを使ってABテストをするとしましょう。

広告文において『肌荒れに効果的』としていた部分をランディングページにあわせて『乾燥肌に効果的』と変更した場合、反応するユーザー層が変わってしまうおそれがあるのです。こうしたズレが起きないよう、表記を『肌荒れと乾燥肌』にするなど工夫しましょう。

データ量が溜まっていないのに改善してしまう

ABテストを行うタイミングが早すぎると、データが蓄積できていない分、正しい比較検討ができないことがあります。データがしっかりと溜まって機が熟してからABテストを行うようにしましょう。

統計的な信用性が欲しいので、なるべく多くのデータが溜まるのが望ましいですが、少なくともクリック数が300～400回程度になるまでは情報をストックされることを強くおすすめします。

一度にいっぺんに改善してしまう

ABテストは、たとえ面倒でも、あるパーツに限定して1箇所ずつ改善して行うようにしましょう。同時に何箇所も実施してしまうと、仮に効果が見られた場合でも、どの改善が効果的だったのかわからなくなるためです。

1箇所ずつ行えば、その改善が成功だったか失敗だったか一目瞭然となり、地道な作業で大変だったとしても、結果的にはそちらの方が着実。コツコツと1つずつの課題をクリアすることで、コンバージョン向上の可能性も高まります。改善する順番は次にお伝えします。

改善する順番は？

ABテストのための改善を行う順番としては、まず始めにファーストビュー、次がアクションボタンそのものかアクションボタン周辺です。この2ヶ所をどのように改善すべきかは後ほど詳述しますが、いずれにしても改善を最重視するべきなのはファーストビュー周辺かアクションボタン周辺です。ボディ・コピーと呼ばれる中間部分の情報コンテンツは二の次となります。

ランディングページのファーストビューやアクションにおけるABテスト参考パターン

ランディングページ最適化に必須のABテストで、率先して改善されるべきパーツはファーストビューやアクションボタン周辺であると先ほどお伝えしましたが、ここでは具体的にその2ヶ所をどうテストするのか、具体例を挙げて解説します。

ファーストビューのメイン画像

ランディングページを訪れたユーザーは、ファーストビューを見て一瞬でそのページに留まるか離脱するかを決めるものです。つまり、コンバージョン以前に、ランディングページを終盤までしっかりと読んでもらうためにはファーストビューでユーザーの心をつかまなくてはなりません。

ファーストビューの中でも最も目立つのがメイン画像です。メイン画像の候補となるものには、商材そのもの・人物・イメージ画像などいろいろありますが、例えば商材ならば、AとBどちらのカラーの商材画像が良いのかをまず試して、より効果的だった方を選びます。

仮にAのカラーの画像の方がユーザーに受けていることが分かったら、次はAのカラーの商材をどの角度で撮った画像が良いのか、再びAとBを用意して試してみます。このようにして、次々にベターなものを選択していくのです。

ファーストビューのメインコピー

溜めておいた統計データを元にランディングページのユーザー層を分析し、商材がその層に訴求できるポイントをコピーに反映させることが重要となります。例えば、先ほども例に挙げた化粧水などの場合、性別や年齢層によって求める効果は異なるものです。

購買対象が若年層であればニキビや周期的な肌荒れにフォーカスするのがベターでも、中高年層をターゲットにする場合には『シミ・しわ』といったエイジングケアをテーマにしたコピーの方が、絶対的にユーザー心理に刺さります。その中でさらにキーワードやセンテンスをABテストにかけて、より響いたものを選択していきましょう。

アクションボタン

アクションボタンは、コンバージョンに直結する非常に大切なパーツです。ここでは、ABテストでアクションボタンを改善するパターンとして主に挙げられる4種類をご紹介します。

・ボタンの大きさを変える
コンバージョンボタンの微妙なサイズでコンバージョン率が変わることもあります。
・色を変える
ボタンカラーを変えただけでもユーザー心理に影響すると言われます。
・配置を変える
導線を改善すれば、コンバージョンへ誘導できます。
・アクションボタンのコピーを変える
ついつい押したくなるような、コンバージョンのハードルを下げるコピーを試しましょう。

上記4パターンの中でも最も重要なのがコピーを変えることです。「登録」を「無料登録」に変えたり、「資料請求」から「資料をダウンロード」に変えたりするだけで、コンバージョンに変化が見られる場合も。具体的に簡便性などのメリットをイメージできる魅力的なコピーを考案することが大事です。

ファーストビューの後の導入部分

ランディングページのファーストビューは、その後もサイトを読み続けてもらえるかどうかの勝負どころではありますが、ファーストビューの直下もボディコピーへの橋渡しとしてかなり重要です。

この導入部分には、商材ユーザーからの高評価をアピールできる『お客様の声』やメディアでの掲載実績・売上数量・ランキング実績などを掲載することで、読んだ人に信頼性を感じさせましょう。『なんだか胡散臭い』という心理を排除することで、素直に商材情報を読み進めてもらえる効果があります。

フォームの使いやすさ

問い合わせフォームに進んだユーザーが離脱してしまう要因として多いのが、フォームの使いづらさです。入力事項が多かったり入力しづらかったりすると、自ずといやになってしまうのは誰もが感じる仕方のない心理と言えます。

こうした心理の働きを予防するために、例えば入力項目数を減らしたり選択型に変更したりするなど、少しでもユーザーの負担を軽くできるものに改善すると、問い合わせ数がグンと増える場合もあります。改良にもパターンがあるので、ユーザー目線で有力な案からテストにかけてみましょう。

ABテストを行う際は、Googleアナリティクスとヒートマップがおすすめです。
アナリティクスはデータを蓄積し、ヒートマップでは、ユーザーの動向を可視化することができます。
また、より詳細なデータを収集するためには、Web広告を運用し、多くのユーザーのアクセスを集める必要があることを覚えておきましょう。

ZERO式ランディングページ制作はこちら

具体的なABテストの手順

ABテストの参考パターンをご紹介したところで、ここではABテストの具体的な手順を解説していきます。ABテストはむやみに行うのではなく、意図を持ちPDCAを回して実践することが重要です。

現状の把握・検証要素の特定

まずは自社のランディングページのアクセス数・離脱率などの現状を把握することが重要です。現状を把握するには、Googleアナリティクス・サーチコンソール・ヒートマップといった分析ツールを使用し、どのくらいのユーザーがサイトを訪れているのか、どこをよく読みどこで離脱しているのか、検索しているキーワードは何かなどをよく理解し、検証すべき点を見極めて改善に生かします。

変更案の作成

分析作業によって現状を把握できたら、ABテストによって改善を検討すべき要素を特定し、1つずつの変更案を作成してABテストに備えましょう。ここで重要なのが、先ほど解説したように1箇所ずつを改善していくこと。同時に複数個所行ってしまうと、何に効果があったのかがわからなくなるので要注意です。

ABテストの実施

変更案が出来上がったら、いよいよABテストの実施です。ABテストには専用のツールが必要で、このツールの詳細については次の項でご説明します。1箇所のABテストにかかる期間は、だいたい1ヶ月程度を目安としておきましょう。

効果検証

変更案を配信した後も、もちろんGoogleアナリティクス・サーチコンソール・ヒートマップ等のツールを用いて分析を行います。変更した箇所に効果があったかどうかをよく検証、次につなげます。数字ではわかりにくいという方も、分析結果がサーモグラフィのように色で見える化されたヒートマップならわかりやすいので、ぜひ導入してみてください。

ABテストが簡単にできるGoogle オプティマイズの使い方

ABテストには、Google オプティマイズという無料ツールを使うのが便利です。ここでは、ABテストが密かに楽しくなるほど簡単に使えるGoogle オプティマイズの使い方を解説します。

登録

使用する前に、Google オプティマイズに登録するところから始めます。まずはGoogle オプティマイズのホームページにアクセスし、「利用を開始」というボタンをクリック。メール配信の登録・利用規約への同意など、一連の初期設定を済ませましょう。初期設定が完了したら、画面右上の「作成」ボタンをクリックし作成へと進みます。

テストの作成

テストの名前を設定して該当サイトのURLを入力、さらにどのテストを実施するか聞かれるため、ABテストを選択します。テストを実施するには、Googleオプティマイズの拡張機能が必要なので、拡張機能をインストールしていない場合はインストールし、「＋新規パターン」をクリックしてから、新規パターンに名前をつけ、同じ行をクリックすれば拡張機能を使ったページが現れます。

この画面で、変更すべきと判断した要素を変更。例えばコンバージョンボタンの色を変えてみます。ちなみに、拡張機能をインストール済みの方はそのまま変更できます。変更ができたら、保存をすればOKです。

Googleアナリティクスと連携

オリジナル版のランディングページと変更後のものを比較してテストするためには、Googleアナリティクスと変更操作をしたGoogle オプティマイズの連携をしなくてはなりません。連携させるべきプロパティを選んで「リンク」をクリックすることにより、Googleアナリティクスと連携させます。

アナリティクスとの連携が終われば、「オプティマイズのスニペットをサイトに追加しますか?」と聞かれるので、「スニペットの取得」をクリック。あとは「オプティマイズプラグインのインストール」の指示どおりに進み、アナリティクスのコードに埋め込む作業を行います。これが完了したら、「テスト作成」の項で作った変更案をクリックしましょう。次の目標設定画面に移ります。

目標の設定

目標設定画面を開いたら、「ウェブテストの目標」という項目内で、成果としてのゴールに設定したいコンバージョンを選択します。サブの目標も必要ならば設定し、すべての設定が終わったら画面右上のボタンで保存しましょう。ここまでできれば、あとは「テストを開始」ボタンをクリックするだけです。2つのパターンのどちらが効果的か、あとは検証作業には入ります。