こんにちは!グシオです。
以前投稿した『【2022年最新】ホームページの分析・改善に使えるオススメ無料ツール』でホームページの改善に使える無料ツールをいくつか紹介しました。そのなかでGoogleオプティマイズについても簡単に触れましたが、今回はこのGoogleオプティマイズについて詳しくお話しします。
GoogleオプティマイズはA/Bテストができる無料ツールです。ホームページは最初から完璧な状態であることはあまりありません。ユーザーの動きを計測し仮説を立ててA/Bテストを繰り返し、ユーザーにとって使いやすいホームページに改善していくことがWebマーケティングの基本です。
Googleオプティマイズはテキストや画像の差し替えといった簡単なA/Bテストであればビジュアルエディターで設定できるのでコーディングの必要がなくプログラミングの知識がなくても簡単かつスピーディーにテストを実行できます。Googleアナリティクスと連携できるので計測や分析も簡単に行うことができます。
中小企業に勤めるWebマーケティング担当の方だけでなく、中小企業の経営支援・販売促進支援をする中小企業診断士やコンサルタントにとっても提案に使える有益なツールだと思いますので、この記事でGoogleオプティマイズの導入方法と特徴を確認していきましょう!
関連記事:『WordPressで無料のヒートマップ「Clarity」を導入する方法と3つの特徴』
目次
そもそもA/Bテストってなに?
![A/Bテスト](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/23664945_m.jpg?resize=880%2C587&ssl=1)
A/Bテストとは、広告バナーやホームページを最適化するために実施するテストの一つです。
テキストや画像など特定の要素を変更したAパターン、Bパターンを作成して各パターンをランダムにユーザーに表示し、それぞれの成果を比較することで、より高い成果を得られるパターンを見つけることができます。「A/B」テストという名前ではありますが、3パターン以上でテストすることもあります。
ホームページでよくあるA/Bテストとして以下が挙げられます。
- ファーストビューなどの画像
- キャッチコピーなどのテキスト
- アクションボタン
- 問い合わせフォームの項目
Googleオプティマイズの3つの特徴
Googleオプティマイズには大きく分けて3つの特徴があります。
Googleオプティマイズでは以下のテストを実施可能です。
①A/Bテスト
同じウェブページについて複数のパターン(A と B)を用意し、それらをランダムに表示して成果を調べるテストができます。パターン A がオリジナルで、B から n までの各パターンには、オリジナルと異なる 1 つ以上の要素が含まれたクリエイティブを設定します。テストによっては、完全に別バージョンのウェブページをパターン B にすることもあります。
![ABテスト例](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-87.png?resize=361%2C229&ssl=1)
②多変量テスト
多変量テストは、複数の要素を持つパターンを同時にテストして、最良の結果を得られる組み合わせを特定します。多変量テスでは、A/B テストのように最良の結果を得られるページのパターンを特定するのではなく、最良の結果を得られる各要素のパターンを特定するとともに要素間の相互作用を分析します。多変量テストは、ランディング ページの複数の項目を最適化する場合などに適しています。
![多変量テスト例](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-88.png?resize=537%2C317&ssl=1)
③リダイレクトテスト
リダイレクト テストは一種の A/B テストであり、異なるウェブページを相互に比較してテストすることができます。リダイレクト テストでは、ページの要素ではなく、URL またはパスでパターンを特定します。デザインが大きく異なる 2 つのランディング ページや、全面的にデザイン変更したページをテストする場合にリダイレクト テストを使用します。
![リダイレクトテスト例](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-89.png?resize=298%2C179&ssl=1)
Googleオプティマイズにはビジュアル エディタ機能があります。エディタを使うとプログラミングコードを書き直す必要がなくクリックだけでテストパターンを作成できます。
またプログラミングが分かる方向けにエディタで直接 Raw HTML を編集したり、JavaScript ルールや CSS ルールを追加も可能です。
Googleオプティマイズではテスト結果が自動で集計され、レポートを簡単に作成出来ます。またテストの重要な指標であるセッション数・コンバージョン数・コンバージョン率などを一目で比較出来ます。
Googleオプティマイズの導入・設定方法
事前に必要なものとして以下が挙げられます。
- テストしたいホームページ
- Googleアカウント
- Googleアナリティクス(今回は新型のGA4を利用)
- Googleタグマネージャー
Googleタグマネージャーの導入方法については以下記事をご覧ください。
参考:『WordPressでGoogleタグマネージャーを導入する方法と3つのメリットを解説』
それではさっそくGoogleオプティマイズを導入していきましょう!
![オプティマイズホームページ](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-65.jpg?resize=840%2C350&ssl=1)
Googleオプティマイズのホームページ にアクセスし「無料で利用する」をクリックします。Googleアカウントでのログインを求められるので任意のアカウントでログインします。
![オプティマイズ画面](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-65.png?resize=880%2C168&ssl=1)
オプティマイズのダッシュボードが表示されるので「アカウントを作成」をクリックします。
![オプティマイズのアカウント作成](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-66.jpg?resize=708%2C1024&ssl=1)
「アカウント名」に自分が分かりやすい名称を記入(ホームページの名前など)し、国の利用規約を選択(多くの場合、日本になると思います)、各チェックリストにチェックを入れて「次へ」をクリックします。
![コンテナの追加](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-66.png?resize=750%2C311&ssl=1)
「コンテナ名」に任意の名前を入力し「作成」をクリックします。
コンテナ名はドメイン名を入れる場合が多いです。
![エクスペリエンスを作る](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-67.png?resize=880%2C331&ssl=1)
「最初のエクスペリエンスを作りましょう」という表示がでるので「開始」をクリックします。
これからA/Bテストのパターン作成に入ります。
![エクスペリエンスの作成](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-68.png?resize=740%2C830&ssl=1)
「名前」に自分がどんなテストをするか分かるような名称を入力し、「使用するページのURLを教えてください」という項目にテストをしたいページのURLを入力します。今回作成するテストのタイプは「A/Bテスト」を選択し、「作成」をクリックします。
![テストパターンの作成](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-69.png?resize=880%2C404&ssl=1)
「ターティングとパターン」の項目で「パターンを追加」をクリックします。
![パターン追加](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-70.png?resize=748%2C261&ssl=1)
「パターンの名前」に任意の名前を入力します。たいていA/BテストのBパターンがどんなものであるか分かるように名前を入力します。入力後、「完了」をクリックします。
![ターゲティングとパターン](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-71.png?resize=880%2C230&ssl=1)
比重を選択します。デフォルトでは50%:50%になってます。これはユーザーが100人訪れたらAパターンを50人に、Bパターンを50人に表示するということです。特に意図がない場合そのままで構いません。
先ほど作成したBパターン(上図では”FVテキストなし”)の「編集」をクリックします。
![ビジュアルエディタ](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-72.png?resize=880%2C390&ssl=1)
今回はFBテキスト(中小企業診断士の試験、マーケティング、動画制作、地域の魅力について記録を残しています)という表示を削除した状態をBパターンとしたいので、該当の箇所をクリックし、「要素を編集」→「削除」をクリックします。
![エディタ](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-73.png?resize=880%2C270&ssl=1)
該当箇所が変更できたことを確認し「保存」→「完了」をクリックします。
その他のA/Bテストとして、画像を変えたり、テキストを変えたり、ボタンの色を変えたりなどの変更も簡単にできるので是非お試しください。
![テストパターン](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-74.png?resize=880%2C387&ssl=1)
ページターゲティング、オーディエンスターゲティング、説明は今回は特に変更を加えません。それぞれの意味は以下の通りです。
「ページターゲティング」はどのURLでテストパターンを表示させるかを選択できます。単一ページ、複数のページ、さらにはホストやパスをテスト対象として指定できます。
「オーディエンスターゲティング」はテストパターンを表示するユーザーの属性を設定することができます。たとえば、「男性ユーザーだけテストしたい」、「東京都に住んでいるユーザーだけテストしたい」といった要望を実現できます。
ターゲティングは以下の7種類が可能です。
![ターゲティング設定](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-75.png?resize=574%2C392&ssl=1)
- Googleアナリティクスのユーザー:Googleアナリティクスで作成したオーディエンスをターゲットに設定
※このターゲティングは有料版(オプティマイズ360)のみ利用可能です。 - Google広告:Google広告のアカウント、キャンペーン、広告グループ、キーワードをターゲットに設定
- UTMパラメータ:UTMパラメータに基づいてユーザーをターゲティング
- デバイスカテゴリ:モバイル、デスクトップ、タブレット デバイスを使用しているユーザーをターゲットに設定
- 行動:特定ユーザーやリピーター、特定の参照URLからのユーザーをターゲットに設定
- 地域:特定の都市、大都市圏、地域、郡などからのユーザーをターゲットに設定
- テクノロジー:特定のデバイス、ブラウザ、OSを利用しているユーザーをターゲットに設定
「説明」は何か自分やチームメイトにメモを残したい時に使える項目です。
![測定と目標](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-76.png?resize=880%2C325&ssl=1)
続いて「測定と目標」の項目で「アナリティクスへリンクする」をクリックします。
![プロパティリンク](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-77.png?resize=852%2C481&ssl=1)
連携したいGoogleアナリティクスを選択して「リンク」をクリックします。
![テスト目標を追加](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-78.png?resize=880%2C582&ssl=1)
続いて「目標」の項目で「テスト目標を追加」をクリックし、目標として「ページビュー数」を選択します。
続いて、一番設定が面倒くさいというか、うまくいかず困ってしまうケースが多い場所を解説します。
「設定項目」でGoogleオプティマイズとホームページを紐づけるための設定をします。この設定をする際にGoogleタグマネージャーの使用をオススメします。僕も色々と試したのですが、タグマネージャーを使うやり方が一番カンタンかつエラーが起きにくいように感じました。
Googleタグマネージャーを利用することで初期設定だけではなくホームページ全体の管理も楽になります。
この記事では既にタグマネージャーがホームページに設置されているという前提のもと必要最低限の設定手順のみご紹介します。
Googleタグマネジャーの導入方法は以下のページをご覧ください。
参考:『WordPressでGoogleタグマネージャーを導入する方法と3つのメリットを解説』
![インストール](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-79.png?resize=880%2C309&ssl=1)
「オプティマイズのインストール」の右端にある「手順を表示」をクリックします。
![スニペット追加](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-80.png?resize=880%2C244&ssl=1)
「オプティマイズスニペットをインストール」するという項目にコードが表示されます。このコードの中にあるOPT-XXXXというコンテナIDをメモまたはコピーします。
この状態でオプティマイズは一旦置いておいて、Googleタグマネージャーにログインします。
![設定](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-81.png?resize=880%2C326&ssl=1)
Googleタグマネージャーで左メニューから「タグ」を選び、「タグの設定」で「Google Optimize」を選択します。
![コード入力](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-82.png?resize=880%2C276&ssl=1)
先ほどメモしたオプティマイズのコンテナIDを入力します。タグの設定は他に何も触らなくてもOKです。
トリガーは「All Pages」を選択し、左上に任意の名前を入力(今回はオプティマイズと記入)、「保存」をクリックします。
これでタグマネージャーの設定は完了です。忘れずにタグマネージャーの公開設定をしましょう。
公開設定ができたら再びGoogleオプティマイズに戻ります。
![コード追加](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-83.png?resize=880%2C402&ssl=1)
さきほどの画面で「Google拡張機能をインストールする」から拡張機能をインストールします。
その後、「オプティマイズスニペットをインストール」にて「インストール状態を確認」をクリックします。
![インストール結果確認](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-84.png?resize=880%2C391&ssl=1)
オプティマイズが正しくインストール出来ていることを確認したら「ウェブサイト エクスペリエンスに戻る」をクリックして画面を戻します。
![ターゲティングパターン](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-85.png?resize=880%2C331&ssl=1)
これで設定は完了したので、画面を上にスクロールし「開始」をクリックします。
![ターゲティングパターン2](https://i0.wp.com/gushio.site/wp-content/uploads/2022/09/image-86.png?resize=880%2C313&ssl=1)
これでテストが開始されました。結果が出るのを待ちましょう!
テスト期間は2週間くらいで設定するのが良いと思います。
結果が出たら数値をもとに良い方に寄せて、どんどんホームページを改善しましょう!
まとめ
ホームページの改善をするうえでA/Bテストは重要な施策であり、A/Bテストを簡単に実行・分析できるGoogleオプティマイズはとても有益なツールです。(しかも無料!!)
皆さんもぜひGoogleオプティマイズを試してみてはいかがでしょうか。
何かお困りのことがございましたらお気軽にご質問ください。Webマーケティングに関するお仕事のご相談も大歓迎です!