U会話入門

Googleウェブサイトオプティマイザーの使い方ステップbyステップ: 無料でA/Bテスト入門

Googleウェブサイトオプティマイザーを使ったA/Bテストの方法をわかりやすく解説します

ページ

U会話入門
株式会社VOYAGE GROUP UIO戦略室が、社内で実践しているWebサイト最適化アプローチ手法について紹介します。コンバージョン率を上げるために必要な「U会話(ゆーかいわ)」の考え方や、具体的な事例やツールを交えて紹介します。
Q

サイトのデザインや文言に関して、どれが最も有効かを客観的に調べる方法はありませんか?

A

無料のA/Bテストツール「Googleウェブサイトオプティマイザー」を使って、サイト上で実際の訪問者を対象に「テスト」しましょう!

前回のU会話入門#1では、「テストからユーザー理解を開始させてみる」ということをお伝えしました。今回は弊社が実際に行っている方法を例として、「Googleウェブサイトオプティマイザー」を使ってテストを実施する方法をお伝えします。

ここで言う「テスト」とは、サイト上のデザイン(色、大きさ、配置、写真、イラストなど)や文言(キャッチフレーズや、アクションボタンの誘い文句など)を複数パターン用意しておき、実際のサイト上で、訪問してきたユーザーに対して出し分け、どのデザインや文言を提示するのがコンバージョンにつながりやすいかを数値で調べる「A/Bテスト」を意味します。

こうしたことを手動で行うのはかなり面倒ですが、最近ではテストを自動的に実施するツールを無料で利用できます。最初は少し面倒そうに思われるかもしれませんが、慣れれば簡単ですので、あなたも明日からテストを試せるようになるでしょう。

テストの事前準備

テストするページを決める

最初にテストするページを決めます。ここでは例として、弊社が運営している価格比較サイトECナビ内にある「星付き家電」という「専門家の調査に基づいた本当に良い家電を紹介するガイド」の商品詳細ページをテストしてみたいとおもいます。

図1 今回のテスト対象サイト
http://ecnavi.jp/star/compact_digicame/201105/47/

ユーザーを理解する

次にこのページに来ているユーザーを理解しましょう。アクセス解析のデータやユーザーテストなどさまざまな手段を利用して、「ユーザーはどういう意識で、何を目的としてこのページに来ていて、現状どういう状態であるか」を理解します。

ここでは、このページを訪れるユーザーが次のような状態であると理解して進めます。

このデジカメに興味をもったユーザーが、商品の詳細を確認するためにこのページに来ていて、さらにこの商品がどのくらいの価格で買えるのかを確認したい状態

ゴールを決める

さらに、ユーザー理解からゴールを決めます。ここではユーザーの目的が「価格の確認」であると理解しました。

このページから価格を詳細に確認するためには、「販売ショップ 価格一覧」というボタンをクリックする必要があります。そのためユーザーがこのボタンに気づきクリックすることがユーザーにとってよい状態であり、このボタンがユーザーのゴールになります。

以上のことより、テストのゴールもこのボタンのクリック数を増やすこととします。

仮説を立ててテストする内容を決める

ユーザーのゴールがボタンをクリックすることであることから、このボタン自体に着目し、ボタン上に示す文言が「販売ショップ 価格一覧」よりも「価格を確認する」という文言のほうがよりわかりやすくよりクリックされるのではないかという仮説を立てます。

この仮説自体がテストの内容であり、以下のような形でテストを実施することにします。

図2 赤枠で囲んだ部分のボタンの文言(ボタン画像の上にHTMLで書かれている)を複数のパターンでテスト
パターンA(オリジナル)
「販売ショップ 価格一覧」という文言
パターンB(仮説に基づいた改善案)
「価格を確認する」という文言

テストするためのツールを決める

テストの事前準備が完了したため、最初にテストを実施するためのツールを決めます。現在テストツールも数多くみられますが、弊社ではGoogleウェブサイトオプティマイザーを利用しています。

Googleウェブサイトオプティマイザーとは、グーグルが提供しているA/Bテスト・多変量テストを実施するためのツールです。

弊社がGoogleウェブサイトオプティマイザーを利用している理由は、「無料で高機能」だからです。無料であれば導入コストを考えることなく実施できますからね。またGoogleウェブサイトオプティマイザーは、無料にもかかわらずA/Bテストはもちろんのこと、2つ以上をテストする多変量テストも実施できる高機能ツールでもあります。

図3 Googleウェブサイトオプティマイザー
https://www.google.com/analytics/siteopt/?hl=ja

テストの材料を用意する

ここから、Googleウェブサイトオプティマイザーでテストを実施する手順を説明していきます。とはいえ、いきなりGoogleウェブサイトオプティマイザーの管理画面を見てもわからないことが多いので、テストの設定を開始する前に、次のものを用意しておきましょう。

テストの設定を始める前に準備しておくもの
  • アカウントや権限

    • Googleアカウント ―― Googleウェブサイトオプティマイザーを利用するには、Googleアカウントが必要です。

    • Googleアナリティクスのアカウント ―― Googleウェブサイトオプティマイザーは、Googleアナリティクスと連携して動作するため、テスト対象サイトのGoogleアナリティクスデータに対する管理者権限をもったGoogleアカウントが必要です。

    • Webサイトの変更権限 ―― テストを実施するには、テスト対象ページのHTMLを修正する必要があります。HTMLを修正して公開サーバーにアップロードする権限をもっているか、それらの作業を行える人に作業を依頼できる必要があります。また、テストではHTMLを修正してJavaScriptのコードを入れる必要がありますので、ブログのようなワープロ風編集画面ではテスト実施に必要な修正ができない場合があります(コードはGoogleウェブサイトオプティマイザーが提供するので、自分でプログラミングできる必要はありません)。

  • テスト対象のURLやHTML

    • テストページのURL ―― どのページでテストを実施するか、あらかじめ決定しておきます。

    • オリジナルページのHTML ―― すでに公開されているページを、A/Bテストの「Aパターン(オリジナル)」として使いますので、問題ないはずです。

    • テスト対象箇所の代替パターン用HTML ―― A/Bテストの「Bパターン(代替)」として表示したい、テスト部分のHTMLを用意しておきます。ボタン画像や写真を変えてテストしたい場合は、その画像もあらかじめ公開サーバーにアップロードしておきます。この記事では、ボタン上に表示する文字列を変えるだけですので、代替パターンとしてはHTMLではなくテキストだけを用意しましたが、「文字中心の訴求」と「画像中心の訴求」のように大きく変える場合は、代替のHTMLを用意しておく必要があります。

    • どの時点で「そのテストでコンバージョンした」とみなすかの情報 ―― AパターンとBパターンをランダムにユーザーに提示されたユーザーが、その後どういう行為をする率が高いものを「良い」とみなすかを決めておく必要があります。ユーザーがそのページを見たあとに「申し込み」「購買」といった行動を完了した時点で「テストのコンバージョン」とみなす場合は、通常のアクセス解析のコンバージョンタグと同様に、申し込みが完了したページを「テストのコンバージョンページ」とします。この記事では、同一ページ内のボタンをクリックした時点を「テストのコンバージョン」とみなしますので、テストのコンバージョンページはテストページと同じページ、コンバージョンの動作はボタンのクリック時点となります。

用語集
Cookie / Googleアナリティクス / HTML / JavaScript / UA / アクセス解析 / アップロード / コンバージョン / テキストエリア / ドメイン名 / ユーザーテスト / リンク / 訪問 / 訪問者

ページ

この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

Python
「Python」(パイソン)は、プログラミング言語の1つ。プログラマのグイド・ヴ ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]