アクセス解析担当が必ずやってるGoogleAnalytics設定のまとめ【2018年版】

## この記事について
「GoogleAnalyticsの設定、どうしたらいいんだっけ...」と迷ったときのためのレファレンスです。
新規のサイトを立ち上げる時・GAの再設計がしたくなった時に参照してください。

- のちのちアクセス解析しつつ改善していくために、できるだけ汎用的にデータを拾っておく
- 可能な限り、非コーダーができる作業で完結させる

というのをテーマにまとめました。

## STEP 0: GTM・GAのアカウントを取得
Googleのアカウントがあれば、驚くほど簡単に取得できます。

- <a href="https://support.google.com/analytics/answer/1008015?hl=ja">GoogleAnalyticsのアカウントを作る</a>
- <a href="https://www.google.com/intl/ja/analytics/tag-manager/">GoogleTagManagerのアカウントを作る</a>

基本的には、GoogleTagManager（以下、GTM）経由でGoogleAnalytics（以下、GA）を導入します。GTMの使い勝手がよいのはもちろん、GAをカスタマイズしたくなったときに、コーダーの手を借りずに実行しやすいためです。

以後、説明用のキャプチャにはデモサイトとしてはてなブログを使います。

## STEP 1: まずはGoogleAnalyticsを動かす
- GTMを自分のサイトに実装

公式レファレンスを参考に、GTMを入れます。<a href="https://support.google.com/tagmanager/answer/6103696?hl=ja&ref_topic=3441530">（設定とインストール）</a>
ここはコーダーにお願いしましょう。本番環境を触るスタッフなら、「タグマネ入れといて！タグこれね！」でわかってくれると思います。
<br>

- GoogleAnalyticsをタグマネージャーに挿入

これもウェブ上にあるレファレンス<a href="https://support.google.com/analytics/answer/6163791?hl=ja">（Googleタグマネージャを使用したGoogleアナリティクスのインストール）</a>を見つつ、GAをタグマネージャーに入れます。用意するものは、GAのプロパティ番号だけです。
![unnamed.gif](https://qiita-image-store.s3.amazonaws.com/0/207239/cc459894-3141-5691-4eca-c647011b78a1.gif)
<br>

- 自分のサイトにアクセスして 「リアルタイム」のレポートを見る

![スクリーンショット 2018-03-08 1.24.14.png](https://qiita-image-store.s3.amazonaws.com/0/207239/7735cb5d-823d-be0f-1ca0-f7cf26fd863c.png)
<br>リアルタイムでユーザーが1と出たらうまくいっています。これでこのSTEPはクリアーです。

## STEP 2: まずはこの設定
このSTEPで、基本の設定を進めておきます。
### IPのフィルタ
先ほどは自分のアクセスを計測して、GoogleAnalyticsが動いていることを確認しました。ただ実際は、自分はじめ、サイト関係者のアクセスは計測したくありません。
関係者のアクセスを計測から除外するためには、「特定IPのアクセスはGoogleAnalyticsで計測しない」と設定する「フィルタ」を使うのが一般的です。ではやってみましょう。

まず自分のIPを調べます。
Googleで『自分のIP』と検索してみて下さい。すると、「自分のIPアドレスを表示する」のような記事がヒットします。どこでもいいのでクリックすると。自分のIPアドレスがわかります（ここでは、会社の固定IPを想定しています）。
![aiueo.png](https://qiita-image-store.s3.amazonaws.com/0/207239/aaefb76d-011d-67d3-17e1-968f0f93ead3.png)
<br>ここからフィルタの設定を行うため、GAに戻ります。
画面左下の歯車をクリックして、"すべてのフィルタ"→赤いボタン「新しいフィルタ」を選択して、「除外」の設定をします。
![スクリーンショット 2018-03-08 1.41.25.png](https://qiita-image-store.s3.amazonaws.com/0/207239/2fae2798-b070-a6fb-993b-83aec5c91029.png)
<br><b>フィルタを設定したら必ずテストをしましょう。</b>
そのままGAで、リアルタイムのレポートを見て下さい。「PCでアクセスしたときにはPVがつかないが、個人スマホ（会社のwifiに繋がず、LTE回線で繋ぐ）でアクセスしたらPVが計測されている」が確認できればOKです。

### IP以外のフィルタ
可能な限りおかしなアクセスデータは除外することを念頭におくと、IPのフィルタだけではゴミデータを排除しきれないケースがあります。
今回例にとっているはてなブログで言えば、/preview/配下は管理者しか見ないはずのページです。従って、このPVは実績として把握する必要はありません。PVのかさまし＝ミスリードにもなりかねないので、ここを除外しておきましょう。
これも「フィルタ」から設定をします。
![スクリーンショット 2018-03-08 11.10.29.png](https://qiita-image-store.s3.amazonaws.com/0/207239/fb7887bd-592a-9545-e312-3710f3045f2c.png)
<br>「フィルタ」設定をした後は、必ずリアルタイムのレポートを見て、きちんと除外できているか確認します。また、<b>ゴミデータ以外のデータが除外されていないかのチェック</b>も忘れずにやりましょう。

実案件では、テスト環境でのアクセス除外が必要になることが多いです。その際は、フィルタフィールドを「ホスト名」として、テスト環境のホストを除外するか、本番環境のホストに一致しないものを全て除外するなどして設定します。

小ネタですが、<b>テスト環境しか計測しないビューを作成しておく</b>のもオススメです。この記事中で記載するイベントやカスタムディメンションなど、ミスが出がちな設定を実験するのに使えます。

### コンバージョン
「会員登録をコンバージョンとおく、サンクスページは/complete/」のようなコンバージョン定義を考えます。
例にとっているはてなブログにサンクスページというものはないので、今回は/about/（自己紹介ページ）をコンバージョンポイントとします。

自己紹介ページは/about でPVが来ているようだったので、設定はこんな感じです。
ビュー設定から「目標」に入り、目標設定ができます。
![スクリーンショット 2018-03-08 11.04.25.png](https://qiita-image-store.s3.amazonaws.com/0/207239/4617ea19-4ff0-d1a7-fb0b-6b18f6387802.png)
<br>これで、/about　が見られるごとに、コンバージョンが計測されることになります。


### SearchConsole・Adwords連携
GAの話題と少しそれますが、使っているものはきちんと連携しておきましょう。

特に、<a href="https://www.google.com/webmasters/tools/home?hl=ja">SearchConsole</a>は確実に設定すべきです。
まずはSearchConsoleの画面に入り、GTMを使って<a href="https://support.google.com/webmasters/answer/35179?hl=ja">サイトの所有権を確認</a>します。
その後GAに戻り、「プロパティ設定」から「SearchConsoleの調整」ボタンで連携させます。

![sachiko.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/fe920233-c464-0aa5-e46f-749da525879b.jpeg)
<br>GAの「集客」でSearchConsoleのどれかのレポートが表示されればうまくいっています（実際のデータは2日くらい遅れて入ってくるようです）。

![スクリーンショット 2018-03-08 10.28.33.png](https://qiita-image-store.s3.amazonaws.com/0/207239/cbc3ad8e-569f-1534-8076-0e933488ae38.png)

## STEP 3: GAの管理画面での設定
### コンテンツグループ
「行動」→「すべてのページ」のレポートを見ると、結局どのコンテンツがどれだけ見られているかがわかりにくかったりします。
![page.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/ebdbca45-cd95-cb2f-38e9-76669fe908ad.jpeg)

一方、こう見えているとありがたいですね。

![cg.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/bbde5dbd-5f94-cae7-c742-dd4514c1c1f8.jpeg)

このレポートを可能にするのが<a href="https://support.google.com/analytics/answer/2853546?hl=ja">コンテンツグループ</a>です。
上のレポートでパスごとに列挙されてしまった/entry/配下のページは『記事』というグループにまとめましょう。その時はこのような設定となります。
![スクリーンショット 2018-03-08 11.23.37.png](https://qiita-image-store.s3.amazonaws.com/0/207239/8bf2724e-6478-3ef5-917d-977d0219e87a.png)

面倒ですが、全ページにもれなく設定しておき、コンテンツグループでくくった際に可能な限り(not set)が出てこないようにしましょう。
<b>コンテンツグループは、設定以降に発生したPVだけ</b>をグループにしてくれます。どれだけ遅くともサイトリリースまでにはコンテンツグループの設定を完了させておきましょう。

コンテンツグループはビューごとに5個まで設定できます。まずは１個練習で作ってみて、のちのち漏れをなくすよう改善していくスタンスで進めるとよいと思います。

### （追記アリ）クロスドメイントラッキング
実際のサイト運用の中で、
・同じ意味合いのサイトだが、www.hoge.co.jp と sp.hoge.co.jp など、ドメインを複数使っている
・カートや資料請求フォームのみ、ASPツールなど、全く異なるドメインに遷移させている
といったサイト構成が用いられることがあります。

別ドメイン間の遷移やPVは、デフォルトのGoogleAnalyticsでは正確に計測できません。ドメイン間の遷移が正しく取得できない結果、直帰率や離脱率が正しく計測できないことになります。
なのでこういうサイト構成を見たら、機械的にクロスドメイントラッキング設定をしてあげましょう。もちろん、それらのドメインに（相互にリンクがないなど）関係がない場合は、この設定をする必要はありません。

状況に応じて設定方法が異なるため、公式レファレンスを見ながら設定しましょう。
<a href="https://support.google.com/tagmanager/answer/6106951">クロスドメイントラッキング</a>
クロスドメイン設定を行っているサイト間でリンクしたときに、URLにGAのパラメータがついてくればうまくいっています。
![cdt3.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/ba87ffee-e7b4-ceb8-6e66-b3bf93cdd2a4.jpeg)

### <b style="color: red;">（追記）【絶対やってください】リファラー除外設定</b>

クロスドメイントラッキング設定後に、「リファラー除外」という設定をやってください。
「リファラー除外」は、たとえば社内イントラや、海外のいかにもスパムサイトからリンクされてきた、サイト運営と関係なさそうなトラフィックを除外するための機能の一つです。

ここで「リファラー除外」が必要な理由は下記のとおりです。
たとえばECサイト（ドメインAとします）でカートはASP（ドメインB）を使っているとします。
Aで商品ページを回遊してもらったあと、Bに遷移して決済、サンクスページは再度Aに戻るシステムとします。
このとき、リファラー除外がしていないと、A→BのセッションとB→Aのセッションが、リファラー変更により、全く別のセッションとみなされてしまいます。
すると、最終的にコンバージョンしたユーザーが、商品ページでどのような回遊をしていたかが分析できません。
また、コンバージョンを取れるチャネルが、Referrerばかり（場合によってはDirectばかり）になってしまいます。
このような、重大なエラーを避けるために、この設定が<b>必須</b>です。やっていきましょう。

設定は非常にシンプルです。
プロパティ設定の画面からトラッキング情報→参照元除外リストと進み、
![_1234.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/f1277e71-3f8b-7921-7ca1-483173783a8d.jpeg)

除外したいドメインをペタペタ貼っていってください。
上の例でいえば、ドメインAとBの2つがマストになります。
![abc.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/9ef636f5-ebe7-8ea2-ac26-e182e35269e8.jpeg)

翌日、チャネルのレポートから、除外設定をしたドメインがReferrerに存在していなければOKです。




## STEP 4: イベント
ここからは、JavaScriptの記述を伴う設定になります。なので、コーダーのリソースが身近なところに十分あるのであれば、本来はマスターする必要はないかもしれません。
ただこういったカスタムができることを覚えておくと、サイトのKPIに応じた分析設計がおいおいできるようになると思います。
まずはウェブ上のレファレンスを真似して、コピペでもいいので設定してみましょう。
### イベント
- クリック

ページ内での要素クリック情報をGAに送ります。
例えば、「もっと読む」の押された数を計測するとか、ベタなところではpdfのダウンロード数を計測するのに使います。
PVベースで遷移を追えなくもないのですが、ユーザーの行動を追いかけたいという部分では、クリックの取得は拾っておくべきではないでしょうか。画像のモーダル表示やスライドショー表示をするようなページでは、ユーザーがどの程度画像を気にかけているか測る物差しにもなりそうです。
機械的にでもクリック情報は取得しておいて間違いないと思います。


GTMを使ったクリックイベントのトラッキングは、ウェブ上で語り尽くされている印象です。
検索するとたくさん出てきますので、キャプチャがたくさんあってわかりやすいサイトを引用して、実験してみましょう。

例に出している当ブログでは、クリックイベントは
- カテゴリーに、クリックのあったページURL
- アクションに、「click」と固定文字
- ラベルに、クリックされたページのリンク要素
を送信するようにしています。
![1235.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/c418c57b-5f13-b2d3-19ac-0462359b004d.jpeg)
<br>

- スクロール

スクロール計測はこちらの記事を参考にさせていただいています。<br>
<a href="http://blog.hatenablog.com/entry/2018/02/28/143000">15分で設定完了！ Google Tag Managerで記事の「読了率」と「スクロール率」を取得しよう【小川卓のブログ分析入門 第2回】 - 週刊はてなブログ</a>
![スクリーンショット 2018-03-08 18.03.12.png](https://qiita-image-store.s3.amazonaws.com/0/207239/f0734524-76c4-64c9-3d4c-006ec36b3fff.png)
<br>スクロール計測のイベントはこのようにレポート化して使います。（ここではPVが少ないのでなんともいえませんが...）
例えば75%を読了ポイントとすると、（直帰だったとしても）何人が読了してくれたかを測ることができます。

見出し（h2、h3など）の文言を取得するタイプのスクロールトラッキングもあります。
あまりにも縦長で25%と50%の間に大きな距離がある場合は、見出しで取得するのがいいでしょう。臨機応変に使います。

コンテンツマーケティングやYahoo！コンテンツディスカバリーへの出稿など、読み物系のコンテンツを積極的に打ち出している会社様では、このような計測を用いて、読了有無の検証をしていくのがよいと思います。

### 非インタラクションヒットについて
最後に、イベントを計測するときに、「非インタラクションヒット」という欄があります。イベント発生を非直帰と判定するかどうか、を操作するフィールドです。
いきなりとても乱暴ですが、イベントでやっていることがクリック・スクロールだけなら、<b>非インタラクションヒット＝真（true）で覚えておく</b>のがよいのではないでしょうか。
非インタラクションヒットを偽（または空欄）にしておくと、ちょこっとスクロールしただけで非直帰、と判定されてしまいます。とすると極端に直帰率が下がり、結果的にデータが荒れてしまいます。


### カスタムディメンション
- クライアントID

GAが、ユーザーごとにID（クライアントIDと呼んでいます）をふっています。
これをディメンションに入れると、例えばこのIDの方が、どのページを見ていて、特定の期間に通算何ページ見てくれているのかがわかります。
![clid.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/e4a7efa5-d7b9-6203-a84c-59cf8f38d682.jpeg)
<br>
ユーザー数が膨大でない場合は、このように個別にユーザーを観察して、サイトやサービス設計の足しにしていきます。
ただ、デフォルトではこのIDはレポート画面に出ていませんので、カスタムディメンションとして、PVと一緒にGAに送信する必要があります。

いつも参考にさせてもらっているのが、こちらのブログ内容です。
JavaScriptの記述（といってもコピペですが）があるので、じっくりテストしながら進めましょう。
<a href="http://www.cms-ia.info/news/how-to-measure-google-analytics-client-id-with-gtm-2017/">GTMでGoogleアナリティクスのClient IDを取得する一番確実で楽な方法（2017年版）</a>



- ミリ秒

ミリ秒のディメンションがあると、痒いところに手が届きます。
GoogleAnalyticsでは「秒」というディメンションが用意されておらず、最も細かい時間単位が「分」になっています。
となると、一分以内に複数のページ移動されてしまうと、ユーザーの遷移順が細かく追えないケースが出てしまいます。
ありがたいことに、予めdataLayerにあるgtm.startをカスタム変数に入れると、そのままミリ秒として使えます。
これをカスタムディメンションに入れましょう。

いきなりデータレイヤーの変数でカスタム変数を作ります。
![スクリーンショット 2018-03-08 11.28.15.png](https://qiita-image-store.s3.amazonaws.com/0/207239/a1220af8-9996-643f-0f37-9afab747cba3.png)

先ほどと同じ流れで、GTMに入っているGAのタグに設定します。
![スクリーンショット-2018-03-08-11.32.31.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/4c57a3ae-5404-6a12-a226-4eb9675264c1.jpeg)

レポートはこんな形になります。
ミリ秒をセカンダリディメンションに入れると、ページビューをローデータの粒度で加工して取得できます。
![スクリーンショット 2018-03-08 11.30.30.png](https://qiita-image-store.s3.amazonaws.com/0/207239/24ec1174-6520-5e6d-cda6-a210e6e95c53.png)
<br>これで、ユーザーもPVもある程度個別に分類・取得できるようになりました。
細かくデータが取れていればいるほど分析がしやすくなります。
たとえばこの図のように、ユーザーごとにどのページをどの順番で見たかの情報が一覧できます。
![___.jpg](https://qiita-image-store.s3.amazonaws.com/0/207239/6eb9d197-2a48-fa59-df0d-a2f7f7f365f5.jpeg)



## 最後に
記事を読みながら設定を行ったという方は、非常に長丁場の作業になったと思います。ただ、ここでまとめたものはあくまで最低限であって、ここからサイトの狙いやKPIに合わせて味付けしていくのが腕の見せどころです。
もともとGAはタグ貼ってハイ終了というものではありません。GAを単なるアクセスカウンターとして使うのではなく、ウェブ上の行動データ置き場としてきちんと活用していきましょう。

一方で、これらの設定を短期間でミスなくこなし、かつ確認作業も済ませるというのは非常に酷です。
なので、例えば立ち上げ一週間などはGoogleAnalyticsの試運転期間と割り切って、取得したデータにミスがないか確認し続けるのがよいでしょう。後々の大きなミスを未然に防ぐ意味でも、正しくデータが取れるまでGAに張り付くのがベターかもしれません。

他にもこういう設定をすべきだ、という内容があれば、ぜひフィードバックをいただけると幸いです。