フォーム計測の仕組みをつくる1(全体の流れと概要)
GA4はクリックやスクロールは自動で計測してくれるけど、
フォーム送信までは 自分で設定しないと何もわからないんですよね。
ということで、今回ちゃんと仕組みを作ってみました。
使ったのは GTM(Googleタグマネージャー)。
GA4だけではできない部分を、GTM経由でイベントとして送る感じです。
目次
まず、フォームの「どこ」を見たいのか?
フォームの動きって、大きく分けるとこんな感じになります。
- 入力が始まった(form_start)
- 送信が完了した(form_submit)
- エラーで止まった(form_error)
この3ステップを取ると、
「見たけど入力しなかった人」「入力したけど送信しなかった人」が見えてきます。
実際に設定してみた流れ(GA4 + GTM)
1. form_start(入力開始)
最初の入力欄にフォーカスされたら form_start イベントを発火。
GTMのトリガーで「要素のフォーカス」を選び、
セレクタで #form-id input:first-child を指定。
これで、「フォームを見ただけ」じゃなく「入力までいった人」がわかるようになります。
2. form_submit(送信完了)
フォーム送信後に
- サンクスページ(/thanks)がある場合 → ページビューで検知
- Ajax送信の場合 → 「送信完了メッセージ」が表示された瞬間を検知
どちらでもOK。
私は今回はサンクスページ型だったので、
URLに /thanks を含むページビューをトリガーにしました。
3. form_error(エラー)
.error-message みたいなエラー要素を監視して、
出てきたら form_error を送る設定にしておきました。
地味だけど、エラーで離脱してる人が多いときに気づけるのがありがたい。
4. GA4への連携
GTMから送った form_start / form_submit / form_error イベントを
GA4の[コンバージョン設定]で登録。
特に form_submit をコンバージョンに指定します。
5. ファネル探索で可視化
GA4の「探索 → ファネル探索」でform_start → form_submit → form_error
の順にステップを並べると、
どの段階で止まっているのかが一目でわかります。
実際にやってみてわかったこと
最初は「送信完了が取れればいいや」と思ってたんですが、
やってみると 入力開始(form_start)を取るのがめちゃくちゃ重要 でした。
1.「入力したけど送信してない人」が見える
たとえば100人がフォームを見て、
そのうち30人が入力を始めて、10人が送信したとします。
| ステップ | 数 | 到達率 |
|---|---|---|
| form_start | 30 | 100% |
| form_submit | 10 | 33% |
これを見て初めて、「そもそも入力されてない」のか「途中でやめてる」のかが分かる。
ここが感覚じゃなく“データで見える”のが大きいです。
2. アクセスの「質」がわかるようになる
form_start が少ないページは、
興味の薄い流入が多い可能性があります。
逆に form_start は多いのに form_submit が少ないページは、
フォームの使い勝手やエラーで離脱しているかもしれません。
3. 意欲の高いユーザーがどこから来てるか分かる
GA4のセグメントで「form_startを発火したセッション」を切り出すと、
「本気で検討してる人」がどこから来てるか見えます。
広告か、自然検索か、SNSか。
これは地味に嬉しい。
4. エラー率が思っていたより高かった
form_error も取ってみたら、
意外と「必須項目ミス」や「入力フォーマット違い」で止まってる人が多かったです。
ここを直すだけでも送信数が変わりそう。
まとめ
やってみて感じたのは、
フォーム計測=送信件数を見るだけじゃないということ。
「入力したけど送信しなかった人」や
「エラーで諦めた人」まで見えると、
改善のヒントがちゃんとデータで掴めるようになります。
次は GTMとGA4の設定をまとめます。
今回は以上です!