GAでクリックなどの行動を計測する「仮想ページビュー」[第52回]トラッキングコードをカスタマイズすると、通常では計測できない「ファイルのダウンロード」や「リンクのクリック」などを計測できる。それが「仮想ページビュー」だ。noteで書くこれは広告ですトラッキングコードのカスタマイズの第1弾は「仮想ページビュー」と呼ばれる方法について紹介しよう。仮想ページビューは、次のような課題を抱えている場合に利用するのが代表例だ。仕組みや利用例、具体的な実装方法について解説していこう。仮想ページビューを理解するためには、前回に引き続きもう少し標準のトラッキングコード(図1赤枠部分)の動作について解説しておこう。'pageview');」(図1青枠部分)の部分が「pageview」タイプのヒットをリクエストするプログラムだ。図1:トラッキングコード標準では、「document.location」の値(ここではURL)と「document.title」の値(ここではタイトルタグの内容)が自動的に取得される。それらの情報をもとにして「どのページが見られているのか」を表すレポートが生成される(図2)。コンテンツ]>[すべてのページ]レポート(図2赤枠部分)に表示される「ページ」と「ページタイトル」(図2青枠部分)が、これらに対応するディメンションの値だ。「ページ」の値(図2緑枠部分)は見てわかるとおり、URLのうちプロトコルとホスト名の部分(http://example.com)は含まれず、パスとパラメータ部分(/xxx/xxx.html?p=xxxなど)が表示される。コンテンツ]>[すべてのページ]レポートこれに対して「仮想ページビュー」は、標準で取得する「ページ」名(URLパス)を別の値で上書きして集計する。そもそもページ閲覧とは異なる動作に対してもページビューと同等のレポートを作成できるということになる。内容は違うのにURLが変わらないECサイトのカート画面などでは、レポートで表示される「ページ」名は同じになる。仮想ページビューは、こうしたときに「どのページ閲覧だったか」を正確に把握できなくなる問題を解決するための使い方ができる。仮想ページビューの基本はページ名を書き足すだけでは実際どのようにトラッキングコードのカスタマイズを行うのかを説明していこう。通常のトラッキングコードのなかにある1行に(図1青枠部分)、下記の赤字部分を追記すればよい。'pagename');この例でいえば、赤字部分のクォーテーションで囲まれた「pagename」が、「ページ」ディメンションの値(図2緑枠部分)として表示されるようになる。「pagename」は、実際には集計したいページ名を記述する。これだけでは実際にどのように記述するのかピンとこないだろう。続いて、冒頭に挙げた2つの例で具体的にどのようにトラッキングコードをカスタマイズするのかを解説していこう。正確な情報は開発者向けサイトで確認できる実際にはさまざまな記述方法があるので、ここで紹介する方法が唯一の正解というわけではない。ここでは、Webページのソースに直接記述する方法について解説している。CMSなどで共通のトラッキングコードを自動的に挿入するようにしている場合、外部JavaScriptを読み込んでいる場合、タグマネジメントツールを使っている場合など、それぞれの場合に応じたカスタマイズが必要になるが、それらについては割愛する。正確に仕組みや記述方法を理解したい方は、グーグルの開発者向けサイトを参照してほしい。利用例1URLが同一で内容が変化するページを区別するそれでは、1つ目の利用例「URLが同一で内容が異なるページを、別々に識別して計測する」について具体的に説明していこう。eコマースサイトのカートシステムなどで、表示しているページの内容は変化しているのに、URLは同一のまま変化しないというページを見たことはないだろうか。これは「POSTメソッド」という方法を利用してWebサイトとやりとりをしている場合などで生じる。eコマースサイトのカートに商品を入れた後のURLが次のような場合で考えてみよう。/thanks.phpこの場合は「カートページ」「フォーム入力ページ」「入力情報確認ページ」と表示される内容が変わっているのに、「/cart.php」という同じURL(赤字部分)のためにページ名では区別がつかない。すると、どこのステップでカート落ちしたのかを分析したり、改善案を考えたりできなくなってしまう。そこで2番目と3番目のページには次のような仮想ページを割り当てて、この3ページを区別できるようにしたい。割り当てしないこのケースはカートで動的にページの内容を出力しているはずなので、トラッキングコードのカスタマイズも動的に実装しなければならない。標準のページビュー計測するトラッキングコード(図3青枠部分)の中の1行(図3赤枠部分)を、フォーム入力ページと入力情報確認ページでそれぞれ下記のように変更して記述するプログラムを開発して実装してもらう必要がある。'/cartinput2');もちろん、外部のカートASPなどを利用している場合はこのようなプログラム修正を個別にしてもらうのは難しいだろう。カートシステムを自社で開発している場合は、こうした改修をすることでページの移動を識別して別のページとして集計することが可能になる。利用例2ファイルのダウンロードを仮想ページビューで計測する2つ目の例は「PDFファイルのダウンロードなどの行為を、ページビューとして計測する」というものだ。このケースは、「通常のページ閲覧でない何らかの行為をページ閲覧と同じように計測してレポートに表示したい」という意図になる。次のような応用例もある。外部サイトへのリンクのクリックを計測するサイト内の各種ファイルのダウンロードを計測するAjaxなどで操作されたコンテンツ閲覧の動作を計測するどの場合も何らかの行為をとらえるものなので、マウスの動きなどの各種動作・操作に対して特定の処理を与えるためのJavaScriptで記述された命令(イベントハンドラ)と組み合わせて利用する。JavaScriptは、クリックやマウスオーバーなどさまざまな行為をきっかけにして動作させることができる。これらのユーザーの行為を仮想ページビューで取得する方法は、次回紹介する「イベント」として取得する方法もある。イベントトラッキングとどのように使い分けるかについては次回解説する。PDFファイルをダウンロードしたらページビューとして計測する方法ここでは、「PDFファイルへのダウンロードのリンクをクリックした行為があったら、仮想ページビューを1カウントする」という例を解説する。具体的には、「クリック」という行為に対して「/click/whitepaper.pdf」という仮想ページを1ページビューカウントするように設定する場合の記述方法だ。この場合は、トラッキングコードをカスタマイズするのではなく、HTMLファイルのソースコードにあるPDFファイルへのリンクタグの記述に、次の赤字部分を追加で記述する。ページビュー計測のトラッキングコードは普通に各ページに実装しておく必要がある。'/click/whitepaper.pdf');">ホワイトペーパーのダウンロード</a>リンク先がサイトの外部か内部かにかかわらず、リンクのクリック行為に仮想ページビューを計測したい場合も、同じような形式で実装すればよい。「onclick」は「クリックしたときに」ということを表すイベントハンドラだ。1つ1つのリンクにカスタマイズを施すのは面倒な場合もあるだろう。仕様を変更したい場合にどこにカスタマイズを施したのかがわからなくなってしまうおそれもある。JavaScriptのライブラリを活用すれば、リンクに特定のクラス名を付けておけば自動的に計測したり、「.pdf」のリンクを自動的に計測したりという実装もできる。詳しくはシステム担当者に相談してみよう。上記で説明したPDFファイルのダウンロードや外部リンクのクリックを把握するために仮想ページビューを利用した場合には、直帰率に影響が出ることに注意が必要だ。以下のケースで説明しよう。→外部リンクのクリックを計測→外部サイトへケース1は、ページAが1ページビューだけ見られたことになるので直帰セッションとなり、ページAでの直帰が1カウントされる。一方でケース2は、ユーザーの動きは実質的には同じだが、仮想ページビューでの外部リンク計測が2ページ目の閲覧となるため、2ページビューのセッションとなり非直帰セッションになる。「ページAで直帰した」とはカウントされなくなるのだ。1つの注意点としては、仮想ページビューはその名のとおり実際には存在しない架空のページなので、[すべてのページ]レポートにあるリンク(図4赤枠部分)をクリックしてもエラー表示になることだ。コンテンツ]>[すべてのページ]レポート「行為を計測する」には、ここで解説した仮想ページビューのほかに、イベントトラッキングで計測する方法もある。仮想ページビューとイベントトラッキングは、どのように使い分けたらよいのだろうか。次回はイベントトラッキングについて解説する予定だ。仮想ページビューが計測されない場合の対処法(上級者向け)少し上級者向けの話になるが、まれにクリックの計測データが送信される前にブラウザの表示動作が先に完了することがあり、その場合仮想ページビューのデータが送信されないという問題が起こることがある。回避方法はあるのだが、100%すべてうまくいく方法というのはなかなかない。各種回避方法については以下のページで詳しく解説があるので、参照してほしい。アナリティクス中心)に興味がある方はこちらをご確認ください。メーカー勤務後、日経BP社へ。調査部、インターネット視聴率センター長などを経て、2000年ネットレイティングスへ。視聴率サービスやアクセス解析サービスの立ち上げに尽力。2006年株式会社クロス・フュージョンを設立し代表取締役に。(17/11/30)Googleアナリティクスを時間帯・曜日別で分析。最近(過去90日間)の記事で、Facebookの「いいね!」が多かった記事をお見逃し無く。いいね!※記事へのコメント機能は2021年11月をもって終了しました。編集部へのご連絡は、問い合わせフォーム・メール・Twitterなどをご利用ください。広告が目指す戦略アドフラウド対策でCPA改善!「おとなの自動車保険」のデジタル広告が“損失1700万円”を克服するまで成功事例・失敗から学ぶWebサイトリニューアル。明治安田が取り組むUX改革とデザイン内製化。Web担リアルイベント11/19・20開催すべて見るインフォメーションWeb担のメルマガを購読しませんか?Web担の記事がコンパクトに毎週届くメールマガジン「Web担ウィークリー」は、10万人が読んでいる人気メルマガ。忙しいあなたの情報収集力をアップさせる強い味方で、お得な情報もいち早く入手できます。編集後記サイトマップFAQ(よくある質問とその答)Web担に広告を掲載しませんか?購読者数10万人のメールマガジン広告をはじめとする広告サービスで、御社の認知向上やセミナー集客を強力にお手伝いいたします。Web担主催のイベントに協賛しませんか?年4回実施している数百人~3,4千人規模の無料イベント。イベントに協賛して、新規のリード獲得・認知向上をしませんか。寄稿記事・取材の企画の募集はこちらWeb担に寄稿したい、取材してもらいたい、などの場合はこちらから情報提供お願いします。