ヒートマップとは

ヒートマップツールを使うことで、ユーザーがWebサイト上でどのように行動しているかを視覚的に把握できます。

自社のWebサイトが、ユーザーにどのように使われているかを把握することができるので、Webサイトを運用するうえでは欠かせないツールだと言えます。

この記事では、ヒートマップの基本的な紹介から使い方までを初めての方でもわかりやすいように解説しています。

ヒートマップってなに？

ヒートマップとは、ユーザーがWebサイト上でどのような行動をとっているかを視覚的に表した図のことです。

具体的には、ユーザーが長くとどまっている場所や読み飛ばした場所、クリックした場所や離脱した箇所などを知ることができます。

こうした場所をサーモグラフィのように色分けして表示することからヒートマップと呼ばれています。

ヒートマップの重要性

オフラインの店舗では顧客の行動を実際に見ることができるので、困っていたら声をかけに行ったり、問題を解決するためにその場で動くことができます。しかし、Webサイトの場合はユーザーの行動を把握することができないため、どこで困っているのか、何に興味を持っているのかがわかりません。

こういった問題を解決するのがヒートマップツールです。

ヒートマップは、特定のWebページでのユーザー行動を可視化したものです。

Webサイト上のどこを読んでいるのか、どこをクリックしてどこで離脱してしまっているのかなどを把握することができます。

また、多くの解析ツールでは、Webサイトへの流入経路や滞在時間を分析することはできますが、Webページ上での細かい動きについては分析できません。

ヒートマップで分析したデータから、Webページの効果的に機能している点や問題点などを細かく把握することができます。効果的に機能している点をWebサイト上の違うページに流用したり、問題点をピンポイントで改善することで、最小限の工数でコンバージョン率の高いWebサイトを作成することができるようになります。

Webサイトの改善を効率的に行うために必須のツールであるといえます。

ヒートマップの3つの機能

ヒートマップツールには、基本的に3つの機能が備わっています。

以下で３つの機能からわかることと、それぞれの機能から得られるデータを活用してWebページを改善する方法について解説します。

ヒートマップを使った分析・改善方法

熟読エリア（アテンションエリア）

アテンションヒートマップでは、熟読エリアを知ることができます。

具体的には、Webページ上でよく読まれている場所や読み飛ばされている場所を色別で表しているので、赤色であればよく読まれている、青色であればあまり読まれていない場所であるなどの分析ができます。

このデータを使うことで、ユーザーが想定通りの行動をしているかの確認をすることができます。

もし、想定通りの行動をしていなかった場合、改善を行う必要があります。

たとえば、注目してほしい部分が読み飛ばされていた場合、同じページ上で注目されている部分を分析して、その部分を参考に構成などを改善します。具体的には、注目してほしい部分に画像を加えたり、テキストの量を減らすなどの改善が考えられます。

また、行った改善が狙い通り作用しているかの確認も行うことができます。

終了エリア

スクロールヒートマップでは、ユーザーがどこまでスクロールしたか、つまりユーザーが閲覧を終了した箇所を分析することができます。

どのように表現されているかはヒートマップツールによって様々ですが、ページをいくつかのエリアに分けて、そこまで到達したユーザーの割合をパーセンテージで表す形が多いです。最初の区分まで到達したユーザーは95%、真ん中のエリアでは70%などとページ上に表示される形です。

このデータでは、ユーザーがページのどこで興味を失っているのかを分析することができます。

たとえば、ファーストビューで多くのユーザーが離脱してしまっている場合、ファーストビューの構成を練り直す必要があります。

逆に、ファーストビューの滞在率は良いものの、ページをスクロールするごとにユーザーが離脱していくという場合は、注目してほしいコンテンツにユーザーが到達しているかを確認する必要があります。到達していなかった場合は、ファーストビューの構成はそのままに、注目してほしいコンテンツをユーザーの滞在率の良い部分まで移動させるなどの改善が必要です。

また、コンバージョン地点やリンクの場所に何％のユーザーが到達しているのかを確認することも大切です。

コンテンツやテキストの内容を変更しなくても、コンバージョンやリンクのボタンを少し上に移動させるだけでコンバージョン率が改善される可能性があります。

クリックエリア

クリックエリアの分析では、ページ上のどこがクリックされているのかを分析することができます。

クリックは点で表され、クリックされた回数が多いほど点が大きくなったり色が濃くなったりします。

このデータからは、ボタンや画像、URLなどの押してもらいたいパーツがクリックされているか、逆に間違えてクリックされている個所がないかなどの確認ができます。

例えば、リンク先を用意していない場所がクリックされていた場合、ユーザーを迷わせるデザインになっていることを意味します。遷移先のある画像には ＞などの矢印をつけたり、強調するだけのテキストは太字のみ、遷移先のあるテキストには色やアンダーラインをつけるなど、デザインの差別化を行う必要があります。

また、クリックされている場所は、ユーザーがより詳しく知りたい場所であることも意味します。説明を付け加えたり、リンクを埋め込んだりなどの改善を行いましょう。

空クリックは、ユーザーにストレスを与え、離脱を促す大きな要因になります。意図する箇所をクリックしてもらうためにも、ヒートマップを活用してユーザーを迷わせないデザインに改善していく必要があります。

注意点

メリットのたくさんあるヒートマップですが、活用するうえでの注意点がいくつかあります。

一つ目は、分析データから読み取れるユーザーの心情は一意でないということです。

例えば、熟読されているエリアは必ずしもユーザーが興味を持っている箇所とは限りません。内容が分かりにくいため滞在時間が伸びている可能性もあります。熟読されているからと言ってそういった箇所の構成をほかの箇所に転用した場合、ページ離脱率が上がってしまう恐れがあります。また、終了エリアは、ページの離脱を意味しますが、必ずしもネガティブな意味ではありません。コンバージョンのためのページ遷移もページの離脱としてカウントされます。

このように、データを正しく読み取る必要があるため、改善に利用する際には注意が必要です。

二つ目は、ヒートマップで表されるデータはあくまでWebページのデータであり、サイト全体のデータではないということです。

アクセス数の少ないページから読み取ったことをアクセス数の多いページの構成に反映すると、思ったような効果が出ない恐れがあります。また、Webサイト上でも、会社の紹介ページと商品の購入ページでは、ユーザー層が違うこともあるので、ページごとの違いに留意する必要があります。

まとめ

ヒートマップは、Webページを改善するうえで欠かせないデータを提供します。

Googleアナリティクスなどでは分析できない、細かいユーザーの行動を可視化するものです。

しかし、提供されたデータを読み取る際には注意が必要です。

データを正しく読み取って、効率の良い改善を目指しましょう。

よくある質問

Q1. ヒートマップはなぜユーザーの行動が分かるのですか。

A1. 人間の目の動きとマウスの動きには80%程度の相関があるとされていることから、ヒートマップツールではカーソルの動きを追跡し、そのカーソルのログからヒートマップを作成しています。


Q2. ヒートマップの色の違いはどういった意味ですか。

A1. ツールによって違うこともありますが、主に濃い暖色がユーザーが強く反応していることを表し、寒色が濃いほどユーザーの反応が薄いことを示しています。


Q3. ヒートマップのデメリットはなんですか。

A3. ヒートマップでは、特定の1ページの分析しか行うことができません。ユーザー行動を改善するにはサイト全体を改善する必要があるので、ページごと、エリアごとのサイト訪問者の母数を加味した分析や全体を俯瞰してみる視点などが重要になります。