Slide 1
Slide 1 text
JamstackでのGA導入のコツ
ちょっと株式会社 エンジニア かこなーる.s @kakona_ru
Slide 2
Slide 2 text
自己紹介
- かこなーる.s
- chot inc. 所属
- Webフロントエンドエンジニア
- 愛媛出身 → 静岡県在住 月1回程度東京に出没
- Astro.jsを最近は細々触っている
- アーマード・コアの新作でソワソワしてるおじさん
Slide 3
Slide 3 text
- Google Analytics UAとGA4の違い
- Jamstack案件におけるGA4設置の注意点
- 実際の案件で発生したトラブル
- まとめ
目次
Slide 4
Slide 4 text
Google Analytics
UAとGA4の違い
Slide 5
Slide 5 text
重要
* まず初めにGoogle Analytics UAは廃止されます！！ *
2023年7月1日
にはヒット処理がされなくなります
大人しく GA4 を使おう
Slide 6
Slide 6 text
GA4とUAの違い
Slide 7
Slide 7 text
計測軸の違い
UA
セッション(ページへの訪問)を軸に計測
GA4
ユーザーが取った行動(イベント)を軸に計測
※注意点: 計測軸の違いにより計測値に大幅な違いが出る
Slide 8
Slide 8 text
プライバシー対策
UA
計測にCookieを利用している
GA4
Cookieレス
Slide 9
Slide 9 text
Jamstack案件における
GA4設置の注意点
Slide 10
Slide 10 text
開発に用いているアーキテクチャの
特性を意識する
SPAのような動作をする場合はルーティング時に
GA4の計測のためのイベントを発火させる
ページビューのイベントが正常に計測出来ない場合がある
Next.js, Nuxt.js, React.js, Vue.js
Slide 11
Slide 11 text
GTMのPreview機能を使って開発する
必ずGTMのPreview機能
を使いイベントトリガーの発
火を確認をしましょう。
Slide 12
Slide 12 text
実際の案件で
発生した問題
Slide 13
Slide 13 text
GA4とUAを併用しているサイトで
PVが乖離する
問題
クライアント様側でUAとGA4を設定して使っていただいていた
が、PV数の乖離があった
原因
計測方法が違うため、正常に設置されていても計測内容に違
いが出るクライアント様側でその認識がなかった
Slide 14
Slide 14 text
再発防止
認識の違いによるトラブルなどを避けるために、
UAとGA4で計測方法の違いによる集計数の乖離があるなど
を事前に説明しておきましょう。
Slide 15
Slide 15 text
問題
クライアント様側で独自のカスタムイベントトリガーを設定した
が発火が正常にされなかった
解決
クライアント様側で追加したカスタムイベントトリガーが公開さ
れていなかったため公開してもらった
GTMのイベントが発火しない問題
Slide 16
Slide 16 text
再発防止
GTMの状態を把握しないと解決が難しい場合もあるため、可
能であればGTMの編集権限などを事前にもらっておきましょ
う。
Slide 17
Slide 17 text
まとめ
Slide 18
Slide 18 text
GA4とGTMの設置をするために
双方の使い方や特性も
知っておくと安心