衣袋教授のGoogleアナリティクス入門講座

Googleアナリティクスの導入から、運用、活用まで、正式なサポートがない初めての人でもゼロから学んでいけるように、丁寧に解説していく。

Googleアナリティクスとは/衣袋教授のGoogleアナリティクス入門講座
ナビゲーションのリンクを分析・評価するには?――実例で解説!イベントトラッキング(1)[第66回]

ナビゲーションのリンクのクリック数を、イベントとして取得して、分析する方法を、実例を挙げながら具体的に説明する。

ページ

前回は、「イベントトラッキング」という手法についての解説を行った。その冒頭でも書いたが、イベントトラッキングの使用例として、

  • 外部サイトへのリンクのクリック
  • PDFファイルのダウンロード
  • Flashコンテンツの各種動作

などの「行為」の計測を挙げたが、もしかすると、多くの読者にとっては、これだけでは、具体的な活用方法がピンとこなかったかもしれない。

そこで、これから何回か、イベントトラッキングの活用例を具体的に解説していくことにする。「イベントトラッキング」のトラッキングコードの仕様に関しては、前回の記事を参照してほしい。

また気を付けておきたい点は、「取れるものは取ってみよう」という態度ではなく、つねに課題や仮説からスタートしてほしいということだ。Webコンサルティング側で仕事をする方なら、勉強のために何でもやるのは構わないが、事業者側の方々がデータに溺れてしまう必要はない。

データを取ってみて、その後に都合よいように解釈するのではなく、

  • どうあるべきか
  • どうなっていてほしいか
  • どう変えられるのか
  • その結果どう変わってほしいのか

という仮説検証型でイベントトラッキングも取り組んでほしい。ということで、実際のサイトを例にして、課題設定から始めていきたい。

ちなみに、私は今回取り上げるサイトとは無関係の第三者である。イベントトラッキングの仮説は、あくまでも想像上の話であり、数値もこのサイトのものではない。以前の連載「有名サイト、かってに解析!」のようなものだと考えていただきたい。

なお、JavaScript用のライブラリのjQueryを利用し、これら典型的なイベントを簡単に自動的に取得できるような機能拡張JavaScriptなどもあるが、それに関してはイベントトラッキングの活用例の最後の回に紹介する。簡単に実装するためには、現実的にはこのような手法を使うのがよいと思うが、ここではあえて1つずつベタに記述する場合のカスタマイズを解説する。

まずは課題を設定しよう

図1は「三井住友VISAカード」の「カード会員の方」の画面だ。

カード会員のユーザーが、左上のログイン(図1黒枠部分)から、カード会員用のサービスを利用することがこのページの本来の目的だが、各メニューの使い方を補足したり、追加のサービスを告知したりするスペースにもなっているページだ。

図1:三井住友VISAカードの「カード会員の方」
図1:三井住友VISAカードの「カード会員の方 」(2013/08/27アクセス)

このページでは、メニューの使い方や、サービス告知といった情報へのリンクを、主に3ヵ所に分けて表示している。

  • グローバルナビゲーション部 (ページ上方にある図1赤枠部分)
  • 各メニュー部 (ページの左サイドにまとめている図1青枠部分)
  • リンク群 (ファーストビューの下部にある図1緑枠部分)

今回は、このWebサイトのWebマーケティング部の担当者が、この3ヵ所に複数散らばっているリンクの配置構造がこれで本当によいのだろうかという問題意識を持っているとしよう。

【問題意識】

リンクの配置構造は、これでよいのだろうか?

というのも、よく使うリンクは左側、あるいは上側に配置するのがよいというWebコンサルタントの話を聞いていたし、クリックされているリンクはもっと目立たせた方がよいのではないか、迷っている。

そこで、まずは、全般的にどのリンクが相対的にクリックさているのかを把握したいと考えた。

Googleアナリティクスの機能では「ページ解析」で任意のページのリンク(URL)ごとのクリック率の計測はできるが、同一ページ内に同じURLのリンクが複数あった場合、その判別はできない。拡張リンクのアトリビューション設定を有効にしても、サイトの作りによっては100%の精度であるとは限らないからだ。詳しくは以下の記事を参照してほしい。

そこで、イベントトラッキングの登場だ。実際のこのサイトでは、グローバルナビゲーション部の一部はプルダウン表示から複数のリンクが選択できるなど、細かい部分では様々な細工がしてあるのだが、ここでは単純に3か所すべてに同一のテキストリンクが貼ってあるとして話を進める。

トラッキングコードの実装例

それではこのケースにおけるトラッキングコードの実装例を紹介する。イベントトラッキングのおさらいを簡単にしておこう。ユニークに設定する項目は、

  • イベントカテゴリ
  • イベントアクション
  • イベントラベル
  • イベント値

の4つで、クリック行為に対してイベントを発生させる場合のフォーマットは下記のようになる。

<a href="http://example.jp/" onclick=
"_gaq.push(['_trackEvent', 'イベントカテゴリ', 'イベントアクション', 'イベントラベル', イベント値, true]);">ここをクリック</a>
※前回は'category', 'action', 'opt_label', opt_value, opt_noninteractionと英語にしていたが、今回はより分かりやすいように、日本語にしてある。

イベントカテゴリの設定

<a href="http://example.jp/" onclick=
"_gaq.push(['_trackEvent', 'イベントカテゴリ', 'イベントアクション', 'イベントラベル', イベント値, true]);">ここをクリック</a>

「イベントカテゴリ」は大分類なので、内部リンクの計測全体を示す「inclick」と固定で指定しておくことにする。

イベントアクションの設定

<a href="http://example.jp/" onclick=
"_gaq.push(['_trackEvent', 'イベントカテゴリ', 'イベントアクション', 'イベントラベル', イベント値, true]);">ここをクリック<a>

イベントアクションは中分類なので、リンクがあるおおよその場所を示すものという位置づけにして、

  • top
  • left
  • right
  • center
  • bottom

などとしてみよう。今回はグローバルナビゲーションと左、中央の3つのパターンがあるので、「top」「left」「center」の3つを、リンクの場所に応じてそれぞれ使用するものとする。

リンクの場所 イベントアクション
グローバルナビゲーション top
左サイドのメニュー部 left
ファーストビュー下部のリンク群 center

イベントラベルの設定

<a href="http://example.jp/" onclick=
"_gaq.push(['_trackEvent', 'イベントカテゴリ', 'イベントアクション', 'イベントラベル', イベント値, true]);">ここをクリック<a>

イベントラベルはリンク先のURLを指定するものとする。リンク先のURLが次の5つだったとしよう。イベントラベルは、それぞれのURLからドメイン名と拡張子を除いて「link1」などとしよう。

リンク先のURL イベントラベル
http://example.jp/link1.html link1
http://example.jp/link2.html link2
http://example.jp/link3.html link3
http://example.jp/link4.html link4
http://example.jp/link5.html link5

イベント値とtrueの設定

「イベント値」はこのケースでは特に指定しない。クリック行為が何かの価値を生み出していたら値を付与しても良いが、このケースではクリック量を相対的に比較するのが目的だからだ。

最後の「true」は直帰率への影響が出ないように、つねに付けておくことにする。

トラックイベントコードを実装する

さて、あとは3ヵ所×5つ=15個のリンクに対して、HTMLのソースコードに、次のような修正を加えよう。

<a href="http://example.jp/link1.html>/link1へのリンク</a>

改修後

<a href="http://example.jp/link1.html 
onclick="_gaq.push(['_trackEvent', 'inclick ', 'top ', 'link1', , true]);">/link1へのリンク</a>

ここでは1つしか提示しないが、15個のリンクすべてに対して修正が必要で、青字部分は15個でそれぞれ別々になる。

次のページへ

ページ

筆者の『ユニバーサルアナリティクス版Googleアナリティクス完全マニュアル(PDF)』が発行されました。

筆者が講義を行うGoogle アナリティクス徹底講座も、定期的に開催しています。  → Google アナリティクス ゼミナール

tweet26このエントリーをはてなブックマークに追加
日本赤十字社 東日本大震災 義援金募集
Web担メルマガでラクラク情報ライフを
注目記事が毎週手もとに届いて見逃さない
要チェックのセミナー情報もゲットできる
編集長コラムを一足先に読める
―― 10万人が読んでいる、Web担必読メルマガです

今日の用語

SEO
検索エンジンからサイトに訪れる人を増やすことで、Webサイトの成果を向上させる施 ... →用語集へ

連載/特集コーナーから探す

インフォメーション

Web担のメルマガを購読しませんか?
Web担の記事がコンパクトに毎週届くメールマガジン「Web担ウィークリー」は、10万人が読んでいる人気メルマガ。忙しいあなたの情報収集力をアップさせる強い味方で、お得な情報もいち早く入手できます。

Web担に広告を掲載しませんか?
購読者数10万人のメールマガジン広告をはじめとする広告サービスで、御社の認知向上やセミナー集客を強力にお手伝いいたします。

サイトマップ
RSSフィード


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

GOLD SPONSOR
さくらインターネット株式会社株式会社KDDI ウェブコミュニケーションズ株式会社日本レジストリサービスHP Softwareトランスコスモス株式会社株式会社ハイパーボックスDomain Keeperアドビ システムズ 株式会社
SPONSOR
株式会社キノトロープ株式会社アイレップ株式会社ニューズ・ツー・ユーシックス・アパート株式会社ウェブアンテナ株式会社サイバーエージェント富士通株式会社SitecoreYahoo!プロモーション広告Oracle