ヒートマップとは？　種類と活用方法、アクセス解析との違いを解説

ヒートマップとは？

ヒートマップとは、Webサイト訪問者が、「どの箇所を熟読しているか（熟読エリア）」「どこまで読んだか（離脱・終了エリア）」「どこをクリックしたか（クリック位置）」がわかるツールです。熟読エリアやクリック位置を把握するため、ヒートマップでは色やグラフなどを使って見やすく表しています。

例えば、全国の天気予報で気温を表す時、オレンジや青、白色の変化で視覚的にわかりやすく伝えているのを見たことがありませんか？　天気予報の色表示と同じくヒートマップも色の変化で各情報を伝え、分析ツールの数字だけではわかりずらいユーザー行動の可視化や、サイト改善に向けたサポートをしてくれます。

ヒートマップは何に役立つ？

ヒートマップを導入することで、Webサイト内のユーザー行動をより具体的に可視化できます。分析ツールの情報を視覚的に把握することで、コンバージョン率を上げられたり、ページの最後まで読み進みやすいデザインが作れたりと、UI/UXの改善ができるのもメリットのひとつです。

UX（ユーザーエクスペリエンス）は、商品やサービスを利用することでユーザーが得る体験を指します。UI（ユーザーインターフェイス）はUXの一部で、サイトデザインやフォントなど、ユーザーが視覚で得る情報を指します。

どんなに使いやすく設計されたUIのスマホゲームでも、サーバーのレスポンスが遅く使い心地が悪ければUXは良くないと言えます。ユーザーの行動を可視化して把握することで、UI/UXの改善に役立てられるのがヒートマップです。

ヒートマップの種類と活用方法

ヒートマップは大きく分けると3種類の機能があり、ツールによって把握できる内容が違います。熟読度やクリック位置など、機能の特徴をよく知って、サイト訪問者がより見やすいページへ改善しましょう。

クリックヒートマップ

クリックヒートマップでは、ユーザーがWebサイトのどの部分をクリックしたのか、位置をデータで確認できます。例えば、企業側が想定した動線でサイト内を閲覧しているか、リンクやコンバージョンポイントをどれくらいクリックしているかなどがわかります。

リンク先がないのにも関わらずテキストにクリックが集まっている場合、ユーザーはクリックすることで詳細がわかると判断している可能性が高いです。クリックヒートマップで色の濃い部分があったら、テキストリンクやバナーリンクを設置するとユーザーの購買意欲をより高めたサイト作りができるでしょう。

スクロールヒートマップ

スクロールヒートマップでは、ユーザーがWebサイト内をどこまでスクロールしたのか把握できます。スクロール率が高いほど重要性の高いコンテンツ内容であることを把握できると同時に、Webサイトのどのあたりで離脱したかを計測できる機能でもあります。

例えば、サイトページの途中でスクロールが止まっている場合、ページ下部に記載したコンテンツは見られていないことがわかります。ユーザーの多くが途中離脱しているポイントがスクロールヒートマップから発見できれば、離脱ポイントを中心にコンテンツ構成の見直しを進められるでしょう。

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

アテンションヒートマップ では、ユーザーがWebサイトで熟読した部分や、滞在時間を把握できます。例えば、Webサイトで気になるコンテンツがある時、スクロールを止めてじっくり情報を閲覧しませんか？　Webマーケティングでは、サイトページ内をどこまでスクロールしたのかも重要ですが、どこで手を止めて熟読しているのか知ることも大切です。

ユーザーのサイト閲覧の目的は、気になるキーワードの答えを求めて悩みを解決したいからがほとんどです。ユーザーがよく読むエリア、つまり熟読エリアは、検索結果に対しての回答を提示することができた証拠でもあります。

熟読エリアを把握することで、ユーザービリティの高いサイト構築ができるでしょう。アテンションヒートマップを活用することで、ユーザーに人気のあるコンテンツ部分やあまり興味のない情報部分を知ることができます。

ヒートマップとアクセス解析の違い

ヒートマップとGoogle AnalyticsやGoogle Search Consoleなどのアクセス解析は、どちらもWebサイト訪問者の解析をするツールです。2つは同じような使い方に見えますが、何が違うのでしょうか。

アクセス解析は問題のあるページを発見できる

アクセス解析は、Webサイト全体の状況を把握できるツールです。例えば、「ユーザーがWebサイトを訪問したデバイス」や「人気があるページはどれなのか」などです。Webサイトのページ別のコンバージョン率や直帰率はもちろん、ユーザーの新規訪問やリピーターなども把握できます。

どんなに優れたコンテンツを発信しても、ユーザーがすぐ離脱しては意味がありません。Webマーケティングにとって欠かせないWebサイトは、ただ運営するのではなく、直帰率やコンバージョン率などの数値を把握し、目標を設定することも大切です。目標をクリアするには、アクセス解析は欠かせないツールです。

ヒートマップはページ内の問題を発見できる

ヒートマップは、Webサイト訪問者の行動を色で表現し、Web解析に詳しくない人でも簡単に把握できるツールです。例えば「ページ内のどこをよくクリックしているか」や「コンテンツのどこをよく読んでいるか」などです。多くのヒートマップは、熟読エリアや離脱エリア、クリック位置を確認できますが、中にはコンバージョンしやすいユーザーの行動傾向を把握できるツールもあります。

ユーザーのコンバージョンに繋がる行動を分析することで、ユーザーにとって適切な導線とタイミングを作る「接客シナリオ」の企画ができます。この接客シナリオをWebサイトに実装し、シナリオの表示・非表示でユーザーの閲覧傾向がどう変化したのかを再度ヒートマップで分析することで、ページ内の問題をより具体的に解決できるのです。

Sprocketのヒートマップ分析によりコンバージョン率が111％に向上した実例

実際に、Sprocketのヒートマップ分析を活用したことによって、コンバージョン率が111％も改善した事例があります。三井住友カード様の、契約済みユーザーのカード利用枠引き上げシナリオについて紹介します。

シナリオ企画前の分析では問題点が3つ

Webサイトのシナリオを企画する前に、コンバージョンユーザーと非コンバージョンユーザーのヒートマップを別々に作成し、比較しました。その結果、次の3つの手がかりを見つけました。

①カード利用枠の引き上げには、2パターンの申込みが存在（継続的な引き上げ、一時的な引き上げ）

②PCは2パターンの説明が横並びで比較、SPは縦並びで縦長で閲覧が必要（SP向け接客シナリオ必須）

③コンバージョンユーザーの多くがページ上部の内部リンクから「継続的な引き上げの説明」へ移動、申込みしている

ユーザーの行動をただ見るだけではなく「なぜコンバージョンしないのか」の観点から2つのヒートマップを分析することで紐解くことができました。

結果を元にWeb接客を実行

ヒートマップ分析から、コンバージョン率を高めるには、2つの問題があると予測しました。

①一部のユーザーは引き上げ方法が2つあることを知らない

②SPは縦並びでページが長く「継続的な引き上げ」のコンテンツまで閲覧できていない

この問題解決するために、先に2つの引き上げ方法があることを説明してから「継続的な引き上げの説明ブロックへ移動」できるようWeb接客シナリオを実行しました。

Web接客シナリオはユーザー行動に見事マッチして、コンバージョン率を111％も向上する結果となりました。

Webサイトのヒートマップ分析、CVR改善は、Sprocketにご相談ください

Webサイトを運営したからといって、必ずしもコンバージョンするとは限りません。コンバージョン率を高めるには、ユーザーの行動分析やUI/UXの改善など、ヒートマップを活用した分析が必要不可欠です。アクセス解析で見つけた問題のあるページに対して、ヒートマップを使えばより具体的な改善策を見つけ出せます。コンバージョン率の改善や悩みごとは、Sprocketの経験豊富なコンサルタントがヒートマップ分析やABテストなどを利用し、しっかりサポートいたします。お気軽にお問い合わせください。