ヒートマップ分析

ヒートマップ分析とは

ヒートマップとは、Webページ上でユーザーがどこをクリックし、どこまでスクロールし、どこに視線を向けているかを色の濃淡で可視化したツールです。GA4の数値データだけではわからない「ユーザーの行動パターン」を直感的に把握できます。

ヒートマップ分析

---

主要ツール比較：Clarity vs Hotjar

Microsoft Clarity（推奨：完全無料）

MicrosoftのClarityは完全無料でセッション録画・ヒートマップ・ダッシュボードをすべて提供する最強のコスト効率ツールです。

💡 Clarityの導入は5分で完了します。ClarityのサイトでプロジェクトをつくりトラッキングコードをGTMに貼るだけです。中小サイトから大規模サイトまで、まずClarityを入れることを強くおすすめします。

Hotjar（有料・機能豊富）

HotjarはLPO専門ツールとして業界標準の地位を持つサービスです。無料プランもありますが、記録できるセッション数には上限があります（上限や料金は改定されることがあるため、最新の情報は公式サイトで確認してください）。

⚠️ 初めてヒートマップを導入する場合はClarityから始めましょう。無料で十分な機能が揃っており、使い方に慣れてから必要に応じてHotjarに移行する判断ができます。

---

ヒートマップ3種類の見方と改善判断

クリックマップ

クリックマップはページ上のどの要素がクリックされているかを集計したものです。赤〜黄色が多クリック、青が少クリックを示します。

分析のポイント

• ◆CTAボタンのクリック率が低い → ボタンの色・サイズ・文言・配置を変更する
• ◆クリッカブルでない画像や文字がクリックされている → リンクを追加するかデザインを修正する
• ◆ナビゲーションやロゴへのクリックが多い → 必要な情報がLP内で見つからない可能性がある
• ◆複数のCTAがある場合、どのCTAが最もクリックされているか → 効果的なCTAの位置を把握する

スクロールマップ

スクロールマップはページのどの位置まで閲覧されたかを、ユーザーの割合（%）で示したものです。ページ上部ほど閲覧率が高く、下に行くほど低くなるのが一般的です。

分析のポイント

• ◆スクロール率50%付近で急激に閲覧者が減少する → そのポイントにCTAを追加するか、コンテンツを整理する
• ◆CTAボタンが配置されている箇所のスクロール率が低い → CTAをページ上部に移動させる
• ◆スクロール率がページ全体を通じて緩やかに低下 → コンテンツの順序が適切、改善は軽微でよい
• ◆70%以上スクロールしているユーザーが多い → 離脱理由がスクロール不足ではなく他にある

💡 「CTAはファーストビューに必ず入れる」のが鉄則です。スクロールマップで50%到達率を見て、CTAが50%以下の位置にしかない場合は、ファーストビュー直下にもCTAを追加しましょう。

アテンションマップ

アテンションマップはユーザーの視線や注目度の分布を可視化したものです。マウスの動きや滞在時間をもとに推定されます。

分析のポイント

• ◆重要なキャッチコピーやベネフィットが見られていない → テキストサイズ・色・配置を見直す
• ◆装飾的な画像に注目が集まり、テキストが見られていない → 画像を削減しテキストを前面に出す
• ◆ページの右側・下部への注目が薄い → 重要な情報は左上・中央に集約する

---

自動検出される問題パターン

Clarityは以下の問題パターンを自動検出してフィルタリングできます。

怒りクリック（Rage Click）

同じ要素を短時間に3回以上連続クリックしている行動です。ユーザーがフラストレーションを感じていることを示します。

原因として多いのは：リンク切れ・ボタンの反応が遅い・クリッカブルに見えるが動かないUI要素

対処法: 怒りクリックが多いページ・要素を特定し、リンク修正・UI改善・読み込み速度改善を実施する。

デッドクリック（Dead Click）

リンクでもボタンでもない要素がクリックされている行動です。ユーザーがそこにリンクがあると誤認していることを意味します。

対処法: 下線がついたテキスト・青い文字・ボタンのように見えるデザインを修正するか、実際にリンクを追加する。

---

セッション録画の活用

ヒートマップの集計データに加えて、実際のユーザー操作をビデオ形式で確認するセッション録画は質的分析として非常に有効です。

⚠️ セッション録画は個人情報に注意してください。Clarityはデフォルトでパスワードフィールド・クレジットカード番号は自動マスクされますが、プライバシーポリシーへの記載と必要に応じた追加マスク設定を行いましょう。

---

🏋️実践ワーク

以下のワークを実施してください。

1. ◆Clarityを導入する: 担当するLPにMicrosoft ClarityのトラッキングコードをGTM経由で設置し、正常にデータが取得されていることをClarityダッシュボードで確認する。
2. ◆クリックマップを分析する: 1週間後のクリックマップを開き、CTAボタンのクリック率を確認する。クリック率が低い場合、改善仮説を3つ立案する。
3. ◆スクロールマップを分析する: スクロール率が急激に落ちるポイントを特定し、その位置とCTAの位置を比較する。CTAが低い位置にある場合はファーストビューへの追加を検討する。
4. ◆セッション録画を5本見る: フォームを開いたが送信しなかったユーザーのセッション録画を5本確認し、共通する離脱パターンをメモする。

📝まとめ

ヒートマップは、GA4の数値データだけではわからないユーザーの行動パターンを視覚的に把握するツールです。Clarityは完全無料でヒートマップ・セッション録画・怒りクリック検出を提供する最初の選択肢として最適です。クリックマップでCTAへの誘導を確認し、スクロールマップでCTAの位置を最適化し、アテンションマップで重要コンテンツの視認性を改善する、という順序で分析を進めましょう。次のレッスンではファネル分析によるボトルネック特定を学びます。