入力フォームの離脱を項目ごとに調べる方法

OKAERI 編集部

入力フォームの離脱率が高いとわかっても、直す場所を決めるには「どの項目でやめているか」まで知る必要があります。ところが、GA4 の標準のレポートでわかるのは、ページ単位の数字と、フォームの入力開始や送信のおおまかな回数までです。項目ごとの数字は、そのままでは出てきません。

項目ごとの離脱を調べる方法は、大きく分けて2つあります。

この記事では、GA4 で項目ごとの離脱を計測する手順を、設定の順番どおりに紹介します。そのうえで、ツールを使う場合と比べて、どちらが向いているかを整理します。項目ごとの数字をどの順番で読めばよいかは、フォーム分析で最初に見る5つの数字で解説しています。

GA4 の標準機能でわかること・わからないこと

GA4 には、フォームの操作を自動で計測する機能があります。管理画面の「データストリーム」で拡張計測機能をオンにし、その中の「フォームの操作」を有効にすると、次の2つのイベントが記録されます。

イベント記録されるタイミング一緒に記録される主な情報
form_startそのセッションで、初めてフォームを操作したときフォームの ID・名前、送信先の URL
form_submitフォームを送信したとき同上

これで、フォームの入力を始めた人と送信した人のおおまかな数はわかります。ただし、次の2点には注意が必要です。

項目ごとの離脱を見るには、項目の操作を自分でイベントとして送る必要があります。ここからは、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つを作ります。

  1. 変数:「変数」→「新規」→「データレイヤーの変数」で、form_field_name・form_field_position・form_field_time_ms の3つを作る
  2. トリガー:「トリガー」→「新規」→「カスタム イベント」で、イベント名に form_field_leave を入れる
  3. タグ:「タグ」→「新規」→「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 の計測は無料で作れますが、作ったあとにも手間がかかります。よくつまずく点を挙げます。

フォーム分析ツールを使う場合

設定や保守の手間をかけたくない場合は、フォーム分析ツールを使う方法があります。タグを設置すれば、項目ごとの数字が表にまとまった状態で見られます。

私たち OKAERI も、無料のフォーム分析を提供しています。タグを1行貼るだけで、入力開始率・送信率と、項目ごとの到達率・離脱率・入力時間(中央値)を、PC とスマホに分けて確認できます。項目名は画面に表示されている項目名で並び、計測するのは項目に触れた順番と時間だけで、入力された内容は送信しません。なお、別のドメインから iframe で読み込んでいるフォームは計測の対象外です。

どちらを選ぶか

GA4+GTM で自分で計測フォーム分析ツール
費用無料無料〜有料(ツールによる)
始めるまでの手間タグ・変数・トリガー・カスタム定義・探索レポートの設定タグの設置のみ
見られる数字自由に設計できる。最後にやめた項目の正確な数は BigQuery が必要ツールが用意した数字に限られる
入力時間平均までツールによっては中央値
保守フォームを直すたびに確認が必要ツール側が対応

GA4 の扱いに慣れていて、ほかのアクセス解析のデータと組み合わせて分析したい場合は、自分で計測する方法が向いています。まずは手早く項目ごとの数字を見て、どこを直すかを決めたい場合は、ツールから始めるのが近道です。

まとめ

項目ごとの数字が取れたら、どの順番で読み、どこから直すかはフォーム分析で最初に見る5つの数字を参考にしてください。直しても残る、入力の途中で離れた人への連絡については、フォーム離脱の対策は3段階に分けて考えるで整理しています。