ヒートマップ解析ツールでサイトを徹底改善しよう

SEO Concept with Laptop and Icons

コンバージョンの向上やコンテンツの改善には、ヒートマップの活用が不可欠です。多くのWeb担当者の方は、アクセス数や流入経路ばかり分析しがちですが、ユーザーの反応を分析して、コンテンツの改善をしていかなければ、コンバージョンも向上せず、ユーザーの離脱率は高まるばかりです。

ヒートマップは、ユーザーが何を見ているか、何がストレスだったのか分析できるツールです。ヒートマップツールを使いこなせるかどうかで、今後のサイトの未来にも大きく関わってくるでしょう。

しかし、様々なヒートマップ解析ツールの中から何を選び、どう活用すればいいかわからない人も多いのではないでしょうか。

そこで今回は、ヒートマップツールのmouseflow(マウスフロー)を例にして、サイトの改善方法をご紹介させていただきます。

ヒートマップ解析ツールとは?

最近、注目を集めているヒートマップ解析ツール。多くの大企業が導入を進めている注目のサービスです。

Googleアナリティックスなどのアクセス解析サービスと違う点は、流入経路、アクセス数、コンバージョン数、ユーザー数などを把握するために使うツールではなく、ユーザーのサイト内行動を色で見える化するためのツールということです。

image4

この機能は、ユーザーの滞在時間、マウスの動きなどの情報をもとに、どの部分が一番見られているか可視化できる機能です。ユーザーが注目していたエリアと興味を持たなかったエリアを明確にすることで、コンテンツの改善に繋げることができます。

サイト作りにはユーザー目線が大切だとよく言われますが、企業や個人が作ったサイトはどうしても企業目線、個人目線になりがちです。これはどうしようもないことです。

しかし。どうしようもないと放置しておくと、滞在時間やコンバージョン率は一向に改善されず、ユーザーだけではなくGoogleからの評価を落とすことにも繋がります。

ヒートマップツールを使うことで、ユーザーの気持ちを可視化し、満足度の高いサイトへ変貌させることができます。これが、多くの企業がヒートマップ解析ツールをこぞって導入し始めた理由です。

ヒートマップ解析ツールの機能

今回ご紹介するヒートマップ解析ツールのマウスフローは、デンマーク発の解析ツールです。世界で100,000社以上の企業に導入実績があり、マイクロソフト、ダイソン、フォルクスワーゲンなど世界中の名だたる大企業も利用しています。

ヒートマップ機能を始め、クリックヒートマップ、スクロールヒートアップ、アテンションヒートマップなど、条件や用途に合わせて使えることから、業界や企業規模に関わらず利用できます。

それでは、マウスフローにはどのような機能があるのかご紹介します。

Movement Heatmaps(ムーブメントヒートマップ)

image3

movement Heatmaps(ムーブメントヒートマップ)は、サイト上でのユーザーの動きを分析するための機能です。ユーザーの滞在時間などの情報をもとに、ユーザーが注目した部分を白色、赤色、黄色、緑色、青色の順番で表しています。白色の部分は、ユーザーが最も注目した場所でありコンテンツがよく見られているということになります。

逆に、青色の部分についてはユーザーの注目度が低く、コンテンツが見られていません。ユーザーの行動を促したい場合、白色や赤色の「ホット」エリアにリンクや問い合わせボタンをクリックしたくなるようなコンテンツを置く必要があります。

本来は一番見てもらいたいコンテンツやリンクも、実際のところは見られていないことがよくあります。それをユーザー目線で見られるのが、このムーブメントヒートマップ機能です。

サイト作りのポイント

  • ページ内の「ホット」エリアに置かれたコンテンツは、ユーザーの行動を促すような内容になっていますか?
  • ユーザーがページを離脱、もしくはクリックしたくなくなるようなマイナスの要素が「ホットエリア」に置かれていませんか?
  • 「ホットエリア」のコンテンツに説明は十分足りていますか?もし、不十分であればユーザーはもっと情報が欲しいと感じているかもしれません。

Click Heatmaps(クリックヒートマップ)

image5

クリックヒートマップは、どこをクリックしたか色で見える化する機能です。上記のページを見ると、右上の部分が白くなっていることがわかります。これは、サイト上で一番クリックされる場所が、ナビゲージョンボタンだからです。一方、リンクが貼られていない中央の文字の部分にもクリックが集まっていることがわかります。ユーザーがリンクだと思って間違ってクリックしているということがわかります。

リンクでも、問い合わせ先でも、ユーザーを惑わす色やデザインになっているとコンバージョンや離脱の原因にもなります。

このクリックヒートマップ機能を使えば、ユーザーがどこをクリックしたのか明確にすることができます。つまり、どこにデザインやレイアウトの無駄があるのかわかるということです。

サイト作りのポイント

  • 意図したリンクはクリックされていますか?
  • 意図していない場所がクリックされていませんか?
  • 不要な文字や写真は配置されていませんか?それを入れている特別な理由はありますか?
  • ユーザーの行動を促すためにも、ナビゲーションのリンクや配置を見直す必要はありますか?
  • 問い合わせ先などのリンクは他の場所と同じくらいクリックされていますか?離脱の原因になっている要素はありませんか?

Attention Heatmaps(アテンションヒートマップ)

image2

アテンションヒートマップは、ユーザーがページ上で費やした時間を色で表現する機能です。色味によって、どのページが一番見られているのかわかります。

赤色は、もっとも活動量が多く、青色は最も活動が少ない場所です。

image1

この機能を利用することで、ユーザーにとってどこが最も魅力ある場所なのか瞬時に把握することができます。

サイト作りのポイント

  • ストレスのないレイアウトになっていますか?
  • 訪問者の関心を引くページになっていますか?

Scroll Heatmaps(スクロールヒートマップ)

image7

スクロールヒートマップは、特定の箇所を指定することで、エンゲージに関する情報を見ることができます。例えば、ページ内の一部やその部分を見たユーザーの割合、ユーザーが費やした時間などが挙げられます。

この機能が一番有効的なのが、重要なコンテンツが一番下に配置されている時です。重要なコンテンツは、上部に配置されるべきですが、多くの問い合わせや購入ボタンは最後に置かれています。しかし、ユーザーがページを見始めた時に、ボタンがないとストレスを感じて離脱する可能性が高まります。

この機能を使い、どこにリンクやボタンを設置するべきなのか分析することで、ユーザーのストレスを下げ、コンバージョンを向上させることができます。

サイト作りのポイント

  • 主要なコンテンツはFold線より上部に配置されていますか?
  • コンバージョンするまでに、ユーザーに十分な時間と情報が与えられていますか?

まとめ

以上、ヒートマップ解析ツールでサイトを改善する方法をご紹介しました。今回例にしたマウスフローを使うと、ユーザーの行動を細かく分析し、コンテンツの改善やコンバージョンの向上に繋げることができます。

コンテンツは、ユーザーや読者がいて成り立つものです。どうしても製作者側の目線になってはしまいますが、ヒートマップを使うことでユーザー目線のコンテンツを制作できるようになります。一度利用を考えてみてはどうでしょうか。

image6
mouseflow(マウスフロー)
https://mouseflow-jp.com/