LP(ランディングページ)の改善で使われるABテストとは?基本から実践方法を解説します

LP(ランディングページ)の改善で使われるABテスト 基本から実践方法を解説!!

ランディングページ(LP)とは、ユーザーに商品購入や会員登録などを促す目的で用意するページのことです。Web広告などで商品・サービスに興味を持ったユーザーが最初に目にするページでもあり、通常のWebサイトと比較するとユーザーからのアクションを誘導する内容に特化していることが特徴です。

LPの効果を最大化するためには、作りっぱなしにするのではなく改善を行う必要があります。そこで活躍するのがABテストと呼ばれる手法です。ユーザーの反応を定量的に把握して改善につなげるABテストはデータ活用の第一歩だと言えます。

そこで今回は、LPの改善に絞ってABテストの基本から便利なツールまで、わかりやすくご紹介します。ECサイト運営者はぜひ知っておきたい知識ですのでチェックしてみてください。

ABテストとは

ABテストとは
ABテストとは、Webサイトの改善などを目的に行われるテスト手法です。2種類以上のパターンを用意してグループ分けしたユーザーにそれぞれ表示し、もっとも効果が高かったパターンを見つけ出します。

アメリカのオバマ元大統領が献金を促すキャンペーンページをAB テストによって改善した結果、6000万ドルもの資金が集まった事例がよく知られています。

ABテストのメリットとしては、
・システム改修やWebリニューアルを実施するよりもコストを抑えることができる
・データに基づき客観的な改善ができる
・いくつかのパターンを同時にテストできる

などが挙げられます。

LP(ランディングページ)でABテストが必要な理由

LP(ランディングページ)でABテストが必要な理由
通常のWebサイトと異なりLPは単体で完結することが多く、それだけにページの品質が重要になります。はじめに制作したLPが最良のページである可能性は低く、かといってページ全体を作り直すのは手間やコストがかかります。

ABテストであれば要素ごとにテストできるため、全体を作り直すよりも手軽に改善できます。定期的にABテストを実施することでページを徐々にブラッシュアップできるので、続けていくうちに最良のページに近づけることが可能です。逆にABテストを実施せずにブラッシュアップしないままだと徐々にLPの効果が落ちてきてしまいます。

このようにLPを改善し最適化することをLPOと呼びます。これは「Landing Page Optimization」の略で、ABテストのほか様々な施策を行い最適化することです。SEOのLP版だと考えると分かりやすいでしょう。LPOを実施することで商品購入や会員登録など期待する成果(コンバージョン)を上げ、結果的に集客にかける広告費を削減することが可能です。

正確なABテストを行う際の注意点

正確なABテストを行う際の注意点
ABテストはデータに基づくテスト手法なので、正しい結果を導き出すためには正しい条件でテストを実施する必要があります。ABテスト実施時には以下3つの点に注意が必要です。

ある程度のユーザー数を確保する

統計的に信頼できる結果を得るためには一定数のユーザー数が必要になります。ユーザー数が少なければ少ないほど結果を集めるために時間がかかります。必要なテストユーザー数を計算してくれるツールもあるので試してみるのもよいでしょう。
参考①:A/B Test Sample Size Calculator
https://www.optimizely.com/sample-size-calculator/
参考②:Sample Size Calculator
https://docs.adobe.com/content/target-microsite/testcalculator.html

最低2週間はテスト期間を確保する

テスト期間が短すぎると、正しいテスト結果が得られない可能性があるため、最低でも2週間はテスト期間を確保するようにします。逆に長く期間を取りすぎるのもメリットがないためおすすめしません。

同じ条件にする

パターンの違い以外は、全て同じ条件にします。期間も同時期に行うのが基本です。複数個所の検証は一度にせずに、1点以外は全て同じ条件にします。

ABテストで重要なPDCAサイクル

ABテストで重要なPDCAサイクル
PDCAとは、Plan(計画)、Do(実行)、Check(評価)、Action (改善)の頭文字を取ったもので、 改善手法のひとつです。わかりやすく言い換えると、思い付きで何かを実行するのではなく、仮説を立てた上で実行し、それを検証して、より良いものになるよう改善する、という流れをぐるぐると繰り返していくということです。

LPでABテストを行うにあたっても、テストをやりっぱなしにせずに計画、実行、評価、改善のPDCAサイクルを回すことが重要になります。

では、ABテスト実施の流れを順番に見てみましょう。

準備:改善の目的を明確にする

LPを改善するにあたっての目的を明確にしてからテストを設計するようにしましょう。ユーザー登録率を上げたいのか、商品購入を増やしたいのか、など改善目的を明確にしたほうが、後の設計が楽になります。

計画:課題を洗い出す→仮説を立てる

はじめに対象となるLPの課題を見つけます。「想定よりも商品購入数が伸びない」「離脱率が高い」など、Googleアナリティクスや販売情報などのデータに基づいて課題を明らかにします。

次に、どんな改善を行えば課題が解決できるか仮説を立てます。「商品の使い方がわかりにくいため、購入したいと思わないのではないか」「文字が続くため飽きてしまい最後まで読んでもらえないのではないか」など様々な視点で考えていきます。この部分はスキルや経験も必要なので、何度もテストを実施して慣れていくほかチームで意見を出し合うことも有効です。

その上で、どれくらいの期間テストを実施するか、評価用にどのデータを取得するか(クリック数/登録数/離脱率等)なども決めておきます。

実行:改善パターンを決める→テストを実行する

次に、改善パターンを決定し、用意します。「使い方動画をLPに掲載する」「ビジュアルに訴える写真を大きく配置する」「文頭に結論を入れる」など。ポイントは、優先度が高いもの、改善インパクトが大きいものから手を付けます。一般的にはユーザーの目に触れやすいトップ部分が改善インパクトが大きいと言われています。

用意したパターンを用いてテストを実施します。パターンの違いによって結果が変わるかどうかを確認することが目的のため、テスト要素以外の条件はテスト期間中に変更しないようにするのがポイントです。

評価+改善

もっとも重要なのがこのフェーズです。取得したデータをもとに、仮説が正しかったかどうかを検証します。そして仮説が正しかった場合は、オリジナルに変更を反映します。テスト結果によってはオリジナルのまま現状維持し、別のテストを実施する場合もあります。

この一連のサイクルを継続的に回しながら改善を積み重ねることでLPがより良いものになります。

■Yahoo! JAPAN事例:ニュース見出しの幅5ピクセルをABテストで改善
Yahoo! JAPANでは、スマホブラウザ版のトップページを改善するためにABテストを活用しました。ユーザーから「タブを押しにくい」という声を受けて、ニュース見出しの行間を少し広げて罫線を入れたデザインと行間を5ピクセル広げたデザイン、それとタブのタッチ領域を広げたものの3パターンでABテストを実施したところ、行間を5ピクセル広げたデザインでユーザーのクリック数が増加したためオリジナルでも採用に至りました。ほんのわずかの違いでもアクションに違いが出た事例です。
・参考:Yahoo!ニュースの見出し行間「5ピクセルの差」に見えた光~ヒートマップでUI改善
https://news.yahoo.co.jp/newshack/newshack/smptop_title_abtest.html

■ギャプライズ事例:初回テストの結果を受けてさらに仮説を立てテスト実施
Web競合解析ツールSimilarWebの販売・サポートを手がけるギャプライズでは、SimilarWebトップページを改善するためにABテストを活用しました。まずメインキャッチ(トップページに表示されるテキスト)をオリジナルのほか4つのパターンでテストした結果、メインキャッチだけでは期待した結果にならないことがわかりました。そこでメインキャッチのほか問合せを促すサブキャッチと競合比較画面を追加して再テストしたところ、無料版登録、問合せフォーム遷移共に効果がありました。ABテストの結果から得た気づきを基に、さらに別のテストを実施して改善した事例です。
・参考:営業マンがコンバージョン率108%改善したABテスト事例
https://martechlab.gaprise.jp/archives/clicktale/17582/

GoogleオプティマイズでABテストを行ってみよう

GoogleオプティマイズでABテストを行ってみよう
ABテストは同時に2種類以上のパターンを実施するため、手作業で行うのは至難の業です。エンジニアに依頼してプログラムを開発するところもありますが、多くの企業ではABテスト専用のツールを活用しています。

ここでは、導入が手軽で使い勝手も良いGoogleオプティマイズの使い方を紹介します。

Googleオプティマイズとは

Googleオプティマイズとは、Googleが提供している有償のABテスト実施ツールオプティマイズ360の一部を無料で利用できるようにしたものです。有償版と比較すると機能が制限されていますが、基本的に必要なテスト機能は揃っています。Webページ分析ツールのGoogleアナリティクスと連携して利用します。

Googleオプティマイズでできること

Googleオプティマイズでは、以下3種のテストを実施することができます。設定はビジュアルで編集できるようになっているのでプログラミングの専門知識がなくても大丈夫です。

【ABテスト】
オリジナルページと、テスト用にボタンの色や写真、説明文などの要素を変えた別パターンをほぼ同時でランダムに表示します。

一定のテスト期間を経て最良の結果を得られるパターンを導きだします。テスト対象ユーザーを特定の層に限定することも可能です。できます。オプティマイズは、目標に照らした各パターンの掲載結果データを取得し、最良の結果を得られるパターンがどれかを特定します。

【リダイレクトテスト】
デザインが異なる2つのWebページを用意し、ランダムに表示します。URLやパスが異なるページにそれぞれリダイレクトを振り分けてページ単位で評価します。

【多変量テスト(MVT)】
ABテストがひとつの要素に注目したテストであるのに対して、多変量テストは複数の要素の組み合わせに注目したテストです。例えば、バナー画像を2種類、異なる説明文を3種類用意して組み合わせてテストすると6種類の組み合わせができます。この6種類の組み合わせのうち、最良の結果が出る組み合わせを見つけます。

参考:Googleオプティマイズ
https://optimize.google.com/optimize/home/

ABテストの手順

Googleオプティマイズを使ってABテストを作成する手順は以下のとおりです。拡張機能を使うため、Google Chromeで利用することをおすすめします。

1)Googleオプティマイズ(https://optimize.google.com/)でアカウント設定を行います。
2)コンテナ名をクリックし、[エクスペリエンスを作成] をクリック。テスト名、WebサイトURLを入力してから「A/Bテスト」をクリックします。
3)Chrome拡張機能(https://chrome.google.com/webstore/detail/google-optimize/bhdplaindhdkiflmbfbciehdccfhegci)のインストールを求められるので、設定します。
4)エディタを利用してテストパターンを作成します。ボタンの色を変えたりバナーのテキストを変更したりするなど直感的に操作可能です。
5)テストを実施する条件を設定します。
6)GoogleオプティマイズのタグをWebサイトに設置します。
7)目標を設定します。PV、セッション継続時間、直帰数などを選択できます。
8)テスト期間を設定してテストを実施します。
9)テスト結果をレポーティングタブまたはGoogleアナリティクス上にて確認します。

今すぐ、ABテストを実施してみよう!

LPで離脱率が高い、商品購入に至らない、など思うような効果が出ていないと感じたときには、ぜひABテストを実施してみてください。ABテストは少しずつ改善を加えていくことで、より効果が高いページにブラッシュアップできる手段です。はじめは戸惑うかもしれませんが、経験を積み重ねることで仮説を立てる精度も高まります。

ABテストを活用することで、「なんとなくこっちのほうが良さそうだから変えてみよう」という主観的であいまいな改善ではなく、データに基づく合理的な改善ができるようになります。ユーザーの反応を数値で確認することは非常に大切です。

そしてABテストでもっとも大切なことは「やりっぱなしにしない」ことです。PDCAサイクルを回すことを意識しながらLPをより良いものにしていってください。

株式会社ライフエスコートでも、お客様のABテストをお手伝いすることがございます。ABテストは、その設定方法からデータ分析まで初めての場合、難しく感じるかもしれません。しかし、データに基づく改善は、どんなWebページでも必要なこと。特にランディングページ(LP)を持たれている企業様にとっては実施することを強くおすすめいたします。個別でお問い合わせしてみたい!と言う方はぜひご連絡ください。

ECの困ったをフルサポート
お気軽にお問い合わせください
今すぐ!ライフエスコートに相談する

株式会社ライフエスコートご対応時間平日10時~18時

知っておきたい情報満載!↓メルマガ登録はこちら