入力フォームの離脱率が高いとわかっても、直す場所を決めるには「どの項目でやめているか」まで知る必要があります。ところが、GA4 の標準のレポートでわかるのは、ページ単位の数字と、フォームの入力開始や送信のおおまかな回数までです。項目ごとの数字は、そのままでは出てきません。
項目ごとの離脱を調べる方法は、大きく分けて2つあります。
- GA4 と Google タグマネージャーで、自分で計測する:費用はかからず、自由に作り込める。その代わり、設定と保守に手間がかかる
- フォーム分析ツールを使う:タグを設置すれば、項目ごとの数字が表にまとまった状態で見られる。その代わり、見られる数字はツールが用意したものに限られる
この記事では、GA4 で項目ごとの離脱を計測する手順を、設定の順番どおりに紹介します。そのうえで、ツールを使う場合と比べて、どちらが向いているかを整理します。項目ごとの数字をどの順番で読めばよいかは、フォーム分析で最初に見る5つの数字で解説しています。
GA4 の標準機能でわかること・わからないこと
GA4 には、フォームの操作を自動で計測する機能があります。管理画面の「データストリーム」で拡張計測機能をオンにし、その中の「フォームの操作」を有効にすると、次の2つのイベントが記録されます。
| イベント | 記録されるタイミング | 一緒に記録される主な情報 |
|---|---|---|
form_start | そのセッションで、初めてフォームを操作したとき | フォームの ID・名前、送信先の URL |
form_submit | フォームを送信したとき | 同上 |
これで、フォームの入力を始めた人と送信した人のおおまかな数はわかります。ただし、次の2点には注意が必要です。
- 送信を取りこぼすことがある:JavaScript で送信するフォームや、送信後にページが切り替わらないフォームでは、
form_submitが記録されないことがあります。送信の数は、完了ページ(サンクスページ)の表示回数で数える方が確実です - 項目ごとの数字は出ない:どの項目まで進んだか、どの項目でやめたか、何秒かかったかは、標準の機能では記録されません
項目ごとの離脱を見るには、項目の操作を自分でイベントとして送る必要があります。ここからは、Google タグマネージャー(以下、GTM)を使って送る手順を紹介します。
GA4+GTM で項目ごとの離脱を計測する手順
GTM と GA4 がすでにサイトに設置されている前提で、5つの手順で進めます。
1. 何を送るかを決める
最初に、どの操作を、どんな名前で送るかを決めます。この記事では、入力欄から離れたときに、次の3つを送ります。
| 送る情報 | 中身 | 使い道 |
|---|---|---|
| 項目名 | 入力欄の name 属性(例:zip、email) | 項目ごとに集計する |
| 項目の順番 | フォームの中で何番目の欄か | 項目を入力の順に並べる |
| 入力時間 | 入力欄に入ってから離れるまでの時間(ミリ秒) | 手が止まっている項目を探す |
ここで大切なのは、入力された値は送らないことです。GA4 は、氏名やメールアドレス、電話番号など、個人を特定できる情報の送信を利用規約で禁止しています。送るのは「どの欄に触れたか」と「時間」だけにします。
2. GTM で入力欄の操作を拾う
GTM の標準のトリガーには、「入力欄から離れた」ことを拾うものがありません。そこで、小さなスクリプトをカスタム HTML タグとして設置し、入力欄から離れたときにデータレイヤーへ情報を送ります。
GTM で「タグ」→「新規」→「カスタム HTML」を選び、次のコードを貼ります。
<script>
(function () {
var startedAt = {};
document.addEventListener("focusin", function (e) {
var el = e.target;
if (!el.form || !el.name) return;
startedAt[el.name] = Date.now();
});
document.addEventListener("focusout", function (e) {
var el = e.target;
if (!el.form || !el.name) return;
var fields = Array.prototype.filter.call(el.form.elements, function (f) {
return f.name;
});
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: "form_field_leave",
form_field_name: el.name,
form_field_position: fields.indexOf(el) + 1,
form_field_time_ms: startedAt[el.name] ? Date.now() - startedAt[el.name] : 0
});
});
})();
</script>
トリガーは「DOM Ready」を選び、条件にフォームのあるページの URL を指定します。すべてのページで動かす必要はありません。
このコードは、入力欄の name と順番、かかった時間だけを送り、入力された値には触れません。
3. GA4 へイベントを送るタグを作る
データレイヤーに送った情報を、GA4 へイベントとして送ります。GTM で次の3つを作ります。
- 変数:「変数」→「新規」→「データレイヤーの変数」で、
form_field_name・form_field_position・form_field_time_msの3つを作る - トリガー:「トリガー」→「新規」→「カスタム イベント」で、イベント名に
form_field_leaveを入れる - タグ:「タグ」→「新規」→「Google アナリティクス: GA4 イベント」を選び、イベント名を
form_field_leaveにする。イベント パラメータにfield_name・field_position・field_time_msを追加し、それぞれ1で作った変数を入れる。トリガーは2のものを指定する
設定したら、GTM のプレビューで実際にフォームを操作し、GA4 の「DebugView」に form_field_leave が届いているかを確認してから公開します。
4. GA4 にカスタムディメンションを登録する
GA4 では、イベントと一緒に送った情報を、そのままではレポートに使えません。GA4 の管理画面の「カスタム定義」から、次のように登録します。
| 名前 | 種類 | 範囲 |
|---|---|---|
field_name | カスタムディメンション | イベント |
field_position | カスタムディメンション | イベント |
field_time_ms | カスタム指標(単位はミリ秒) | イベント |
登録より前に届いたデータには、さかのぼって反映されません。GTM のタグを公開したら、なるべく早く登録しておきます。反映まで1〜2日かかることがあります。
5. 探索レポートで集計する
データがたまったら、GA4 の「探索」で集計します。見たい数字ごとに、使うレポートが変わります。
到達率は「自由形式」で見ます。 行に field_position と field_name、値に「総ユーザー数」を置き、フィルタでイベント名を form_field_leave に絞ります。項目ごとの人数を、入力を始めた人数(form_start のユーザー数)で割ったものが到達率です。列に「デバイス カテゴリ」を置けば、PC とスマホに分けて見られます。
離脱は「ファネル データ探索」で見ます。 入力の始まり(form_start)、主な項目の form_field_leave、完了ページの表示を順にステップとして並べると、ステップごとに次へ進まなかった人の割合が表示されます。ステップは10個までなので、項目が多いフォームでは主な項目に絞ります。任意の項目はステップに入れないでください。入力しなかった人が、そこで離脱したように見えてしまいます。
入力時間は平均までしか出せません。 カスタム指標の field_time_ms をイベント数で割ると、項目ごとの平均の入力時間になります。ただし GA4 の探索では中央値が出せないため、入力の途中で別のタブを見に行った人がいると平均が大きく伸びます。数字は目安として扱い、項目の間で比べる使い方にとどめます。
なお、「どの項目を最後に入力をやめたか」を1人ずつ正確に数えるのは、GA4 の画面だけでは難しく、BigQuery へデータを書き出して集計する必要があります。ファネル データ探索の数字は、その近似と考えてください。
自分で計測するときの注意点
GA4+GTM の計測は無料で作れますが、作ったあとにも手間がかかります。よくつまずく点を挙げます。
- 項目名が分かりにくい:
name属性はcustomer[address1]のような機械向けの名前になっていることが多く、レポートを読む前に画面の項目名との対応表が要ります - フォームを直すと集計が途切れる:項目の追加や
nameの変更をすると、変更の前後で数字がつながらなくなります。直した日を記録しておきます - PC とスマホでフォームが違うことがある:カートシステムによっては端末ごとに項目の構成が変わるため、必ずデバイス カテゴリで分けて見ます
- 人数が少ないと数字が出ないことがある:GA4 の設定によっては、少人数のデータがレポートで伏せられます(しきい値)。小さなフォームでは、期間を長く取って見ます
- 計測できない人がいる:Cookie の同意を求めるバナーで拒否した人などは、計測の対象から外れます
フォーム分析ツールを使う場合
設定や保守の手間をかけたくない場合は、フォーム分析ツールを使う方法があります。タグを設置すれば、項目ごとの数字が表にまとまった状態で見られます。
私たち OKAERI も、無料のフォーム分析を提供しています。タグを1行貼るだけで、入力開始率・送信率と、項目ごとの到達率・離脱率・入力時間(中央値)を、PC とスマホに分けて確認できます。項目名は画面に表示されている項目名で並び、計測するのは項目に触れた順番と時間だけで、入力された内容は送信しません。なお、別のドメインから iframe で読み込んでいるフォームは計測の対象外です。
どちらを選ぶか
| GA4+GTM で自分で計測 | フォーム分析ツール | |
|---|---|---|
| 費用 | 無料 | 無料〜有料(ツールによる) |
| 始めるまでの手間 | タグ・変数・トリガー・カスタム定義・探索レポートの設定 | タグの設置のみ |
| 見られる数字 | 自由に設計できる。最後にやめた項目の正確な数は BigQuery が必要 | ツールが用意した数字に限られる |
| 入力時間 | 平均まで | ツールによっては中央値 |
| 保守 | フォームを直すたびに確認が必要 | ツール側が対応 |
GA4 の扱いに慣れていて、ほかのアクセス解析のデータと組み合わせて分析したい場合は、自分で計測する方法が向いています。まずは手早く項目ごとの数字を見て、どこを直すかを決めたい場合は、ツールから始めるのが近道です。
まとめ
- GA4 の標準機能(拡張計測機能の「フォームの操作」)でわかるのは、フォームの入力開始と送信のおおまかな数まで。項目ごとの数字は出ない
- 項目ごとの離脱を GA4 で見るには、GTM で入力欄の操作をイベントとして送り、カスタムディメンションを登録して、探索レポートで集計する
- 送るのは項目名・順番・時間だけ。入力された値は送らない
- 到達率は自由形式、離脱はファネル データ探索で見る。入力時間は平均までで、最後にやめた項目の正確な数には BigQuery が必要
- 設定と保守の手間をかけたくない場合は、フォーム分析ツールで項目ごとの数字を確認できる
項目ごとの数字が取れたら、どの順番で読み、どこから直すかはフォーム分析で最初に見る5つの数字を参考にしてください。直しても残る、入力の途中で離れた人への連絡については、フォーム離脱の対策は3段階に分けて考えるで整理しています。