Google Analyticsでページアクセス以外の情報を収集する

# はじめに
今までGoogle Analytics(以下、GA)はQiitaでしか使ったことがなかったのですが、先日[QiiTrend](http://qiita.com/tag1216/items/e65496b932ca6790268b)を公開した時に、GAではページアクセス以外にも色々な情報を収集できることを知りました。
よくわかっていない部分もあるのですがGAで収集できる内容と、QiiTrendでの使い方を紹介します。

尚、ここではGAの設定方法やサイトに組み込む時の具体的なコードは載せていません。
公式ドキュメントにわかりやすく書いてあるのでそちらを参照してください。

# GAで収集できること

GAでは以下のようなデータを収集できるようです。

### [ページ トラッキング](https://developers.google.com/analytics/devguides/collection/analyticsjs/pages?hl=ja)
- ユーザーがページを表示したことを記録します。
- ここでいうページとはURLに紐づいた画面のことです。
- 記録したデータは、GAのレポート>行動>サイト コンテンツ>すべてのページなどで確認できます。

### [アプリやスクリーンのトラッキング](https://developers.google.com/analytics/devguides/collection/analyticsjs/screens?hl=ja)
- スクリーンビューを記録します。
- ダイアログなどURLと紐づいていないものの表示を記録するためのものだと思います。

### [ソーシャル インタラクション](https://developers.google.com/analytics/devguides/collection/analyticsjs/social-interactions?hl=ja)
- ページに設置したソーシャルボタン(Twitterのツイートなど)のクリックを記録します。
- 記録したデータは、GAのレポート>集客>ソーシャル>概要などで確認できます。

### [イベント トラッキング](https://developers.google.com/analytics/devguides/collection/analyticsjs/events?hl=ja)
- URLの変更を引き起こさないユーザー操作を記録するのに使用します。
- 記録したデータは、GAのレポート>行動>イベント>概要などで確認できます。

### [カスタム速度](https://developers.google.com/analytics/devguides/collection/analyticsjs/user-timings?hl=ja)
- AJAXリクエストの時間の測定などに使用します。
- 記録したデータは、GAのレポート>行動>サイトの速度>カスタム速度の画面で確認できます。

### [例外のトラッキング](https://developers.google.com/analytics/devguides/collection/analyticsjs/exceptions?hl=ja)
- サーバー接続エラーなど、クライアント側で発生したエラーを記録できます。

# QiiTrendでやっていること

QiiTrendのフロントエンドはReact.js+react-routerで実装していて、GAはreact-gaというモジュールを使ってアクセスしています。

QiiTrendでは以下の情報を収集しています。

### ページビューの記録

QiiTrendにはトップページ(/)とトレンドチャートのページ(/trend)の２つのページがあるので、この単位でページビューを記録しています。

<img width="459" alt="ページ_-_アナリティクス.png" src="https://qiita-image-store.s3.amazonaws.com/0/35192/f12ba7d6-f143-0abc-8cb0-f311fd74eb2d.png">

### イベント トラッキング

イベントトラッキングとして以下の内容を記録しています。

- 外部リンクへのアクセス
- メッセージ表示

<img width="384" alt="上位のイベント_-_アナリティクス.png" src="https://qiita-image-store.s3.amazonaws.com/0/35192/441da4bc-172a-26a4-4e24-c390b03fdc78.png">

### APIレスポンスタイムの記録(カスタム速度)
QiiTrendでは検索クエリーを追加したり表示オプションを変更するとAPIをコールしてデータを取得するのですが、一度に取得できなかった時には数秒おきに再試行を繰り返します。
この最初のAPIコールから最終的にデータが取得するまでの時間をカスタム速度として記録しています。

<img width="702" alt="サイト上でのカスタム速度_-_アナリティクス.png" src="https://qiita-image-store.s3.amazonaws.com/0/35192/e324dfac-a705-6a0f-43aa-867dbb900dba.png">

### 検索クエリーと表示オプションの記録(サイト内検索)

QiiTrendでは検索クエリーと表示オプションを以下のようにURLのクエリーパラメータとして設定しています。

```
?mode=ratio&period=4&query=tag%3Apython&unit=yearly
```

これをGAのビュー設定でサイト内検索として設定することで、どんな検索クエリーが実行されているのかを確認しています。

<img width="471" alt="サイト内検索のサマリー_-_アナリティクス.png" src="https://qiita-image-store.s3.amazonaws.com/0/35192/239ff840-36a1-fe11-d789-a9dd91af5d0a.png">

<img width="474" alt="サイト内検索のサマリー_-_アナリティクス.png" src="https://qiita-image-store.s3.amazonaws.com/0/35192/3403c532-4a08-d536-1c89-45c9bffb17cc.png">

# 参考

- [Google アナリティクス  |  Google Developers](https://developers.google.com/analytics/?hl=ja)
    - [アナリティクスのトラッキング](https://developers.google.com/analytics/devguides/collection/?hl=ja)
    - [サイトに analytics.js を追加する](https://developers.google.com/analytics/devguides/collection/analyticsjs/?hl=ja)
- [アナリティクス ヘルプ](https://support.google.com/analytics#topic=3544906)
    - [サイト内検索を設定して検索データを確認する](https://support.google.com/analytics/answer/1012264?hl=ja)

- [react-ga/react-ga: React Google Analytics Module](https://github.com/react-ga/react-ga)
- [この夏Google Analyticsが新しくなるって知ってた？Universal Analyticsを予習しよう - Qiita](http://qiita.com/yuku_t/items/128ad659e1474c7e20d6)