ヒートマップ

アテンション・ヒートマップ

前回は訪問者がどこまでスクロールしているのかを可視化するスクロール・ヒートマップについて紹介しました。

今回は、見た目はスクロール・ヒートマップに似ていますが、訪問者の興味を可視化するアテンション・ヒートマップを紹介します。

アテンション・ヒートマップとは

アテンション・ヒートマップは、スクロール・ヒートマップに似ていますが、可視化している指標が違います。

スクロール・ヒートマップでは、スクロールのあった割合で色が変わっていきましたが、アテンション・ヒートマップでは、その名の通り注目があった割合で色が青→赤と変わります。どのくらい注目があったのか、というのは、「エンゲージメント」によって判断されます。 「エンゲージメント」とは、どのくらいの間マウスがその場所にいたのかに加えて、クリックやマウスの動き、スクロール等の行動があった時間です。 その場にマウスがいた時間だけでなく、行動の有無も指標に加えることで、精度を高めています。

また、スクロール・ヒートマップと同じ様に、ヒートマップ上にマウスカーソルを置くと、そのエリアのライン・アナリティクスが表示され、細かい情報を見ることができます。

さて、アテンション・ヒートマップではどのような分析ができるでしょうか?

アテンション・ヒートマップを使った分析

アテンション・ヒートマップがより有効なのは、スクロール・ヒートマップと同じく、縦に長いページです。

ページの中で注目が集まるのには、二つ理由があります。

一つは、そこが注目の集まりやすいエリアの場合です。例えば、ページのファーストビューは全訪問者が表示するので、注目が集まりやすいですよね。

二つ目は、そこに何か魅力的なコンテンツがある場合です。 魅力的なコンテンツがあれば、クリックなどの行動も起きやすく、そのエリアの滞在時間も増え、エンゲージメントは高くなります。 位置的に注目が集まりやすい場所であれば、重要なコンテンツをその位置に配置することでさらに注目が集まります。

コンテンツが魅力的なものであった場合であれば、ページを改善する際に注目を集めたコンテンツと類似した表現やレイアウト、ビジュアルを使用することで注目を集められる可能性が高まります。

また、長いページを少し短くしたいといったときに、このアテンション・ヒートマップならどこに注目が集まっていて、どこが注目されていないかわかるのでその判断に使うことが出来ます。

今回はアテンション・ヒートマップについてご紹介しましたが、アテンション・ヒートマップの活用法は今回ご紹介した以外にもまだまだあります。 他のヒートマップと組み合わせて分析することで、また違った知見を得ることもできるので、また別の機会にヒートマップを組み合わせた分析についてお伝えします。

ピックアップ記事

  1. 最速で理解したい人のためのIT用語集

関連記事

  1. ヒートマップ

    ユーザビリティの検証で気を付けたいこと、やってはいけないこと②

    ユーザビリティ検証の注意点と禁止事項について、前回の続きからご紹介しま…

  2. ヒートマップ

    【Tips】ヒートマップ機能について①~クリック・スクロール編~

    今回はMouseflowのメイン機能であるヒートマップについて、改めて…

  3. ヒートマップ

    Mouseflowアップデート情報 @2019/6/6

    Mouseflowの機能がアップデートされました!今回のアップデート…

  4. Mouseflow

    Mouseflowで問題解決① -事例ベースで機能紹介-

    Mouseflowで問題解決 -エクスチュアのツール紹介-webサイト…

  5. ヒートマップ

    ヒートマップを画像としてキャプチャする

    前回は、Mouseflowで行った分析結果の作成に便利なレコーディング…

  6. ヒートマップ

    ユーザビリティの検証で気を付けたいこと、やってはいけないこと③

    ユーザビリティ検証の注意点と禁止事項について、前回の続きからご紹介しま…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. Snowflake の Copilot が優秀すぎる件につい…
  2. Snowflake の新しいData Clean Roomの…
  3. 【GA4/GTM】dataLayerを使ってカスタムイベント…
  4. KARTE を使ってサイト外でも接客を
  5. 【GA4/GTM】dataLayerを活用しよう
  1. IT用語集

    アドイン(Add In)・アドオン(Add On)って何?
  2. Tableau

    【図解】Tableau Desktop 2020.2の新機能をはじめから丁寧に(…
  3. Google Cloud Platform

    Vertex AIのベクトル検索によってブログの検索エンジンを作成してみた
  4. Adobe Experience Cloud

    Adobe Target: at.jsの「チラつき」を手っ取り早く回避する
  5. Tableau

    Tableauとは
PAGE TOP