この記事はAteam Hikkoshi samurai Inc. × Ateam Connect Inc. AdventCalendar2021 5日目の記事です。本日の担当は引越し侍エンジニアの@namiitaです。
はじめに
去年のアドベントカレンダーでは「webサイト改善のヒント」という記事を書きました。こちらに記載の通り、引越し侍ではGoogle Analytics(GA)をサイト改善に活用しています。
GAは使いこなせると便利なアクセス解析ツールですが、私たちバックエンドエンジニアはどちらかといえばアクセス解析よりプログラミングにかける時間の方が長いです。分析業務に関してマーケティング担当に一任している方も少なくないのではないでしょうか。
今回は、「とりあえず最低限GAを理解しておきたい」というエンジニアの方向けの記事となります。細かい操作方法などは記載しないので、実際に手を動かす際は色々調べてみてくださいね！ある日突然「このページをアクセス解析できるようにしておいて」と言われても焦らないように心構えしておきましょう。
GAの始め方・使い方
大体の図を書きました。こちらをざっくり理解するのが本記事のゴールです。
1.GAを使う準備
1-1.Googleアカウントを作る
GAはGoogleアカウントがあれば無料で誰でも使える便利なツールです。
こちらからGAの管理画面にログインしておきましょう。
旧バージョンは「UA」、新バージョンは「GA4」と呼ばれますが、どちらもGoogle Analyticsのことです。現在はデフォルトでGA4を使います。
1-2.GAプロパティを作る
「管理＞プロパティを作成」から新規プロパティを作成します。プロパティを作成したら「管理＞データストリーム」から、アクセス解析したいサイトのURLを入力します。
「測定ID」(「G-○○○」という形式)を得ることができるので、控えておきましょう。
サイトが複数ある場合、代表で１つ選んでデータストリームに入力します。
2.WebサイトにGAを設置する
2-1.Google Tag Manager(GTM)アカウントを作る
GTMは誰でも無料で使えるタグマネジメントツールです。GAに限らず、何かしらサイトにタグを設置したい場合は、GTMさえあればいちいちHTMLを編集しなくて良くなるのでかなり効率的です！GAプロパティの差し替えなども開発不要でできるようになります。
こちらからGTMアカウント作成、コンテナを作成しておきましょう。基本的に1サイト＝1コンテナと考えておけば大丈夫です。
2-2.GTMのタグをWebサイトに埋めこむ
開発が必要なのは基本的にここだけです！エンジニアが依頼される「GA使えるようにしといて」は主にこの工程のことを指します。
コンテナを作成した際に発行されるGTMのタグを「head直下」と「body直下」に書き込みます。サイト全体でタグが表示されるようにしましょう。これでGTMが使えるようになり、GAを使う準備が整いました。
2-3.GTMでGAを設定する
「新しいタグを追加＞タグの設定＞Googleアナリティクス：G4設定」を選択します。測定IDを入力する欄があるので1-2で獲得した測定IDを入力、トリガーに「All Pages」を選択します。
これでGTMを設置したサイト全体にGAを適用することができました。
3.アクセス解析を行う
3-1.GAダッシュボードを使う
GA上で各ページのビュー数やイベントを見てみましょう。ほぼリアルタイムに数値が表示されるのでいつでもサイトの状態を確認することができます。
「イベントを作成」から独自にイベントを細かく設定することもできますので、色々試してみると面白いですよ！イベントを新しく設定する際にはGTMのプレビューモードできちんと発火しているかを確認しましょう。
3-2.スプレッドシートにデータ抽出する
GAで取得したデータを定期的にレポートにまとめたい等の需要がある場合はスプレッドシートとの連携がおすすめです。GAを使っているGoogleアカウントでスプレッドシートを開き、「アドオン＞アドオンを取得＞Google Analytics」を選択することで簡単に連携できます。
少し癖があるので直感で使うのではなくマニュアル等を読んだ方が良いです。
3-3.計測ツールのメンテナンス
長くGAを運用しているとサイトやタグの種類が膨大になって整理に一苦労なんてこともあります。二重計測など、想定していないデータが入ってこないようにGTMやGAの見直しは定期的に行いましょう。
タグの整理に便利なChrome拡張「Tag Assistant」がおすすめなので、GA導入した際には使ってみてください。
まとめ
いかがでしたでしょうか？GAのことがざっくりでも伝われば幸いです。
冒頭にも述べた通り、アクセス解析はプログラマーの主たる業務ではないかもしれませんが、分析から開発まで一貫して経験するとリリースの喜びもひとしおです。使い込めば使い込むほど複雑化していくGA、何かあったときにサポートできるかっこいいエンジニアでありたいものです。
明日
明日は@ayumikさんの投稿です！お楽しみに！