CVRアップのための"ヒートマップ解析入門"（後編）
この記事は、「CVRアップのための"ヒートマップ解析入門"（前編）」を読んでくださった方に向けて、もう少し実践的な内容をご説明することを目的としています。
この記事のゴール
この記事のゴールは、以下の2点です。
・業種別のヒートマップの見方を理解する。
・ヒートマップ解析をサイト改善に生かす方法を理解する。
業種別 ヒートマップ読み解き 事例集
【 業種 1 】不動産（分譲マンション）
図1：東京都文京区 分譲マンション「周辺環境ページ」
図1は、東京都文京区の高級物件の「周辺環境ページ」のヒートマップです。文京区という土地柄から、「交通アクセス」の次に「教育」「子育て」が熟読されています。
図2：東京都杉並区 分譲マンション「周辺環境ページ」
図2は、東京都杉並区の住宅街の物件の「周辺環境ページ」です。最寄りのスーパーの情報が熟読されています。図1の文京区の物件と比べると、ターゲットユーザーが重視している情報が異なることが分かります。
図3：横浜市 分譲マンション（駅近希少高級物件）「トップページ」
図3は、横浜市の駅近希少高級物件のヒートマップです。「なぜ、駅の近くで開発できたのか」という「プロジェクトストーリー」が熟読されています。
以上のように、同じ「分譲マンション」のサイトであっても、ターゲットとなるユーザーの関心事が異なれば、熟読されるコンテンツは異なることが分かります。
【 業種 2 】ブライダル
図4：あるブライダルサイトのタップの状況。ボタンに見えてしまうが、リンクが張られていない
ブライダル関係のサイトは華やかなデザインが多くなりますが、図4を見ると、「リンクは張られていないがボタンに見えてしまうデザイン」は、ユーザーにタップされることが分かります。リンクが張られていると思って「ボタン風」の画像をタップしたユーザーは、何も起こらないので、がっかりすることになります。
【 業種 3 】EC
図5：ECサイトの「トップページ」のヒートマップ（その１）
図5では、ページ内で最も見られている「週間レビューランキング」のスクロール到達率が36％にとどまっています。（「スクロール到達率」とは？という方は、是非「前編」をご参照ください。）
図6：ECサイトの「トップページ」のヒートマップ（その２）
図6のECサイトでは、最も見られている「カテゴリー別おすすめアイテム！」のスクロール到達率が39％にとどまっています。
【 業種 4 】英会話教材
図7：英会話教材のLP（その１）
図7では、前置きが長すぎて、「本題はここから」のスクロール到達率が26％になっています。
図8：英会話教材のLP（その２）
図8では、「有名講師の紹介」のスクロール到達率が23％になっています。有名講師の起用は英語教材にとっての差別化ポイントであるはずですが、約2割のユーザーにしか認識されていないことになります。
図9：英会話教材のLPのヒートマップ（その３）
図9のヒートマップを見ると、「英語での電話対応」「英語での謝罪」など、ユーザーが「英語をしっかり勉強したい」と考えるきっかけになるようなポイントが熟読されていることが分かります。
【 業種 5 】モーターボート販売
図10：モーターボート販売企業「トップページ」
図10のクリックヒートマップを見ると、よくクリックされている「全国展示・試乗艇」の導線のスクロール到達率が11%になっています。
【 業種 6 】ニュースサイト
図11：ニュースサイトの記事本文（その１）
図11のニュースサイトでは、記事の執筆者自身が、ヒートマップツールを使って、「熟読されている箇所」を確認しています。
図12：ニュースサイトの記事本文のヒートマップ（その２）
図12の記事本文の中には、文字が小さくて読みづらいグラフが掲載されています。記事中に「読みにくい要素」「理解しにくい要素」があると、その後のスクロール到達率が下降することが、よくあります。
図13：ニュースサイトの記事本文のヒートマップ（その３）
図13の記事では、「本文終了位置」から「関連記事へのリンク」までが遠すぎて、スクロール到達率が低下していることが分かります。
【 業種 7 】BtoBサイト
図14：会計ソフトの「TOPページ」のヒートマップ
図14のページ内で最もよく読まれている「導入実績はこちら」が、ファーストビューから遠い位置に置かれています。
図15：会計ソフト（無料版）の「製品紹介ページ」のヒートマップ
図15では、どこが熟読されているのかを確認することで、「ユーザーが関心がある項目」を知ることができます。
ヒートマップ解析をサイト改善にどう生かすか
（１） スクロール到達率
ここからは、「ヒートマップを見て、課題をどう発見するか」というテーマで、ヒートマップの例を見ていきます。まずは、「スクロール到達率」の見方についてです。
図16：看護師転職の比較サイト
図16では、バナーの部分でスクロール到達率が低下しています。バナーがタップされている場合は、「遷移させている」ので好ましい状況ですが、この例では、タップされていないのに離脱させています。
図17：あるECサイトの「商品詳細ページ」
図17では、商品詳細を見てから「カートに入れる」ボタンに到達するまでに、半数以上のユーザーが離脱しています。
図18：ヘッドハンティング会社のヘッドハンター紹介ページ
図18のページの場合、余白が多く、「お問い合わせ」ボタンまでが遠いので、スクロール到達率が低下しています。
図19：BtoB リース会社のLP
図19では、ユーザーが関心が高い情報が、ページの終わり近くに置いてあります。
図20：オンライン英会話のLP
図20では、有名企業が多数導入していることをアピールしたいはずですが、導入企業のロゴが掲載してあるエリアのスクロール到達率が19％にとどまっています。
図21：スキンケアECのLP
図21では、ファーストビューからセカンドビューでスクロール到達率が48ポイント低下しています（100％→52％）。弊社の知見では、パフォーマンスが良いLPのセカンドビュー開始位置のスクロール到達率は70％以上です。
図22：ヘッドハンティングの実績紹介ページ
図22は、スクロール到達率があまり低下していない長いエリアですが、途中にコンバージョンにつながる導線が無い状態です。
図23：勤怠管理・工数管理等、統合ツールの製品紹介サイト
「個別機能の紹介」（スクロール到達率：赤）から「機能連携の紹介」 （スクロール到達率：青）までの間にスクロール到達率が低下しています。「機能連携」について知ってもらうチャンスを逃していると言えます。
（２）クリックヒートマップ
図24：コスメのマンガLP（その１）
図24では、商品写真がタップされているのに、写真にも、写真の周辺にも導線がありません。商品が売れていることを紹介するために、外部のECイトのキャプチャー画面を掲載したのですが、本物の購入画面と勘違いしてしまったユーザーがいるようです。
図25：コスメのマンガLP（その２）
図25には、ページ内にコンバージョンボタンが２つありますが、距離が離れすぎていて、途中にCTA（Call to Action）が無いエリアができてしまっています。
図26：ひざの痛みに効くサプリメントのLP
図26の状況も図25と似ており、2つ目のコンバージョンボタンが、スクロール到達率36％のエリアまで無い状態です。
（３）アテンションヒートマップ
図27：美容クリニックのサイト
図27では、熟読されているように見えるエリアでもスクロール到達率が下がっているエリアがあります。下向きの矢印のエリアは、テキストのみの長文です。この例のように、熟読されていても、「スクロール到達率」も併せて見た方がよい場合があります。
図28：英会話教材のLP（コンバージョンしたユーザーのみのヒートマップ。流入元別に比較）
図28のヒートマップでは、コンバージョンしたユーザーは、流入元、新規/再訪問に関わらず、「ここがPOINT」をよく読んでいることが分かります。
図29：人材紹介のフォーム（採用企業側）
図29の入力フォームのアテンションヒートマップを見ると、入力に時間が掛かっているエリアが分かりました。時間が掛かっているのは、「貴社URL」の入力欄です。時間を掛けてでも、このフォームで入力してもらう必要がある情報か、検討の余地があります。
図30：リフォームセミナーの入力フォーム（コンバージョンしていないユーザーのみのヒートマップ）
図30では、コンバージョンしていないユーザーで、「セミナー日時選択」をじっくり見ているユーザーが多かったことが分かりました。「セミナー日時選択」をじっくり見ているのにコンバージョンしなかったということは、参加したいがスケジュールが合わなかったのではないか、という仮説が考えられます。日時の選択肢を示すだけでなく、「参加したいがスケジュールが合わない」といった選択肢を設けて、ユーザーとコミュニケーションを取るきっかけを作るとよいでしょう。
まとめ
ウェブサイト改善、または、LP改善のPDCAサイクルに「ヒートマップ解析」を導入することのメリットの一つは、「根拠ある仮説をたくさん立てられるようになる」ことです。
PDCAサイクルは一般的に、「仮説立案 ⇒ 施策実装 ⇒ 効果検証」というプロセスをたどりますが、「仮説がなかなか立てられない」ということになると、その後の工程が回りません。PDCAを上手く回していくという観点から見て、「ヒートマップ解析」を導入することのメリットは大きいと言えます。
◆前編はこちらから
◆Twitter
お役立ち情報発信中です。フォローよろしくお願いします。
------------------------------------
ヒートマップ活用など、ご相談はサイトよりお願いします。
▼お問い合わせ
and,a（https://and-aaa.com/）
------------------------------------
この記事が気に入ったらサポートをしてみませんか？