JamstackでのGA導入のコツ

JamstackでのGA導入のコツちょっと株式会社エンジニアかこなーる.s @kakona_ru

自己紹介 - かこなーる.s - chot inc. 所属 - Webフロントエンドエンジニア -
愛媛出身 → 静岡県在住　月1回程度東京に出没 - Astro.jsを最近は細々触っている - アーマード・コアの新作でソワソワしてるおじさん

- Google Analytics UAとGA4の違い - Jamstack案件におけるGA4設置の注意点 - 実際の案件で発生したトラブル - まとめ
目次

Google Analytics UAとGA4の違い

重要 * まず初めにGoogle Analytics UAは廃止されます！！ * 2023年7月1日にはヒット処理がされなくなります大人しく GA4
を使おう

GA4とUAの違い

計測軸の違い UA セッション(ページへの訪問)を軸に計測 GA4 ユーザーが取った行動(イベント)を軸に計測 ※注意点: 計測軸の違いにより計測値に大幅な違いが出る

プライバシー対策 UA 計測にCookieを利用している GA4 Cookieレス

Jamstack案件における GA4設置の注意点

開発に用いているアーキテクチャの特性を意識する SPAのような動作をする場合はルーティング時に GA4の計測のためのイベントを発火させるページビューのイベントが正常に計測出来ない場合がある Next.js, Nuxt.js, React.js, Vue.js

GTMのPreview機能を使って開発する必ずGTMのPreview機能を使いイベントトリガーの発火を確認をしましょう。

実際の案件で発生した問題

GA4とUAを併用しているサイトで PVが乖離する問題クライアント様側でUAとGA4を設定して使っていただいていたが、PV数の乖離があった原因計測方法が違うため、正常に設置されていても計測内容に違いが出るクライアント様側でその認識がなかった

再発防止認識の違いによるトラブルなどを避けるために、 UAとGA4で計測方法の違いによる集計数の乖離があるなどを事前に説明しておきましょう。

問題クライアント様側で独自のカスタムイベントトリガーを設定したが発火が正常にされなかった解決クライアント様側で追加したカスタムイベントトリガーが公開されていなかったため公開してもらった GTMのイベントが発火しない問題

再発防止 GTMの状態を把握しないと解決が難しい場合もあるため、可能であればGTMの編集権限などを事前にもらっておきましょう。

まとめ

GA4とGTMの設置をするために双方の使い方や特性も知っておくと安心

shima-kou