autotrackのプラグインで遊ぶ

Google Analytics開発チームが作っているautotrack.jsで面白そうな拡張が出ているなと思いつつ…今月バージョンが1.0を向かえましたので、少しだけ遊んでみようかと思います。

autotrack.js はGAの新しいツールというわけではないのですが、元々GAの設定をカスタマイズするのは面倒だ…という場合にプラグインを使って簡単にキレイなデータ取得をしてしまおうと始まったと記憶しています。しかし今月バージョンが1.0に上がるタイミングで新しいプラグインが追加されたことによって、特にChromeを中心に新しく実装されたWeb APIを使った解析を体験出来るようになりました。

例えば…

■impressionTracker

これは「Intersection Observer API」を利用したもので、例えばページを開いたタイミングでは見えない特定のバナーや特定の領域がスクロール操作によって表示されたら、そのタイミングでイベントを飛ばすというもの。

テストではページの下の方にボタンを設置しておき、スクロール操作によってボタンが表示されたタイミングでイベントが飛びました。

■pageVisibilityTracker

Chromeをはじめタブブラウザを利用しているとウェブサイトを開いたままでもタブは非アクティブな場合がよくありますよね。

この非アクティブ <-> アクティブの変化時にイベントを飛ばすというもの。

この辺、凄く面白いですよね。

タブが非アクティブになったタイミングでセッションを一回切っても良いなと最近感じていました。

■cleanUrlTracker

autotrack.js が登場した当時からあったプラグインではありますが、URLをキレイにしてGAにデータを飛ばすというもの。

今回はURLにパラメータが付いていたら全て消してページビューとして集計するという設定。

URLのパラメータによって、同一ページなのにURLが大量に発生してしまい解析が面倒臭くなる…そんな事が無くなりますね。

■outboundLinkTracker

GTMが出てきた時から設定する人が多かった、自社サイトから他社サイトへのアウトバウンドリンクを踏んで出ていくイベントを取得するプラグインですね。

特定のページからどれだけ外に出ていってしまうのか等、アウトバウンドリンクを計測するサイトも最近は多いのかなという印象。

■eventTracker

クリックイベントも毎回onClickやら設定するのは面倒だという場合にはこのプラグインを使えばイベントもサクッと取得出来ます。(ソーシャルインタラクションなどイベント以外も利用可)

イベントカテゴリ「Video」に対するクリックイベントアクション「play」も。

他にもmedia queriesを利用してレスポンシブ・ウェブデザインを実装されているサイトでは「mediaQueryTracker」が、より解析の役に立ちますし、1ページ内でpushStateなどを利用してURLが変わる場合は「urlChangeTracker」が利用できるでしょう。

今回は全てデフォルト値で試しました。