Google Analyticsでリンクなどのクリック計測をするイベントトラッキングの設定方法

公開日: 2019/10/26 更新日: 2019/10/26
カテゴリー: Web解析
  • このエントリーをはてなブックマークに追加

Google Analyticsでは、Wenサイトのアクセス数や滞在時間、どこのページに遷移したのか、といったデータだけでなく、Webサイト上でユーザーが起こした行動も知ることができます。

このユーザー行動は「イベント」と呼ばれ、イベントトラッキング用のコードを記述すれば計測できるようになり、リンクのクリックやPDFダウンロード、外部サイトへの遷移、電話をかける、といった行動を把握できます。

さらに、ページ内のあちこちに存在するリンク、例えばページの上部、中ほど、下部にある同一のリンクに対して、別々のイベントトラッキングを設定しておけば、どこが一番クリックされるのかといった分析がしやすくなります。

そこで今回は、Google Analyticsのクリックイベントの計測をするための設定方法と設定時のポイントや注意点について解説します。

スポンサードサーチ

Google Analyticsのイベントトラッキングとは?

Google Analyticsのイベントトラッキングとは、ページに設置されている外部リンクをクリックした数、資料がダウンロードされた数、またスマートフォンなら電話番号が押された数などを調べることができます。

これには、取得したいイベントごとに設定を行うため、Googleアナリティクスの通常のタグとは別に設定する必要があります。

Google Analyticsのイベントトラッキングの仕組み

Google Analyticsのイベントトラッキングは、Webサイトにイベントのタグを組み込むと、ユーザーのアクセスログがアナリティクスに送信されます。

Google Analytics内の「行動」の中にある「イベント」の「概要」をクリックするとイベントで取得したデータを見る事ができます。

Google Analytics イベントトラッキング
Google Analytics イベントトラッキング

Google Analyticsでイベントトラッキングを設定する方法

Google Analyticsでイベントトラッキングを設定するには、2つの要素が必要です。

まず最初に、通常のGoogle Analyticsのタグを設定してWebサイトのトラッキングを始める事。

次が、Google Analyticsのイベントトラッキングコードの埋め込みです。

このイベントトラッキングのコードは、次のような形式となっています。

ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

ga以降に値については、それぞれ以下の内容を設定します。

項目名内容記入例
eventCategory:カテゴリユーザーがクリックする対象の名前ad(広告)、movie(動画)、image(画像)、link(リンク)、button(ボタン)、outbound(外部サイトへの遷移)、 pdf、 pc(PCサイト)、sp(スマホサイト)等
eventAction:アクションユーザーの行動click(クリック)、download(ダウンロード)、play(再生)、tel(電話)等
eventLavel:ラベル(推奨オプション)イベントの名前inquiry、ファイル名、画像名、動画名、pdf名、キャンペーン名、 「お問い合わせ」、「資料請求」 、「資料ダウンロード」、「Yahoo!へのリンク」等
eventValue:値(省略可)イベントに関する数字,値1(クリック)、1000(1,000円の価値想定)など

参考:eventCategory:カテゴリ

eventCategory:カテゴリは、計測するデータのグループの名前をつけます。

例:ad(広告)、movie(動画)、image(画像)、link(リンク)、button(ボタン)、pdf、outbound(外部サイトへの遷移)、 pc(PCサイト)、sp(スマホサイト)等

eventAction:アクション

eventAction:アクションは、計測したい行動の具体的な名前を付けます。

例:click(クリック)、download(ダウンロード)、play(再生),tel(電話)等

eventLavel:ラベル(推奨オプション)

eventLavel:ラベル(推奨オプション)は、個別イベントの名前で好きな名前を自由につけて結構です。

例:inquiry、ファイル名、画像名、動画名、pdf名、キャンペーン名、 「お問い合わせ」、「資料請求」 、「資料ダウンロード」、「Yahoo!へのリンク」等

ただ、このga以下のコードをこのままページに埋め込んでも動作をしないので、以下のように計測したいHTMLタグのイベント属性値とする必要があります。

<a href="リンクURL" onClick="ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);"><img src="photo.jpg"></a>

この前半にある「onClick」は、JavaScriptのイベントハンドラ(event handler)と呼ばれるもので、クリックなどの特定の行動をきっかけに実行する処理になります。

様々なイベントハンドラ

Google Analyticsのイベントトラッキングでは、このJavaScriptのイベントハンドラ (event handler)を使用できます。

リンクをクリックしを計測する場合は、このonclickを利用して「クリックされたらトラッキングデータを送る」と設定しますが、他にも以下のようなイベントを取得する事ができます。

項目内容
onclickクリックされたらイベント発生
onmousedownマウスボタンが押されたときにイベント発生
onmouseout要素からマウスが離れたらイベント発生
onmouseover要素にマウスが触れたらイベント発生
onmouseupマウスボタンを押し、ボタンが戻る時にイベント発生
onmousemoveマウスが移動したらイベント発生
ontouchstart画面をタッチされたらイベント発生
ontouchmove画面をタッチ後、指を動かす度にイベント発生
ontouchendタッチ後、画面から指が離れたらイベント発生

直帰セッションの判定

イベントトラッキングを設定すると、ページでイベントが発生するとそのページでのユーザー行動は「直帰ではない」とみなされます。

イベントトラッキング設定時の離脱
イベントトラッキング設定時の離脱

例えば、ユーザーAのようにイベントトラッキングを設定している外部リンクがあるページにランディングした際、外部リンクをクリックせずに離脱すれば直帰となりますが、ユーザーBのように外部リンクをクリックすれば直帰にはなりません。

同様に、PDFのダウンロードをイベントとして計測している場合、ユーザーCのようにPDFのダウンロードをせずに離脱すれば直帰となりますが、ユーザーDのようにPDFのダウンロード後に離脱しても直帰とはなりません。

イベントトラッキングをしていなければA、B、C、Dのどのユーザーも直帰となるので、イベントトラッキングの実施によって、そのページの直帰率が変わってきてしまいます。

この場合、ユーザーBのように外部サイトへの離脱は直帰にしたいが、 ユーザーDのようにPDFのダウンロードは直帰にする必要はない、というように状況によって使い分けたい場合には、以下のようにトラッキングコードにnoInteraction フィールドを追加します。

<a href="外部サイトのURL" onclick="ga('send', 'event', 'outbound', 'click', {'nonInteraction': 1});">外部サイトへ</a>

この{‘nonInteraction’: 1}の数字は、「{‘nonInteraction’: true}」にしても大丈夫です。

こうすることで、外部サイトのリンクのみを直帰扱いにすることができますが、全てのリンクに対してこの設定を行う必要があります。

実際にイベントトラッキングで取得したデータ

実際にGoogle Analyticsでイベントトラッキングを行うと、以下のようなデータが取得できます。

イベントカテゴリ
イベントカテゴリ

イベント、アクション、ラベルというようにデータが取得できています。

イベントアクション
イベントアクション
イベントラベル
イベントラベル

こちらの例では、どの画像・サイズのものがどれだけダウンロードされたのかをGoogle Analyticsで確認をすることができるようになっています。

カテゴリ、アクション、ラベルの付け方について

Google Analyticsのイベントトラッキングで設定できるカテゴリ、アクション、ラベルのそれぞれの意味については既に解説しましたが、この名前は自分の好きなように大文字、小文字、日本語で設定ができます。

カテゴリは大分類、アクションは中分類、ラベルは小分類 というように考えるとわかりやすいですが、最終的にはGoogle Analyticsで分析を行う際に自分がどのように分けたいかを考えて設定する事が重要です。

例えば、画像のダウンロードとPDFのダウンロードのイベントがあった場合、ダウンロードでグルーピングをして個別分析をしたい場合には、カテゴリを「download」にして、アクションに「Image」と「PDF」を設定するのがいいでしょう。

一方、画像はダウンロードだけでなく閲覧もあった場合に、カテゴリに「Image」と「PDF」を設定し、アクションに「download」と「view」を設定する、という事の方がいいかもしれません。

このように、自分が分析をしたい分類を考えてから、カテゴリ、アクション、ラベルを付けましょう。

良く使われそうなイベントトラッキングコード例

最後に、よく使われそうなクリックイベントのコードを用意しました。

ただ、こちらはあくまで例であり絶対的な正解というのではありませんので、自分が計測したい形にカテゴリやアクション、ラベルは変えて使ってい見てください。

ファイルのダウンロード

<a href="ファイルのURL" onclick="ga('send', 'event', 'pdf', 'download', 'sample.pdf');">資料ダウンロード</a>

バナーAから外部サイトへのクリック

<a href="外部サイトURL" onclick="ga('send', 'event', 'promotion', 'click', 'バナーA');"><img src="/images/banner-a.jpg" alt="キャンペーンバナー"></a>

外部サイトへのリンククリック

こちらは、上とラベル名のところを変えています。

<a href="外部サイトURL" onClick="ga('send','event','outbound','click',this.href ,{'nonInteraction':1});">外部サイト</a>

「this.href」は、自身のaタグのhrefに記載されている値を取得してきてくれる、つまりリンク先URLをラベルに自動で設定してくれます。

スマートフォンでの電話

スマートフォンで電話番号をクリックしたイベントを計測します。

<a href="tel:電話番号" onClick="ga(‘send’, ‘event’, ‘button’, ‘click’,’inquiry’);">電話番号</a>

ただし、電話番号のリンクをクリックしたものを計測するため、実際に電話がかかっているかどうかまではわかりません。

スポンサードサーチ

タグ: , , , , , ,