ヒートマップはサイト改善に必須の機能の一つですが、どのような課題を解決できるのでしょうか。

「Webサイトの順位は上がっているが成果につながっていない」
「CVRの改善施策をおこなっているが結果につながらない」

このようなお悩みを抱えている方にとっての打開策になるかもしれないツールがヒートマップです。

この記事では、ヒートマップの詳細な機能についての解説、選ぶ際のポイント、おすすめのヒートマップについて解説します。

ヒートマップとはどのようなツールか

ヒートマップというのは、Webサイトのページ上でユーザーがとった行動をアクションの種類や頻度を色別のマップとして表現する仕組みです。

ヒートマップツールとは、ユーザーのふるまいをヒートマップとして表示させることのできるツールです。

ユーザー行動が色で視覚的に表現されるので、ユーザーアクションを分析するスキルがなくても、現在のWebページの特徴や問題点を把握することができます。

Webサイト上でのユーザー行動を可視化できる

ヒートマップツールでは、Webサイト上でユーザーが行った動きにそれぞれ色を付けて紐付けすることで、把握しやすい画像として出力することができます。

標準的なヒートマップ作成ツールでは、ページ内のマウスの動きやクリック、スクロールなどの能動的な動作や、ページを開いていた時間、どこでページを離脱したかなどの情報を色でマッピングします。

ヒートマップツールを利用すると、Webページの中でユーザーがどのようにふるまっているかを把握できるので、ホームページの運用や見直しに役立てられます。

デバイスごとのユーザー行動を確認できる

ヒートマップ分析ツールでは、パソコンやタブレット、スマートフォンなどのデバイス別に分析結果を表示させることができます。

パソコンで作ったWebページをスマホで見た場合に、クリックするボタンがスマホで1画面に表示されないケースや、延々とスクロールしないと次のアクションを起こす画面にたどりつけないケースがあり、ユーザーが嫌になって離脱してしまう場合があります。

自分のホームページに訪れるユーザーがどのデバイスを使っているかを知って、Webページをそのデバイスに最適化する根拠を得ることができます。

ヒートマップで可視化できるもの

熟読エリア

熟読エリアとは、ページを訪れたユーザーの滞在時間から、「どこがよく閲覧されているのか？」というユーザーの視点を可視化したヒートマップです。熟読エリアを分析する際にはアテンションヒートマップを使います。ユーザーがよく閲覧している箇所は赤く、あまり注目されていない箇所は青く色分けされています。よく読まれている箇所が特定できるだけでなく、なぜその場所が読まれているのかという仮説立て、分析に役立ちます。

よく読まれている箇所についてはどうしてここが読まれているのか、読まれていない箇所についてはどのようなコンテンツがあれば興味を持ってもらえるかを検討し、ユーザーが求めるコンテンツを充実させていきましょう。

終了エリア

終了エリアとは、「このページがどこまでスクロールされたか（＝読まれたか）」を可視化したヒートマップです。パーセントの数字によって、どのくらいのユーザーがその場所まで見たかを確認することができ、離脱の多い箇所を特定するのに役立ちます。

基本的にページは下部に進むにつれ読んでいる人の割合が減少する傾向にあります。そこで、ユーザーが熟読することを見込めるコンテンツをページ上部に配置することで、ユーザーの満足度を上げることができます。

また、熟読エリア分析と併せて活用することも有効です。熟読されているコンテンツがページ下部に配置されている場合、ユーザーの興味のあるコンテンツであるにもかかわらず行き着く前に離脱されている状態ということになります。熟読されているコンテンツを上部に配置するなど、ページの構成を見直すことができます。

クリックエリア

クリックエリアとは、「ユーザーがページのどの箇所をクリックしたのか」を可視化するヒートマップです。熟読エリアと同様、よくクリックされた箇所は赤、それほどクリックされていない箇所は青といったように色を使ってクリックされた箇所を示します。会員登録や資料請求といった、CTAボタンがきちんとクリックされているかを確認しましょう。

ユーザーにクリックしてもらいたいボタンがクリックされていない場合、それ以前のコンテンツに課題があると考えられます。また、遷移先がない箇所がクリックされている場合は、主にユーザーにクリックできると認識されている可能性、画像や文字を拡大したい可能性などがあります。よくクリックされている場所に遷移ボタンを設置するなどして改善を図りましょう。

ヒートマップの5つの種類

ヒートマップツールでは、スクロールとクリック、スマホであればタッチ、パソコンならマウスの動きといったアクションと、ユーザーの滞在時間などからユーザーが興味を持っている部分などをふるまいとして抽出します。

ここでは、それぞれのふるまいについて、どのような分析に役立ち、改善に活かしていけるかをご紹介します。

1：スクロールヒートマップ

スクロールヒートマップでは、Webページのスクロールの状況を取得することで情報を得ます。

スクロールのふるまいでは、スクロールがページの最後まで行われるかで、コンテンツに興味が持たれているかどうかがわかります。スクロールの途中で離脱されていれば、興味がなくなった場所がわかり、コンテンツの見直しにつながります。

スクロールの中のどの部分にユーザーの興味があるかを、アテンションヒートマップと併用して把握できれば、ユーザーが何に興味を感じて自分の使ったページに訪れたかを分析できます。

2：クリックヒートマップ

クリックヒートマップは、ユーザーにクリックされたCTAを特定することで、Webページにおけるユーザーの行動を把握します。

ページ内に複数のCTAがあった場合、クリックされたところとされなかったところを見れば、ユーザーが記事を見る目的や、CTAのデザインや説明が不十分である可能性などの情報を得ることができます。

3：アテンションヒートマップ

アテンションヒートマップでは、Webページ上の滞在時間などを見ることで、ユーザーの興味を惹きつけたコンテンツのあるエリアを特定できます。

力を入れていないエリアのアテンションが高かったり、見てほしいエリアが流し読みされていたりする場合は、デザインやコンテンツの位置、内容などを見直すことで、よりユーザーの満足度の高いコンテンツを提供することができます。

4：マウスフローヒートマップ

マウスフローヒートマップは、パソコンでマウスの動きをトレースすることで、アテンションヒートマップよりも細かく、ユーザーが興味を持った部分をとらえます。

ユーザーがコンテンツの文章のどの部分に興味を持ったのかまでがわかるため、バナーやボタンのデザインなどまで検討対象になってきます。

情報量が多いパソコン向けのWebページでは有効なヒートマップです。

5： タッチアクションヒートマップ

タッチアクションヒートマップは、スマートフォンやタブレットなど、タッチ操作が多いデバイスで、ユーザーが興味を持っているコンテンツを把握できます。

タップやスワイプを視覚化することで、ユーザーの興味をひいているコンテンツがわかり、画面縮小や画面拡大を視覚化することで、文字や画像の大きさが大きすぎたり小さすぎたりして、ユーザーが余分なふるまいをさせられていることがわかります。

ユーザーの興味や関心を把握するだけでなく、ユーザビリティの向上にもつなげられる分析結果を得ることができます。

ヒートマップツールを選ぶ際に重要な7つのポイント

コンテンツのアクセス状況を解析するツールはほかにも多くありますが、ヒートマップツールはより詳細なWebページの利用状況を得ることができます。

無料のツールも含め、多くのヒートマップツールが提供されていますが、それぞれのツールによって得意不得意があります。

ここでは、ヒートマップツールを選ぶ際に考慮するとよいポイントについてご紹介します。

1：ユーザーの行動を分類する機能があるか

ヒートマップツールを選ぶ際に重要なポイントの1つ目は、ユーザーの行動を分類する機能があるかどうかです。

ヒートマップツールでは、ほかの分析ツールでは知ることのできないページ内でのユーザーの細かいふるまいを把握できるので、Webページのデザインや説明を見直すきっかけになります。

スクロールヒートマップではページのスクロール状況、マウスフローヒートマップではマウスの動きを、タッチアクションではスマホなどの画面に対する行動をトレースできます。

2：企業に合った機能はあるか

ヒートマップツールを選ぶ際に重要なポイントの2つ目は、自社に合った機能が提供されているかどうかです。

ヒートマップツールによって、実装されている機能は異なりますので、自社が本当に知りたいユーザーのふるまいを、そのヒートマップツールで収集でき、分析することができるかどうかがツールを選択する際に重要です。

3：導入後のサポートはあるか

ヒートマップツールを選ぶ際に重要なポイントの3つ目は、導入した後にどのようなサポートが受けられるかです。

ヒートマップツールによっては、コンサルティングを提供してくれる会社もあり、初めて導入する場合などには心強いサービスです。ヒートマップの分析の仕方や、分析結果を自社の目的に合わせて活用する場合にどのように利用すればよいかもサポートしてもらえます。

海外製のヒートマップツールの中には、ヘルプや管理画面、サポートも英語のみの場合があります。

4：価格システムは適正か

ヒートマップツールを選ぶ際に重要なポイントの4つ目は、製品の価格はもちろん、サポートがどのように課金されるかなどの価格システムです。

ヒートマップツールには無料のものもありますが、有料のプランはPV数やページ数、ドメイン数やユーザー数によって従量で課金される場合が多く、追加サービスとしてデータ保存期間をどの程度にするかによっても金額が変わります。

初心者のうちは、有料プランで手厚いサービスを受けるのもおすすめです。

5：トライアル期間があるか

ヒートマップツールを選ぶ際に重要なポイントの5つ目は、実際に導入する前に機能や使い勝手を試すことのできるトライアル期間があるかです。

欲しい機能のないヒートマップツールを導入してしまうと、お金をドブに捨てることになったり、自社のシステムでは作動しないなどのトラブルに見舞われることもあります。

トライアル期間のうちに、欲しい機能があるかどうか、自社のシステムに必要なアカウント数やPV数と、それにかかるコストが効果に見合うかどうかなどを確認したり、管理ツールの使い勝手を見ておくとよいでしょう。

6：分析できるデータ量はどのくらいか

ヒートマップツールを選ぶ際に重要なポイントの6つ目は、処理できるデータ量が自社のニーズを満たしているかどうかです。

有料の場合はデータ量によってコストが変わりますが、無料版では制限があって、制限以上のデータは扱えないケースが多くなります。自社で必要なデータ量について収集、分析が必要なのかを事前に確認しておきましょう。

7：データの保存期間はどのくらいか

ヒートマップツールを選ぶ際に重要なポイントの7つ目は、どれくらいの期間、データを保存しておけるかです。

データの保存期間が短いヒートマップツールでは、中長期にわたるトレンドを見るような使い方ができませんので、保存期間が変更できるかどうかも確認しておく必要があります。

保存期間と同様に、保存できるデータ量にも制限がある可能性があるので注意しましょう。

【徹底比較】無料版／有料版のヒートマップツール

ヒートマップツールにはさまざまな機能がありますが、提供されているツールによって実装されている機能が異なります。

それぞれのツールによって強みや弱みがありますので、自社のニーズに合ったものを選ばなければなりません。料金もいろいろな体験があるので、リーズナブルなものを選ぶ必要があります。

ここではヒートマップのおすすめツールを無料版／有料版に分けてご紹介します。

【無料版あり】ヒートマップのおすすめツール6選

ヒートマップツールの中には、無料で利用できるものも一定数あります。有料版と比較した際に、基本的には月間のPV数や利用できる機能に制限があることが多いです。

一般的には、規模を拡大するまでは無料版を活用するなどでも問題ないでしょう。

しかし、Webサイトを通じた集客に注力する場合は有料版の利用が必須でしょう。

いずれWebでの集客にも注力をしていくという場合は、将来的に有料版を利用する際にどのツールを選択するのかを判断するために利用するという視点も重要かもしれません。

1：Mouseflow

Mouseflowでは、ユーザー一人一人のふるまいを把握できるセッションリプレイ機能を持ち、コンバージョン経路を分析することでユーザーのストレス要因を特定します。

フォーム分析で、ユーザーの離脱した箇所を知ることができ、滞在時間を高めるための工夫に役立てることもできます。

世界で10万社以上の導入実績を持ったツールで、管理画面は英語表記ですが、日本語化を進めており、日本の公式代理店のサポートは日本語で行えます。

無料版で機能を試してから有料版に切り替えることもできます。有料版の利用は月額2500円からとなっており、ヒートマップツールの中では最安クラスの金額で利用できます。

無料プランは500PVまで、プロプランだと500000PVまで計測が可能です。

公式サイト：https://mouseflow-jp.com/function/heatmap/

2：ミエルカヒートマップ

ミエルカヒートマップは、スマホなどのモバイルデバイスの解析に優れ、解析結果を受けての提案機能も充実したヒートマップツールです。

無料版では月間3000PV以内のサイトのスクロールヒートマップ、クリックヒートマップ、アテンションヒートマップが利用でき、ユーザーが興味を持っている事が可視化され、CV改善につなげることができます。

サイト規模に合わせて、 無料から有料まで複数のサービスが用意されており、大規模サイトでも問題なく使用できます。

公式サイト：https://mieru-ca.com/heatmap/

3：User Heat

User Heatは、無料で使えるヒートマップツールです。月間30万PVまで、熟読エリア、終了エリア、クリックエリアやマウスムーブ、離脱エリアなど全ての機能を無料で利用することができます。

録画再生機能などはなく、ヒートマップのみに特化したサービスですが、小規模サイトで手軽に解析してみたい方にはおすすめです。

ちなみに、このUser Heatの有料版ツールは、後ほど紹介するUser Insightというツールです。

出典：月間30万PVまで分析

公式サイト：https://userheat.com/whatheatmap

4：SiTest

Sitestは、ヒートマップ機能だけでなく、アクセス解析やA/Bテスト、EFOなどの機能も標準で装備されており、サイトのUI/UX改善をこれだけで行うことのできるヒートマップツールです。

PCやスマホ、タブレットなどマルチデバイスに対応しており、スクロールヒートマップ、クリックヒートマップ、マウスフローヒートマップが実装されているので、パソコンのアクセスでは詳細な動きをトレースできます。

30000PVまで無料でトライアル利用可能なため、満足できると判断したら有料プランに切り替えることも可能です。別途有料ですがコンサルティングも行っています。

公式サイト：https://sitest.jp

5：Ptengine

Ptengineは、ヒートマップ機能に加えて、広告やメルマガなど、ユーザーがどこから流入しているか、どんな属性のユーザーが訪れているかなどを解析できるヒートマップツールです。

Webサイト内で、ユーザーがどのようにふるまっているかを解析するための幅広い機能を持っています。

無料のトライアルが用意されていて、月間3000PVまで計測することができます。有料版では4段階の料金プランから選択することができます。

公式サイト：https://www.ptengine.jp

6：Contentsquare

Contentsquareは、ヒートマップツールのClicktaleとContentsquareが統合された、世界でも多くの導入実績を誇るヒートマップツールです。

Contentsquareでは、カスタマージャーニー分析で、自サイトでユーザーがどのようなUXを得ているかを可視化することで、サイトの改善に直接寄与することができます。

有料ツールですが、無料で使用することはでき、サイト上のすべての要素が自動的に識別されるので、面倒なカスタマイズを行うことなく使用できます。

公式サイト：https://contentsquare.com/jp-jp/platform/zone-based-heatmaps/

【有料版】ヒートマップのおすすめツール4選

1：User Insight

User Insightは、ヒートマップに加えて、EFO分析やユーザー属性分析、広告効果測定などの機能も装備した、国内での導入実績が豊富で多機能なヒートマップツールです。

先ほど無料ツールで紹介をした、User Heatの有料版がこちらのUser Insightです。

有料ツールで、サポートやカスタマイズにも対応しています。月額5万円から利用できるようです。（2023年6月現在）

公式サイト：https://ui.userlocal.jp

2：dejam

dejamは、ヒートマップの機能だけでなく、ABテストやデザイン改善案などといったサイト改善に必須の機能を余すことなく実装したツールです。

他社のサイトを分析する機能などもついているため、自社のサイトと競合他社のサイトを比較・分析したり、自社のサイトが成果に結びついているのかをデータをもとに確認することができます。

dejamが他のツールと最も差別化されている点は、サイト改善の業務が分析するのみに留まることがなく、確実に前進させることが可能であるということです。なぜなら、AIから自動で改善案を提案してもらえる機能が実装されているからです。たとえサイト改善業務の初心者であっても現状の知識や経験によらず、効果的な改善策を打つことができるでしょう。

利用料金は、月額13万4000円からです。2週間の無料トライアルプランがあるため、活用して検討してみましょう。（2023年6月現在）

公式サイト：https://leango.co.jp/dejam/function/heatmap/

3：Appsee

appseeは、スマホやタブレットなどのデバイスに強い、ユーザビリティを分析するためのヒートマップツールです。

よく使われるヒートマップだけでなく、ユーザーのアプリ操作を動画として分析できる機能を持ち、事実ベースでユーザーの行動理解につなげます。

リテンション分析やファネル分析、コホート分析、クラッシュ分析などにも対応しており、さまざまな解析が可能です。

プレミアムプランでは、最長2週間の無償お試し期間が設けられています。公式サイトによると、利用料金は月額9万5000円からのようです。（2023年6月現在）

公式サイト：http://appsee.interarrows.com

4：VWO

VWOは、各種デバイスに対応した、ヒートマップによる解析を活かして訪問ユーザーのふるまいを可視化し、ユーザーの導線の最適化をすることを目指すヒートマップツールです。

HTML/CSSの専門的な知識を持つデザイナーなしでA/Bテストを実施でき、仮説設定をヒートマップで行い、サイトの特性を把握して改善につなげることができます。

無料プランはなく、エンタープライズプランのみの提供となっています。利用料金は、月額7万円からとなっているようです。（2023年6月現在）

公式サイト：https://www.assion.co.jp/lp/05b/

ヒートマップツールを導入する5つのメリット

ヒートマップツールを導入するメリットは、Webページにおけるユーザーの詳細なふるまいを把握でき、視覚的にわかりやすいヒートマップとしてアウトプットできることです。

ここでは、メリットを具体的に説明します。

1：顧客の動きから興味を知ることができる

ヒートマップツールを導入するメリットの一つ目は、ユーザーの動きを可視化することで、ユーザーが訪れたページのどこに興味を持っているかを知ることができる点です。

ページの中でユーザーがどのようにマウスを動かしたりタッチをしたりし、どこまでスクロールして、どのエリアを長時間閲覧して、どこで離脱したかを視覚的にとらえられます。

ユーザーがストレスを感じている箇所や、興味を失った箇所を特定することができ、よりユーザーを引き付けるサイト構築につなげることができます。

2：クリックの状況から使いやすいレイアウトに改善できる

ヒートマップツールを導入するメリットの二つ目は、ユーザーがページ内のボタンをクリックするときにどのようなふるまいをしているかで、ストレス要因を抽出でき、より自然にクリックに導くレイアウトを実現できる点です。

1画面でたどりつけないボタンや、見つけにくいデザインはユーザーのストレスにつながります。自然に必要なボタンに導かれるような画面構成にすることで、クリック率の向上から、CVRを上げることにつなげることができます。

3：信憑性のある数値のデータが得られる

ヒートマップツールを導入するメリットの三つ目は、感覚ではない、信憑性のある数値データを得ることができ、しかも把握しやすく視覚化されている点です。

実際のユーザーのアクセスから、ふるまいを定量的なデータとして取得したものを使用するので、提示されるデータの根拠が明確にされ、顧客に提案する際に強い説得力を持たせることができます。

4：データをもとに内容を見直してSEO対策ができる

ヒートマップツールを導入するメリットの四つ目は、正しい根拠のあるデータを基にしているので、ユーザーにとっての有益度を増すことができ、SEO効果を高めることができる点です。

実データをもとにページを見直すことで、実際にUI/UXを向上させることができ、ユーザーとって有益なコンテンツとしての評価を高めることができます

5：顧客がページから離れた箇所を知ることができる

ヒートマップツールを導入するメリットの五つ目は、明示的にユーザーがページから離脱したポイントを把握できる点です。

離脱したところがこちらの想定通りであればよいですが、離脱してほしくないところで離脱している場合は、サイトのデザインやコンテンツに問題があるため、改善場所が見つけやすくなります。

ヒートマップツールの注意点3つ

ヒートマップツールはページ単位の分析に特化しているため、それ以外の解析には不十分な場合があります。

ヒートマップツールで把握するのは難しいふるまいについては、ページだけでなくサイト全体の分析が必要になります。

ここでは、ヒートマップツールを運用する場合に注意しなければならない点についてご説明します。

1：入力フォームの分析は難しい

ヒートマップツールの注意点の一つ目は、入力フォームなどの入力途中で離脱された場合に、問題個所が特定しにくいところです。

入力フォームに問題があると考えられる場合は、入力フォームの改善に特化したEFOツールなどを併用して、離脱の解消に努めましょう。

2：1ページ分の分析しかできない

ヒートマップツールの注意点の二つ目は、ページについてはかなり詳細なデータを取得できますが、サイト内でのユーザーのふるまいは把握できないというところです。

サイト単位のユーザーのふるまいを知るためには、アクセス解析ツールを併用しなければなりません。

3：一定の閲覧数がなければ正確な分析ができない

ヒートマップツールの注意点の三つ目は、実際にページを訪れているユーザーの絶対数が少ない場合には、有効なデータが得られず、正確な分析ができないところです。

少ないPV数で解析してしまうと、現実とは異なる偏った分析結果につながり、間違った改善につながりかねません。

ヒートマップツールを導入してWebサイトの質を向上させよう

ヒートマップツールは、Webサイトを運営している企業にとっては、これまでになく詳細で正確なデータを得られるツールです。

ページ単位でのユーザーのふるまいは、ヒートマップツールでかなり詳細に把握することができ、ページのデザインやリーディングを向上させ、UI/UXの最適化やSEO対策につなげることができます。

ヒートマップツールを導入し、Webサイト全体を分析するWeb解析ツールやA/Bテストツールと併用して、自社のWebサイトの質を向上させていきましょう。

LPやWebデザインを効率的に検索するには

たくさんのサイトを検索して参考になるデザインを探すのは時間がかかって大変です。
そこでおすすめなのが、LeanGoの提供する「Dejam」です。

https://leango.co.jp/dejam/
「Dejam」は、豊富なデザインデータベースを無料で公開している、LP・Webデザインの参考事例サイトです。
業種や画面名などでデザインを検索することができます。
デザインを検索したい方は活用してみましょう。