ヒートマップとは：ページのどこが読まれているかを確かめる見方と注意点

ヒートマップとは、ウェブページ内のクリックやスクロールなどの行動を、位置と色で示す解析のことです。アクセス数だけでは見えない、ページの途中で起きている操作を調べます。

製品ページを一つ選び、仕様表と問い合わせボタンの位置を確認してください。その位置まで到達しているか、ボタンが押されているかを別々に見ます。色の濃い場所を探すだけでは、直す作業は決まりません。

検索結果に出ているかはSearch Consoleの数字の見方⁠で調べます。ヒートマップは、サイトを開いた後の行動を調べる道具です。

クリック・スクロール・注視で何が分かる？

同じ色の図でも、何を集計したかが違います。表示を切り替えるたびに、指標の名前と対象期間を読んでください。

Microsoftのヒートマップの説明では、Clarityはクリックやスクロールの記録を集計して表示します。ページ単位のほか、ページ群でも表示できます。ただし、構成が違う製品をまとめると、どの仕様が読まれたか判断しにくくなります。

クリックが多い写真は、拡大したいのに拡大できない場所かもしれません。問い合わせボタンにクリックがあっても、フォーム入力や送信に成功した証拠にはなりません。実際にその場所を押し、起きる動作を確かめます。

注視という名前でも、目の動きを測っていない

Clarityの注視表示の公式説明には、次の記載があります。

Attention maps provide data on time spent.

各部分で費やした時間を示すという説明です。カメラなどで視線を測る検査とは区別します。仕様表の周辺に長く滞在していても、内容に納得したのか、表が分かりにくかったのかは図だけで決められません。

スクロールが浅いことも、直ちに失敗ではありません。冒頭だけで必要な答えを得た人と、期待した内容がなくて帰った人を、到達位置だけで見分けることはできないためです。

無料のClarityで、どこまで確認できる？

公式FAQは、Clarityを無料のサービスと説明しています。ヒートマップに加え、訪問中の操作を再現して見るセッションの記録が用意されています。有料製品を契約する前でも、公開ページの操作を調べられます。

最初は対象URL、期間、端末をそろえて集計します。パソコンとスマホでは、仕様表やボタンの配置が変わります。全部を一緒に見て、スマホだけの不具合を見落とさないようにしてください。

ヒートマップで気になる場所を見つけたら、関連する操作の記録を確認します。写真を繰り返し押す、表へ戻る、フォームへ進む、といった流れを見ます。一人の操作だけを、訪問者全体の意見にはしません。

導入したことを、問い合わせ増加の実績として扱うこともできません。道具で見えるのは操作です。何を直し、実際にどんな相談が届いたかは別に記録します。

製造業の製品ページでは、どこを見る？

以下は、加工部品の製品ページを点検する例です。特定の会社で得た実測値ではありません。営業や技術担当に、発注前に確認される項目を聞いてから位置を調べます。

仕様表の手前で止まっていないか

材質、加工寸法、対応する仕上げなどの表まで到達しているかを見ます。会社紹介や大きな設備写真が続き、仕様が下に隠れているなら、必要な情報の順番を見直します。

到達しているのに表の周辺で何度も操作しているなら、横方向に動かせることが伝わるかを実機で試してください。スマホでは項目名と数値が離れて、どの材質の条件か読めないこともあります。色だけで本文を削らず、表の見え方を確認します。

相談できる条件を読んだ後に、窓口があるか

試作を受ける条件や必要資料を読んだ位置から、相談へ進めるかを見ます。ボタンまで到達する人が少ないなら、仕様の近くへ移す案を検討します。すでに到達しているなら、文言と遷移先を点検します。

クリックされているのに完了が少ないときは、ボタンの色より先に、リンク切れや入力エラーを調べます。図面の添付と受信までの点検は問い合わせ導線の見直し方⁠にまとめています。

改修前後で同じ内容を比べているか

仕様の位置を変えれば、同じ到達位置でも見える内容が変わります。修正日と、修正前後の画面を残してください。古い配置の集計を、新しい配置だけの結果として報告しないようにします。

季節、広告、端末の構成が変わることもあります。改修前後の色が違っただけで、配置変更の効果を確定しません。対象の閲覧数と流入条件も一緒に残します。

個人情報は、計測を始める前にどう扱う？

Clarityのマスキングの仕様では、入力欄と選択欄の内容はすべてのモードで隠されます。初期設定のBalancedは、数字やメールアドレスなどの機微な内容を隠す方式です。特定の要素を指定して隠す機能もあります。

ただし、入力後の確認画面では、文字が入力欄の外に表示されることがあります。相談文、添付した図面のプレビュー、会員向けの情報まで、隠したい範囲を制作担当と確認してください。入力欄が隠れるから全画面で安全、とは判断しません。

機密情報を扱う画面は、そもそも計測コードを動かさない方法も制作担当と検討します。分析のために、公開する必要のない図面を表示させる必要はありません。URLに相談文やメールアドレスを入れる設計も避けます。

利用の告知も準備します。Microsoftのプライバシー記載例は、Clarityの利用、取得するデータ、目的、Microsoftのプライバシー文書へのリンクを示すよう案内しています。例文をそのまま貼らず、自社が実際に使う機能と目的に合わせます。同意の取得やタグを動かす条件も、対象地域と利用条件に合わせて確認します。

訪問が少ないページは、どう判断する？

Clarityの公式説明では、ヒートマップの生成に最低限の訪問数はありません。ただし、図が表示されることと、多くの訪問者に共通する傾向を判断できることは別です。少数のクリックで濃い色になった部分を、全員が求める機能と決めないでください。

最初は、仕様表への到達とボタンの操作が起きているかを確かめます。十分な記録がなくても、押せるはずのリンクが動かない、表が切れて読めないといった不具合は実機で確認できます。集計がたまるのを待つ必要はありません。

記録表には、対象URL、期間、端末、閲覧数、見つけた操作、修正案を残します。仕様表は不要と書く前に、「仕様表へ届く前に止まっている」のかを分けます。前者なら情報を削る判断、後者なら配置を変える判断になり、対応が逆になるためです。

ページ群で調べるときも、似た配置を使うものだけをまとめます。資料請求が目的の製品詳細と、原因を調べる技術記事では、期待する到達位置が違います。色を一つに集める前に、読者がそのページで終えたい作業をそろえます。

色の図を、改善の依頼へどう変える？

私たちは暦の自社メディアで、神社の特色を表の一行へ押し込み、見出し付きの節へ出し直しました。出典は2026年8月21日以降の自社作業記録です。情報が存在することと、読者に見つけてもらえる出し方は別でした。この修正をヒートマップで検証した実績ではありません。

ヒートマップを使うなら、「読まれていない」だけで依頼を終えず、「仕様まで到達しにくいので設備紹介の位置を下げる」⁠の⁠よ⁠う⁠に書きます。根拠の画面、直す箇所、確かめる操作を組にしてください。

問い合わせ完了の設定はGA4のキーイベントの使い方⁠で確認できます。計測と改善では、到達、クリック、完了、実際の受信を分けて、どこで止まっているかを調べます。

仕様・出典の確認日：2026年10月23日⁠。