Google Analyticsでの申込みフォーム改善

Google Analyticsを使ったフォーム改善について色々考えたので、まとめたいと思います。

申込みフォーム改善(EFO)というと、専用のツールもあるかと思いますが、GAでできたら分析の幅も広がるし、いいなぁと思っていました。
様々な本を読んでみると、できそうなことは分かったのですが、正直プログラムが分からない著者は実装方法が分かりませんでした。。。
で、いろいろ試してみたらようやく取得できているようなので、備忘録を兼ねてメモッておきます。

概要

バーチャルページビューを使って入力フォームにカーソルを合わせたタイミングとカーソルが離れたタイミングで数値をカウントします。

カーソルを合わせたタイミング→入力開始数
カーソルが離れたタイミング→入力完了数

と定義して、その差やナビゲーションサマリー、滞在時間などを確認することで、ユーザーがつまづくポイントを特定(仮説立て)しようというものです。

フォームにフォーカスした数を把握する

こんな形でonFocusを用いて、数値を取得します。
カーソルを合わせたタイミングで /form/name/start.html というページが1カウントされます。

<input type="text" name="example1" onFocus="javascript:_gaq.push(['_trackPageview', '/form/name/start.html']);">

フォームからカーソルが離れた数を把握する

今度はonblurを用いて、数値を取得します。
カーソルが離れたタイミングで /form/name/finish.html というページが1カウントされます。

<input type="text" name="example1" onBlur="javascript:_gaq.push(['_trackPageview', '/form/name/finish.html']);">

2つを一緒に記述する

それぞれの項目について、カーソルがフォーカスした数と離れた数を把握する必要があるため、上記2つのソースをがっちゃんこします。

<input type="text" name="example1" onFocus="javascript:_gaq.push(['_trackPageview', '/form/name/start.html']);"  onBlur="javascript:_gaq.push(['_trackPageview', '/form/name/finish.html']);">

実際に数値を確認してみる

GA上ではこんな感じで表示されます。(数値はダミーです)

これを見るとメールアドレス(mail)項目のstartとfinishの数に差があり、離脱率も高く、滞在時間も長くなっており、ユーザーはメールアドレスの入力でつまづいている、という仮説が立てられます。

改善案を考える

メールアドレスの入力で離脱してるユーザーが多いため、この項目に対する改善を行い、その改善策の効果を検証します。

注意点

この方法を実施すると、カーソルがフォーカス、離れたときにPVがそれぞれカウントされるため、過去のデータと比較するとPV数が増えることが予想されます。
会社によっては総PVを定期的に報告することもあると思うので、これを回避するために新たなプロファイルを作成し、formに絞ってPV数をカウントすることをオススメします。

まとめ

というわけで、自分なりに考えてみたのですが、これが最善とは思っておらず、さらに質の高い分析手法もあるのかな、と思っています。
私も実際の案件で試してみつつ、もし、こういう手法もあるよって言う方がいらしたら、教えていただければ幸いです。