無料ABテストツールGoogle Optimizeの使い方・レポートの見方を徹底解説

本記事では、Google社が提供するA/Bテストツール”Google Optimize(オプティマイズ)”の概要・導入方法・使い方・レポートの見方について解説します。

準備事項:

  • webサイト
  • webサイトへGoogleAnalytics(GA)導入済

Google Optimizeは無料でA/Bテストができる

Google Optimizeとは

そもそも、Google Optimizeは何を目的に作られたツールなのでしょうか。

Optimizeが”最適化”を意味することから察しがつくかもしれませんが、一言で言えばwebサイトを最適化する為のツールです。
サイト上のページを様々なパターンでテストし、最良の結果をもたらすパターンを条件に応じて導き出すことができます。

具体的には、A/Bテスト、多変量テスト、リダイレクトテストを簡単に行えます。さらに、テスト結果をOptimizeとGA双方で容易に確認でき、統計学を利用したレポートも参照できます。

強み

強みは、豊富な機能を持ちながら 「無料」であることや、細かいターゲティングGoogle Analytics(GA)と連携した目標設定・分析デザインパターンの容易な作成ができることなどがあげられます。(有料プラン[optimize 360]もありますが、無料プランでも十分使えます)

なお、類似サービスとしてはKaizen Platform, Optimizely, Mixpanel, VWO などがあります。

Google Optimizeの登録方法・GA連携・JSコード埋め込み

続いて、Google Optimizeの登録方法・GAとの連携方法など、Google Optimizeを利用する為の必須項目について説明します。

※Google Optimizeを導入するには、Google Tag Manager(GTM)と連携するか、GAと連携することが必要です。本エントリーではGAを利用する方法を解説します。

※GTMを介するOptimize導入方法についてはこちらをご参照ください。

前提:  Google Analytics(アナリティクス)をサイトに導入済み

1. Google Optimizeアカウント登録

Optimize公式サイトへアクセスし、Google Analyticsを利用しているアカウントで登録していきます(一瞬でできます!!)。

2. Google Analytics連携

登録後、以下のような画面が表示されていたら登録完了です。こちらがOptimizeのHome画面になります。

次にGoogle OptimizeのコンテナとGoogle Analyticsのプロパティを連携させます。

※コンテナとプロパティの関係性についてはこちらをご参考ください。https://support.google.com/optimize/answer/6211938

Googleアナリティクスへのリンク > プロパティにリンク > プロパティを選択 の順に進めていきます。

上記画像で示されている通り、推奨手順iによると「テスト作成」がGA連携より先に記述されていますが、GA連携作業は一瞬で終わる為、まずこちらを終わらせます。テストの作成方法については後述します。

なお、Google公式サイトでも推奨されている通り、基本的にはテストを実施するGoogle Analyticsプロパティ1つにつき、Google Optimizeコンテナを 1 つ設定します。

3. サイトにGoogle Optimizeのjsコードを追加

Google Optimizeを使用する全てのページにトラッキングコードを埋め込み、Google Optimizeのコンテナとwebサイトを紐付けます。

なお、今回はページフリッカーを非表示にするスニペットは設定しておりません。(Optimize利用にあたり必須項目ではありません)

※ページフリッカー・・・オプティマイズでは、ドキュメント オブジェクト モデル(DOM)を変更することで、ウェブサイトにアクセスしたユーザーにさまざなまパターンを表示します。場合によっては、変更はすでにエンドユーザーに認識されている要素に対して行われます。このような目に見える変更は、ページ フリッカーと呼ばれています。(Google公式サイトより引用)

ページフリッカーを非表示にすることは、以下の通りメリット・デメリット双方あります。

  • メリット:オリジナルの表示が一瞬される可能性を防げる
  • デメリット:ページ表示が遅くなる

詳しくはこちらをご覧ください。

メリットデメリット認識した上で、設定するかどうか決めると良いでしょう。

4.Google OptimizeのChrome拡張機能をインストール

Google Optimizeでは、テストパターンの作成はGoogleChromeで行わなければいけません。

その際、Chromeの拡張機能”Google Optimize”がインストールされている必要があります。

こちらのリンクからインストールできます。

Google Optimizeのテスト作成・開始方法

1. テスト作成

さて、ここまででテストの準備は完了です。早速、テストを作成していきます。

※今回は「A/Bテスト」を解説していきます。他のテスト及びテスト毎の役割については、こちらをご参考ください。

Home画面から「テストを作成」を選択します。

すると、画面右側からスライドが出てくるので、下記の順番で入力・選択していきます。

3番目の入力項目「テストするページのURLは何ですか?」の部分がわかりづらいので補足です。
ここで入力されたURLのページをデモ画面として用いることができます。そのページでは、テストするデザインをあれこれ当てはめていくことができます。(後述します)

※勿論、ここで作られたデザインは他のページでもどう反映されているのかプレビュー確認できます。

テスト作成フローを整理します。

  1. 仮でテストするページを設定
  2. 諸々設定(後述します)
  3. 1で設定したページを使ってデザイン作成
  4. デザインを他のページに当てはめて確認

2. テスト設定

テストするにはいくつか設定事項があります。ここでは目標設定、ターゲット設定をしていきます。

  1. 目標設定
  2. ターゲット設定
  3. テストパターン作成

目標設定

まずは、目標設定について。

先ほど作成したテストが下書きリストに保存されていますので、作成したテストをクリックし、次のページで「テスト目標を追加」をクリックします。

すると、ドロップダウンメニューが表示されますので、「リストから選択」を選びます。

※カスタム目標はGAのイベントトラッキング等を利用した目標になります。クリックトラッキングなどで利用できます。

ここでは、サイトの指標として大切な「ページ/セッション」を測ることを想定して進めていきます。

「リストから選択」を選んだ後、画面右側に目標が一覧となって表示されたと思います。「ページビュー数」を選択します。

なお、「ページビュー数」と記載されていますが、自動でページ/セッションも算出されます。

無料版の場合、このテスト目標は3つまで設定できますので適宜設定してみてください。

ターゲット設定

次にターゲットを絞り込んでいきます。今回は、よく使われると思われる「URL」と「デバイス」で絞り込んでいきたいと思います。

ターゲットの絞り込みルールを設定するには、「ルールを作成」を選択します。

するとルール一覧が表示されるので、「URL」、「テクノロジー」を設定します。

まずはURL。下図の通り、柔軟に対応できる正規表現で絞っていきます。

なお、こちらのルールはTABILABOでいうところの記事ページが対象です。

では、テクノロジー設定でデバイスを絞ります。

「デバイスカテゴリ」、「次と等しい」、「mobile」で設定します。

これでmobileに絞り込むことができました。完成例がこちらです。

3. テストパターン作成

いよいよテストのパターンを作成していきます。

パターンの作成

次の流れで作成していきます。

「パターン作成」をクリック > パターン名入力 > 追加 > パターン名の周辺をクリック > 編集ページへ遷移

ページを編集

以下のような画面に映ったと思います。

この画面でパターンを作成していきます。

編集方法はいくつかありますので紹介します。

  1. 要素をクリックして、「テキストを編集」
  2. 要素をクリックして、「htmlを挿入」
  3. 要素をクリックして、「javascriptを実行」( jQueryも記述可能です。)
  4. 右上の<>マークをクリックして、「CSSの編集」から編集

用途によって、どれを選択するかは変わってきます。

要素の削除、追加、アニメーションを加えるなど動的なケースでは「2」、javascriptを追加するとよいでしょう。

静的な部分の場合は「1」、htmlを編集するだけで問題ありません。ですが、javascriptで編集した方が管理しやすいので、javascriptで記述することをおすすめします。

デザインだけ変えたいなどのケースでは「3」、cssを編集するとよいでしょう。

もちろん、inline-cssをjavascriptで書くことも、javascriptとcssを組み合わせることもできます。

例として、ヘッダーを削除します。

jQueryを記述後、「適用」をクリックします。

ヘッダーが消えましたね。cssは下記のように編集できます。

なお、編集したCSSはheadタグのstyleタグに反映されます。

編集方法の説明は以上になります。

ただ、編集したものを加筆したい、削除したい等のケースがあると思います。

その場合は、下記の方法で対応できます。

画面右上の「~件の変更」  > 修正したい項目の右にあるアイコン > 編集 or 削除

エディット画面の解説は以上です。

4. テスト開始

続いてテスト開始方法をお伝えします。一番緊張するところですが、一瞬で終わります。

「テストを開始」ボタンを押します。以上です。

テスト結果の確認方法2通り

テスト結果の確認方法は大きく分けて2通りあります。

  1. Google Optimizeでの結果確認
  2. Google Analytisでの結果確認

※トレジャーデータなど他のツールのトラッキングイベントを仕込んでいる場合はそちらで確認してください。

今回は、1つ目と2つ目について解説します。

1. Google Optimizeでの結果確認

Optimizeにおけるテスト結果の参照は「レポート」から行えます。

レポート画面は大きく4つに分けられます。

  1. webテストセッション数・・・テストの対象となった総セッションを表します。
  2.  

  3. 改善率・・・各目標毎に、各テストパターンをオリジナルと比較した改善率を表します。
  4.  

  5. 目標毎のレポート・・・各目標毎の各テストパターンの「最適である確率」、「ベースラインを上回る確率」、「コンバージョンの平均値(ページビューが目標の場合は[ページ/セッション]、[ページビュー数]、※目標毎に異なります)」が表示されます。
  6.  

  7. グラフ・・・「目標毎のレポート」の下部にテストパターン毎のパフォーマンスが時系列で表示されます。

 

その中でも「目標毎のレポート」は重要な情報がまとまっています。必ず確認した方が良いでしょう。(※明確な名前があるわけではないので、仮で目標毎のレポートと呼称しています)

▼「目標毎のレポート」の例

詳細はこちらをご覧ください。

なお、テスト開始後数日はブレがあるので、2週間以上続けることをグーグル社は推奨しています。

2. Google Analyticsでの結果確認

GoogleAnalyticsでテスト結果を確認する方法は次の通りです。

GoogleAnalyticsにログイン > [レポート]  >  [行動]  >  [ウェブテスト]

なお、権限がないとウェブテストは見れない可能性があります。見れない場合は管理者に相談してみてください。

Google Analyticsでは次のレポートを確認できます。

  1. コンバージョン(Optimizeで設定した主目標)
  2. 利用状況
  3. 目標セット(Analyticsで設定したカスタム目標)

また、Google Analyticsのデフォルト機能「セグメント」等を用いて、更に対象範囲が絞られたデータを確認できます。

言葉のみだとわかりづらいと思いますので、下記図を参考にしてみてください。

このように細かくデータが見れます。

さて、ここまでGoogle OptimizeとGoogle Analyticsのレポートの見方について解説してきましたが、それぞれ特徴があります。

ざっくり言うと、Optimizeは、最適なテストパターンを統計学で導きだすことに特化しているのに対して、
Analyticsは、各テストパターンのデータを細かく深堀りすることに長けています。

どちらか一方のみを確認するのではなく、両方見ることでより強固な検証ができることでしょう。

まとめ

長文にも関わらずお読みいただきありがとうございます。
本記事はお役に立てましたでしょうか。

Google Optimizeは登録が簡単にできる上に、対象を細かく絞れて、容易にテストパターンを作成でき、テスト結果を詳細に確認できます。そして何よりも基本無料です。Googleさん恐れ入ります。

本記事がGoogle Optimizeを検討される際の一助となれば幸いです。

[告知事項]
・エンジニア募集
現在、TABI LABOではエンジニアを募集しています!
自分で手を挙げて企画し、開発できる環境です。
少しでも興味がございましたら、採用ページもご覧頂ければ幸いです。

・TABI LABO TECH NIGHT 4/24開催☆
なんとTABI LABO初のテックイベントです!
以下詳細になります。

テーマ:注目スタートアップが語るVR/ARの技術的面白さや今後の展望

対象参加者:

  • VR/ARに興味のあるエンジニアの方
  • ※現状VR/ARに関わっていないけど興味があるという方でも大歓迎です!

参加メリット:

  • VR/ARスタートアップ業界の今をキャッチアップできます
  • VR/ARの技術的な面白さを知ることができます
  • 各スタートアップが考えるVR/ARの未来の展望を知ることができます

※お申し込みはこちら

今後もTABI LABOでは、テックイベントを定期的に開催していく予定です。
よかったらぜひご参加ください!