データ分析

GA4でスクロール率を計測する方法│GTMのタグ設定方法・拡張計測機能を解説

    自身のWEBページがどれほどスクロールされているのか計測することにより、ページのボトルネックを特定し改善施策を進めることができます。 しかしGA4とGTM、2つの専門的なツールを用いなければならないので、どのように設定すればよいのかお悩みの方もいらっしゃるかもしれません。 そこで今回は、GTMのイベントタグ設定を用いて、GA4でページのスクロール率を詳細に計測する方法をわかりやすく解説します。

    free web hopeでは、WEBマーケティングの多岐にわたる分野で支援を提供しております。

    「GA4でどのようにデータ計測をすればよいのかわからない」「データをどのように活用するのかわからない」「社内でリソースが不足しておりPDCAを回す余裕がない」

    このようなお悩みをお持ちのご担当者様は、お気軽にコーポレートサイトもしくは左下のコンタクトフォームからお問い合わせください。

    この記事で分かること

    • GA4のスクロール率の定義
    • GA4の拡張機能イベントを用いてスクロール率の計測をする方法
    • GTMでイベントタグ設定を行い、GA4でより詳細なスクロール率を計測する方法

    GA4のスクロール率とは

    GA4に関してはこちらのページをご覧ください。:GA4 (Google Analytics 4)とは?設定方法からUAとの違いまで詳しく解説!|株式会社free web hope

    GA4のスクロール率(Scroll)は、ユーザーがページをどれほどの深さまでスクロールしたのかを計測する指標です。

    スクロール率を計測するメリットは、「ユーザーがページ内のどのコンテンツで離脱しているか」を計測し、ページ改善のための仮説を立てることができる点です。

    たとえば、ページ内のスクロール率10%に該当するコンテンツAでスクロール率の指標が大きく減少していた場合、コンテンツAの内容・デザインを修正することで、ユーザーのページ滞在時間を延ばすことにつながるかもしれません。

    以上のようにスクロール率を計測することで、ページのボトルネックを特定し改善に役立てることができます。

    GA4でスクロール率を計測する方法①:拡張機能イベント

    それでは実際に、GA4を用いてスクロール率を計測する方法を説明します。

    この方法ではGA4の拡張機能イベントを用いて計測します。このイベントは「ページの90%までスクロールしたとき」に測定されます。

    GA4の拡張機能イベントとは

    GA4の拡張機能イベントとは、デフォルトで収集するイベント(自動収集イベント)にさらに付け加えた情報を計測できるようになる機能です。

    主に計測できるイベントは以下のようなものがあります。

    拡張機能イベントの例

    1. スクロール
    2. サイト内検索
    3. 外部リンクのクリック
    4. ファイルダウンロード

    これらの拡張機能イベントはGA4の管理画面から簡単に実装することができます。次の章では拡張機能イベントの実装方法を解説します。

    拡張機能イベントの実装方法

    それでは、実際にGA4で拡張機能イベントを実装する方法を解説していきます。

    Step1:GA4にログインし、左のサイドバーから「管理」を選択します。

    ※GA4のアカウント設定が完了していない方は、こちらのページをご確認ください。:GA4 (Google Analytics 4)とは?設定方法からUAとの違いまで詳しく解説!|株式会社free web hope

    Step2:「データストリーム」を選択し、対象のウェブデータストリームをクリックします。

    Steo3:「拡張機能」の右のバーをオンにすると、計測が開始されます。歯車マークをクリックし「スクロール数」を選び実装します。

    Step4:設定したイベントは左のサイドバーから「レポート」→「エンゲージメント」→「イベント」の「scroll」で確認することができます。

    しかし、この方法では「ページの下部90%までスクロールした」場合にしか計測されません。

    もしページの20%、40%、60%...までのスクロール率とさらに細かくして計測をしたい場合は、GTM(Googleタグマネージャー)のイベントタグ実装をして計測の設定をする必要があります。

    GA4でスクロール率を計測する方法②:GTMでGA4のイベントタグ設定を行う

    続いて、GTMで「GA4イベントタグの設定」を行い、GA4でより詳細なスクロール率を計測する設定を解説します。

    GTMに関して、「タグ」など基本的な用語解説や実装方法はこちらを参考にしてください。:

    【初心者向け】GTM(Google タグマネージャー)とは?設定からGA4との連携方法まで詳しく解説!|株式会社free web hope

    また、GA4とGTMがあらかじめ連携されていることを前提としています。まだ連携がお済ではない方はこちらのページを参照してください。:

    【初心者必見】GTMでGA4の設定・イベント実装方法を画像付きで解説|株式会社free web hope

    GTMのタグ設定でGA4のスクロール率計測の設定をするメリット

    GA4の「拡張機能イベント」ではページの下部90%までスクロールした場合にしか計測がされませんでした。

    しかし、GTMのタグを設定し、GA4でスクロール率計測の設定を行うことで、「ページの20%、40%、60%...までスクロールした場合」というように自身でスクロール深度の設定を行うことができます。

    これにより、より詳細にページの解析を行うことができ、ボトルネックの特定が容易になります。またノーコードでタグを実装できるため、初心者の方でも簡単に計測を開始することができます。

    GTMのタグ設定でGA4のスクロール率計測を設定する方法

    ※あらかじめGA4とGTMが連携してあることが前提です。まだ連携がお済ではない方はこちらのページを参照してください。:

    【初心者必見】GTMでGA4の設定・イベント実装方法を画像付きで解説|株式会社free web hope

    GA4の操作

    GTM側で設定を開始する前に、事前にGA4の測定IDを用意しておく必要があります。

    Step1:GA4にアクセスし、左のサイドバーから「管理」を選択します。

    Step2:「データストリーム」を選択し、対象のウェブデータストリームを選択します。


    Step3:表示される「測定ID」をコピーします。

    ※今回はGA4のデモアカウントを使用しています

    GTMの操作

    トリガー設定

    step1:GTMにログインし、ワークスペースから「変数」を選択し、右上にある設定ボタンをクリックする


    step2:スクロールの「Scroll Depth Threshold」「Scroll Depth Units」「Scroll Direction」の3つにチェックを入れる

    各組み込み変数の意味※組み込み変数:GTMがデフォルトで用意している変数

    • Scroll Depth Threshold:トリガー発火につながったスクロール距離の数値
    • Scroll Depth Units: トリガー発動のしきい値の指定に使用されている単位
    • Scroll Direction:トリガー発火につながったスクロールの方向(縦方向または横方向)

    参考:スクロール距離トリガー - タグ マネージャー ヘルプ (google.com)

    step3:左のサイドバーから「トリガー」を選択し、「新規」をクリック

    step4:トリガーの設定から、「スクロール距離」を選択

    step5:「縦方向スクロールの距離」にチェックを入れ、計測したいページのスクロール率を記載していく※基本的にWEBページは縦方向に読まれるので、「縦方向スクロールの距離」を例に紹介します。

    「10,20,30」の様に記載した場合10%ごとのスクロール率が、「20,40,60」の場合は20%ごとのスクロール率が計測できます。

    step6:トリガーの発生条件として「すべてのページ」か「一部のページ」のどちらかを選択し、名前をつけてトリガーを保存する

    • すべてのページ:サイト全てのページのスクロール率を計測する。
    • 一部のページ:指定したページのスクロール率を計測する。「Page URL」「等しい」を選択し、計測したいページのURLを入力する。

    タグ設定

    step7:左のサイドバーから「タグ」を選択し、「新規」ボタンから、スクロール率のタグを作成する

    step8:タグ設定の画面からトリガーをクリックし、先ほど作成した「スクロール率」のトリガーを選択する

    step9:「タグの設定」を選択し、「Google アナリティクス」→「Googleアナリティクス:GA4イベント」を選択する

    step10:タグの設定を行い、保存する

    タグの設定項目

    • タグの名前:ユーザーで設定。(例)スクロール率
    • 測定ID:先ほどコピーしたGA4の測定IDを入力する。
    • イベント名:ユーザーで設定。半角文字でデフォルトのイベント(Scroll)と区別できるような名前にする。(例)percent_scroll 
    • イベントパラメータ:「パラメータを追加」をクリックし、ユーザーで設定。半角文字でデフォルトのイベント(Scroll)と区別できるような名前にする。(例)percent_scroll 
    • :「Scroll Depth Threshold」を選択


    step11.作成したスクロール率のタグが発火してるか、プレビューモードを利用して確認してから公開する

    プレビューモードの詳しい使い方はこちらのページををご覧ください。:

    【初心者向け】GTM(Google タグマネージャー)とは?設定からGA4との連携方法まで詳しく解説!|株式会社free web hope 

    GTMで設定したスクロール率をGA4で確認する

    この章では、GTMで設定したスクロール率をGA4で確認する方法を解説します。

    GA4で確認する方法は2つあります。

    • GA4のレポートで確認する
    • GA4のカスタムディメンションを設定し、探索で確認する

    以上についてそれぞれ解説をしていきます。

    GTMで設定したスクロール率をGA4で確認する方法①:レポート

    先ほど設定したスクロール率は、拡張機能イベントと同様にGA4の「レポート」内の「エンゲージメント」→「イベント」で確認できます。

    しかし、デフォルトで設定されているディメンションだけでは自社サイトにおけるデータ分析やインサイト発見に限界がある場合があります。

    そこで、先ほどGTMで設定した「イベントパラメータ」をGA4の「カスタムディメンション」に設定することで、より詳細な情報を入手することができます。

    GTMで設定したスクロール率をGA4で確認する方法②:カスタムディメンションを設定し、探索レポートで確認

    より詳細な情報を入手するために、GA4でカスタムディメンションを設定し、探索レポートで確認する方法を解説をしていきます。

    カスタムディメンションとは

    ユーザーが独自に設定できるディメンションのことです。

    カスタムディメンションにより、より詳細かつ実態に即したデータセグメンテーションが可能となり、サイトパフォーマンスの分析精度が向上します。

    ※ディメンション:データの属性や特性を表すもので、探索レポート内でデータを分類・フィルタリングするために使用されます。

    (例)ユーザーの国、参照メディア(流入元のトラフィックの種類)

    カスタムディメンション設定方法

    step1. GA4の左のサイドバーから「設定」を開き、「カスタム定義」を選択

    step2. 「カスタムディメンションを作成」を選択



    step3.  先ほどGTMで設定したイベントパラメータを下記の箇所に反映していきます。

    カスタムディメンションの設定項目

    • ディメンション名:ユーザー自身で設定(例percent_scroll)
    • 範囲:「イベント」を選択
    • イベントパラメータ:先ほどGTMのタグ設定時に記入した「イベントパラメータ」を記入

    カスタムディメンションを探索レポートで確認する方法

    step1:左のサイドバーから「探索」を選択し、「空白」で新しいレポートを作成する

    Step2:変数の「ディメンション」をクリックする。上部のタブから「カスタム」を選択し、先ほど作成したディメンションをインポートする

    step3:先ほどインポートした変数のディメンションを「値」にドラッグ&ドロップする

    step4「指標」を選択し、「イベント数」をインポートする

    step5:先ほどインポートしたイベント数を「値」の対象部分にドラッグ&ドロップする

    また計測したデータをどのように分析し改善(LPO)に役立てるのかについては、こちらのページでポイントを解説をしております。

    CVRを改善する方法:【LPO】明日からできるCVR改善施策10選|株式会社free web hope (fwh.co.jp)

    GA4でランディングページを分析し改善する方法:【LPO必須】GA4でLP(ランディングページ)を分析する方法|株式会社free web hope (fwh.co.jp)

    まとめ

    このようにGTMでタグを設定することで、GA4でページのスクロール率を詳しく計測することができます。

    ユーザーの行動をより深く分析し、ページの改善施策を進めていくために、このスクロール率計測の設定を行うことがおすすめです。

    この記事では、スクロール率の計測方法を紹介しましたが、他にも「ページの読了率」「特定のボタンのクリック数」などページ改善に必要な指標も、GTMのタグ設定を行うことでGA4で測定を開始することができます。

    読了率:GTM(Googleタグマネージャー)で見出しごとの読了率を計測する方法|株式会社free web hope

    クリック数:GA4でクリックイベントを計測する方法│GTMのタグ設定方法・拡張計測機能を解説|株式会社free web hope

    Youtube動画:GA4でYoutube動画の計測を行う方法│GTMのイベントタグ設定方法も解説|株式会社free web hope


    free web hopeでは、WEBマーケティングの多岐にわたる分野で支援を提供しております。

    「GA4でどのようにデータ計測をすればよいのかわからない」「データをどのように活用するのかわからない」「社内でリソースが不足しておりPDCAを回す余裕がない」

    このようなお悩みをお持ちのご担当者様は、お気軽にコーポレートサイトもしくは左下のコンタクトフォームからお問い合わせください。

    またこちらは実際にGA4導入支援に成功した事例です。是非参考にしてください。:GA4(Google Analytics4)移行で見えるようになったCVに繋がる顧客の導線とは?|株式会社free web hope 


    Article

    関連記事

    お問い合わせはこちら

    Contact

    成果の出せるLPが欲しい、ABテストや広告運用、引き上げ施策、などのご相談はこちらから!

    お困りのこと

    複数選択可

    ビジネスモデル

    広告費について

    ご入力いただきましたメールアドレス宛てに自動配信メールが届いておりますのでご確認下さいませ。
    2~3営業日内に、担当よりメールにてご連絡を差し上げます。しばらくお待ちくださいますよう宜しくお願い致します。

    Step
    0103