ランディングページのスクロール量をGoogleアナリティクスで計測できるjQuery [Scroll Depth]

020

今回は、WebページがどのぐらいスクロールされたかをGoogleアナリティクスで計測できるjQueryプラグイン [Scroll Depth] をご紹介します。
リスティング広告用のランディングページなどでは改善ポイントを見つけるきっかけにもなりますので、かなり重宝すると思います。

スポンサーリンク
レクタングル(大)

設定方法

1.ソースのダウンロード

Scroll Depth の公式サイトよりソースをダウンロードします。
http://scrolldepth.parsnip.io/
※ページ内の「Download(1.8kb)」をクリックするとソースが表示されます

ScrollDepth

2.ダウンロードしたソースをサーバーへアップロードする

上記1でダウンロードしたソースを自分のサーバーへアップロードします。
デフォルトのファイル名でダウンロードした場合は「jquery.scrolldepth.min.js」というファイル名になっていると思います。

3.ページ内に計測タグを挿入する

計測するページの <head> ~ </head> に上記でアップロードしたファイルを読み込むためのタグを挿入します。

<script type="text/javascript" src="●●/jquery.scrolldepth.min.js"></script>

4.jQueryをダウンロードしてサーバーへアップロードする

jQueryダウンロードサイト(英語)からソースをダウンロードし、サーバーの任意のディレクトリへアップロードします。アップロードが完了したら下記のタグを <head> ~ </head> に挿入します。

<script type="text/javascript" src="●●/jquery-●●●.min.js"></script>

以上で設置作業は完了です。

計測データの確認方法

ここまでの作業が完了したら、Googleアナリティクスで計測データを確認することができます。

Googleアナリティクスにログインする

左サイドバーメニューの 「行動」>「イベント」>「サマリー」 を開きます。

次に 「イベントラベル」 をクリックすると、ページスクロール量が、25%単位で表示されます。

それぞれのラベルの意味は、

  • Baseline:ほとんどスクロールされなかった回数
  • 25%~75%:そこまでスクロールされた回数
  • 100%:ページ最下段までスクロールされた回数

を示しています。
※オプション設定で、デフォルトのパーセントだけでなく、読み込まれたページの高さを記録することもできます

02なお、このデータの解釈には少し工夫が必要です。

例えば、上記では50%の合計イベント数が18回ですが、これはページを50%以上スクロールされた回数の合計数になります。
ですので、もし個別に50%で離脱された回数を知りたい場合
「50%の合計イベント数(18回)」-「75%の合計イベント数(16回)」=2回
ということになります。

まとめ

リスティング広告のランディングページでは、1ページで完結するページ構成の場合もあるかと思います。
外部へのリンクが少ない場合は、必然的に直帰率が高まることになり、Googleアナリティクスで分析するデータもなかなか正確なデータを集めることが難しいと思います。

このScroll Depthでは、そういった場合でもユーザーの行動分析に必要なデータを確認することができますので、リスティング広告の運用をされている方には特にオススメかと思います。

スポンサーリンク
レクタングル(大)
レクタングル(大)
LINEスタンプ
LINEスタンプ販売中です

ゆれる白いトリ

キノカッパ

日常トークに使えるスタンプも販売中⇒LINE公式ストアへ