ヒートマップ

ムーブメント・ヒートマップ

以前の記事で、ページの全体的な傾向を掴むには、レコーディングを一つ一つ見るよりもヒートマップの方が適していると述べました。

前回のクリック・ヒートマップに続いて、今回はMouseflowのムーブメント・ヒートマップについてご紹介します。

ムーブメント・ヒートマップでは、ページのそれぞれの部分でのマウスカーソルの滞在時間を色付けして表示します。 マウスが滞在した時間が長いほど、その部分の色は青→赤→白となります。 ムーブメント・ヒートマップを用いることで、ページのどこに注目が集まっているのかを把握することができます。

マウスの動きがどうして注目と関係するのか疑問に思う方がいるかもしれませんが、近年の研究でマウスの動きと目の動きが約80%一致することがわかっています。

つまり、ムーブメント・ヒートマップはサイト利用者の目線の動きを表しているとも言えるのです。

これがムーブメント・ヒートマップの画面ですが、ヘッダー部分のグローバルナビゲーションに興味が集中していることがわかります。もう少し拡大してみましょう。

ページ上部のナビゲーションメニューでは「ホーム」以外に注目が集まり、メインのイメージを挟んで「ビジョン」、「会社概要」のピックアップが注目を集めています。もう少し拡大してみましょう。

すると、ページ右の「サービス内容、ソリューション」のところにはあまり注目が集まっていないことが分かります。

もしもこれが、運営側としてはピックアップしたい情報だったとしたら、何かしらの改善策を打つべき、ということになります。例えば、位置的な問題だと考えるのであれば、注目を集めている「ビジョン」と位置を入れ替えてみる。それでも注目度が変わらなかったら、内容の問題だと考えられるので、文章やビジュアルを変えてみるといったことが考えられると思います。

さらに、クリックヒートマップと同様に、リンクをマウスオーバーするとそのリンクの情報が表示されます。

注目は集めているのに、クリック率が悪いボタンの発見等、意外な発見があるかもしれません。データを眺めるよりも圧倒的に多くの情報が得られます。

クリック・ヒートマップは、クリックを可視化しているのでトップページなどのリンクが多いページの分析に適していましたが、ムーブメント・ヒートマップはオールラウンドにページを分析できます。

例えば、ECサイトであれば、購入ボタンに注目は集まっているかといったことや、ブログなら注目を集めたトピックはどこなのかといったことまで分析できます。

さらに、注目は位置的な影響を受けやすいので、注目を集めやすい位置に注目してほしいコンテンツを配置することでコンバージョンの増加等が、見込めます。

いかがだったでしょうか?  Mouseflowのムーブメント・ヒートマップを使ってWebサイトを最適化してみてください。

 

 

ピックアップ記事

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

関連記事

  1. Mouseflow

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

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

  2. ヒートマップ

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

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

  3. ヒートマップ

    Mouseflowの新機能:ライブヒートマップで動的なヒートマップ分析が可能に!

    mouseflowのヒートマップに新機能が追加されました!その名も「…

  4. ヒートマップ

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

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

  5. ヒートマップ

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

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

コメント

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

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

CAPTCHA


最近の記事

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

    BigQuery: テーブルに格納されたURL文字列をKey-ValueのSTR…
  2. Adobe Analytics

    Adobe Analytics:計算指標でevents変数を後付けでパーティシペ…
  3. Mouseflow

    Mouseflow新機能その2 – JavaScriptエラーを見つ…
  4. ヒートマップ

    MouseflowをAdobe Analyticsと一緒に使う
  5. ヒートマップ

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