ヒートマップとは何ですか? より多くのコンバージョンを獲得するために必要なすべて

公開: 2019-01-18

クリック後のランディングページは、強力なマーケティング説得ツールです。 適切に最適化されると、ページ要素の組み合わせとクリック後のランディングページ全体のデザインにより、訪問者にページでアクションを実行するように説得することができます。 無料トライアルへのサインアップからPDFのダウンロードまで多岐にわたります。

クリック後のランディングページを適切に最適化するにはどうすればよいですか?

最適化とは、キャンペーンまたはキャンペーンの一部(Webページ、広告、クリック後のランディングページ)を可能な限り完璧に近い状態に改善するプロセスとして定義されます。 最適化は、継続的なテストとデータ収集から始まり、それらの結果に基づいてキャンペーンを改善することで終わります。

翻訳–クリック後のランディングページのコンバージョンは最適化に依存し、クリック後のランディングページを最適化する方法は、クリック後のランディングページデータの収集方法に依存します。

データがなければ、ページで何が機能していて何が機能していないかを知る方法はありません。 収集できるデータには、主に2つのタイプがあります。

  1. 定量的データ
  2. 定性的データ

Google Analyticsなどの分析ツールは、平均ページ滞在時間、バウンス率、トラフィックチャネルなどの定量的データを収集するのに役立ちます。 定性的データは、訪問者のインタラクションの全容を理解するのに役立ち、ヒートマップを介して最も簡単に収集されます。

ヒートマップデータにより、マーケターは最適化の決定を下すことができ、クリック後のランディングページのコンバージョンを増やすことができます。 ヒートマップから収集されたユーザーデータを使用して、情報に基づいたA / Bテストを実行し、コンバージョン率を向上させることができます。

このマーケティングガイドでは、ヒートマップについて知っておく必要のあるすべてのことをお知らせします。 利用可能なヒートマップの種類から、ヒートマップをいつ使用すべきかを理解するために、クリック後のランディングページでヒートマップを作成するために使用できるツールのリストまで。

ヒートマップとは何ですか?

ヒートマップは、訪問者がWebページをどのように操作するかを示すデータの視覚的表現です。 クリックした場所とクリックしなかった場所を表示するなど。 典型的なヒートマップは次のようになります。

標準のヒートマップの例

ヒートマップは、暖色から寒色までのカラースペクトルを使用して、どのページ要素が最もユーザーの注目を集めたかを示します。

クリック後のランディングページで使用する場合、ヒートマップを使用すると、マーケターは、変換プロセスに支障をきたしているページに摩擦があるかどうかを特定できます。

デジタルマーケティングの摩擦は、ユーザーがコンバージョンする可能性を低くするコンバージョンプロセスの一部です。 クリック後のランディングページでの摩擦の例としては、フォームが長い、メッセージの一致が不十分、テキストが多すぎるなどが考えられます。 ヒートマップは摩擦を引き起こしている可能性のある要素を指摘しているため、A / Bテストを実行して、クリック後のランディングページのコンバージョン率を向上させることができます。
たとえば、ヒートマップは、訪問者がCTAボタンをクリックしていないのか、クリックできない要素をクリックしようとしているのかを判断できます。 収集された洞察は、ページをテストしてコンバージョン率を上げるために使用できます。

次の2つのことについてヒートマップを分析することにより、Webページがどれほど効果的であるかを判断できます。

  1. 訪問者が関与する情報の量:訪問者が実際に読んだページの量を調べます。この情報に基づいて、どのページ要素が適切に機能しているか、どのページ要素が機能していないかを評価できます。
  2. ユーザーはどのようなアクションを実行しますか:訪問者は何をクリックしていますか? CTAボタンをクリックしたり、フォームフィールドに入力したりしますか?

ヒートマップには基本的に4つのタイプがあります。

  1. クリック追跡ヒートマップ
  2. マップをスクロールする
  3. マウス追跡ヒートマップ
  4. アイトラッキングヒートマップ

1.ヒートマップの追跡をクリックします

クリック追跡ヒートマップは最も一般的なタイプのヒートマップであり、訪問者がクリック後のランディングページをクリックした場所に基づいてデータを記録します。

クリック追跡ヒートマップ

赤い点は、訪問者が最もクリックした領域を示しています。色が薄くなるにつれて、集中クリックの数は減少します。

クリックマップは、訪問者がクリック後のランディングページをクリックしたい場所をクリックしているかどうかを確認するのに役立ちます。 クリック後のランディングページでの訪問者のクリック数が最も多いのは、CTAボタンである必要があります。これは、CTAボタンがページ上で唯一クリック可能な要素であるためです。 (変換率は1:1、つまり変換目標ごとに1つのクリック可能な要素)。

2.マップをスクロールします

スクロールマップは、訪問者のスクロール動作を記録し、訪問者がページ上でスクロールした正確なポイントを確認するのに役立ちます。 このタイプのヒートマップは、ページの長さがユーザーエクスペリエンスに理想的かどうかを示します。
スクロールマップは通常、長い形式の販売ページに使用されます。
スクロールマップは次のようになります。

スクロールマップの例

スクロールマップは、ユーザーが読書プロセスでページを放棄している場所を示します。

このデータを使用して、ユーザーが特定のポイントまでスクロールダウンしている理由の仮説を作成し、この仮説を証明または反証するA / Bテストを作成できます。

たぶん、あなたのページには、光沢のないコピー、人々をオフにする画像、あるいは読みやすさの問題さえあります。

3.マウス追跡ヒートマップ/ホバーマップ

ホバーマップは、クリック後のランディングページでのユーザーのマウスの動きを示すヒートマップです。 ホバーマップの主な問題は、訪問者のマウスの動きを実際に見ているものと常に直接相関させることができないことです。 ユーザーのマウスが見出しに5分間留まったからといって、ユーザーがまだ見出しを読んでいるとは限りません。
ユーザーは、マウスが置かれている正確な場所を常に見ているわけではありません。 したがって、ホバーマップデータの信頼性には少し疑問があります。

グーグルのアン博士は、示したホバーヒートマップの精度に関する彼女の調査結果を発表しました。

  • マウスの動きと目の動きの間に垂直方向の相関関係を示したのはわずか6%であったため、94%の人々は相関関係を示しませんでした。
  • 19%の人が、マウスの動きと目の動きの間に水平方向の相関関係を示しました。
  • 10%の人が、ページの残りの部分を読み続けながら、特定のページ要素にカーソルを合わせました。

グーグルとカーネギーメロンの別の実験では、マウスの動きと目の動きの間に64%の相関関係があることがわかりました。

ホバーマップは次のようになります。

ホバーマップの例

クリックマップ、ホバーマップ、スクロールマップなどのマウス追跡ヒートマップには、次の長所があります。

  • マップは、ユーザーがクリック後のランディングページ要素をどのように操作するかに関するデータを受動的に収集します。
  • ヒートマップ分析を使用すると、クリック後のランディングページで、ユーザーエクスペリエンスとカスタマージャーニーに関連する複数の質問に答えることができます。
  • 顧客の行動についての仮定に頼る必要はありません。実際のデータを自由に利用できます。

クリックテールは、マウス追跡マップの長所と短所を次のように定義します。

マウス追跡の長所と短所

4.視線追跡ヒートマップ

アイトラッキングヒートマップは、ユーザーがクリック後のランディングページを見ている間のユーザーの目の動きを記録します。 通常、視線追跡研究は、参加者が眼球運動を正確に測定する特別な追跡装置を着用するラボで実施されます。 今日では、視線追跡の研究もウェブカメラを介して行うことができます。

訪問者がページのどこに焦点を合わせているかを調べることにより、訪問者の自然な視線経路に重要なページ要素を配置して、コンバージョン目標を達成する可能性を高めることができます。

アイトラッキングヒートマップデータを分析するときは、データを正しく読み取るために、何を見ているのかを正確に理解することが重要です。

アイトラッキングヒートマップの混乱の主な原因は時間枠です。

ユーザーが最初の3秒間にページをどのように見るかを示すヒートマップは、ユーザーが30秒間ページを見続ける場合と同じにはなりません。

以下の例は、時間枠がヒートマップの色にどのように影響するかを示しています。

ヒートマップの時間枠

アイトラッキングヒートマップとのもう1つの混乱の原因は、表示されている実際のデータです。

2種類の視線追跡ヒートマップ

アイトラッキングヒートマップには主に2つのタイプがあり、それらは大きく異なります。

  1. 凝視ボリュームヒートマップ:マップは、最も多くの眼の凝視を引き付けたページの部分を示します。 凝視は通常、ユーザーが1つのスポットを50ミリ秒以上見るたびに記録され、訪問者が特定のページ要素を見続けた頻度を測定します。
  2. 固定期間ヒートマップ:マップは、ページ上の特定の要素を見た時間を示します。

多くのマーケターは、データを誤って解釈する原因となる2種類の視線追跡調査を混同しています。

たとえば、固定ボリュームヒートマップは、クリック後のランディングページでどのページ要素が目立つか(つまり、最も目を引く)を理解するのに役立ちます。 固定期間のヒートマップは、より多くの時間を費やしたため、どの要素が最も魅力的であるかを示します。

アイトラッキングの研究により、一般的なユーザーの視線経路とページ全体の凝視の典型的な順序を理解することもできます。 彼らがあなたのページをFパターンで見ているのかZパターンで見ているのか。

アイトラッキングの長所と短所は、調査の実行に使用する方法によって異なりますが、一般的には、クリックやマウスの動きだけでなく、より多くの洞察を得ることができます。

アイトラッキングの欠点は主に実用性にあり、調査を行うには費用と時間がかかります。

次の3つの方法で、視線追跡ヒートマップを作成できます。

  1. 社内の視線追跡:視線追跡ヒートマップに必要な専門機器を購入して、ユーザーに社内のWebページを見てデータを収集するように依頼できます。
  2. ウェブカメラを使用したリモートアイトラッキング:これらのアイトラッキングヒートマップを実行するための専門的な機器は必要ありません。 参加者のWebカメラを使用して、クリック後のランディングページを見ているときに、参加者の視線追跡の動きを追跡できます。
  3. プロのアイトラッキングラボを使用する:プロのユーザーリサーチラボでアイトラッキングヒートマップスタディを実行できます。 プロのセットアップで実施されたテストは、正確な結果を生み出します。

ヒートマップの利点

ヒートマップは、訪問者の行動の視覚的なガイドを提供します。 訪問者の目を通してクリック後のランディングページを確認できるようにします。クリック後のランディングページの最適化を改善し、コンバージョンを増やすために必要な変更を加えるのに役立ちます。

ヒートマップがマーケターに提供するメリットの内訳は次のとおりです。

  1. マップはユーザーの行動を監視します
  2. ヒートマップを介して収集されたデータは、A / Bテストを実行し、ページを最適化し、コンバージョンを増やすために使用できます。
    ヒートマップを使用して、クリック後のランディングページでUXの決定を下すことができます

ヒートマップデータは、ユーザーの行動に関する次の質問に答えるのに役立ちます。

  • 訪問者は実際にクリック後のランディングページをどのように使用していますか?
  • クリック後のランディングページをどのようにナビゲートしますか?
  • 何が彼らの注意を引き、彼らはどこをクリックする傾向がありますか?
  • 彼らはどのページ要素を無視していますか?
  • 彼らは召喚ボタンをクリックしますか?
  • あなたのコピーはどれくらい魅力的ですか?
  • 訪問者に見逃してほしくないページ要素をどこに配置する必要がありますか?

これらの質問への回答により、訪問者の行動をより深く理解し、ページ上で変更する必要があるものがあるかどうかを確認できます。

ヒートマップのケーススタディ

このセクションには、さまざまなタイプのヒートマップがWebページでのコンバージョンの増加にどのように役立ち、ビジネスの成長につながるかについてのケーススタディが含まれています。

1.ソフトメディア

Softmediaは、ヒートマップを使用してWebページの摩擦領域を特定しました。

Softmediaヒートマップの例

10,000ページビューを超えるデータを収集した後、ヒートマップデータにより、ページに摩擦を引き起こしているいくつかの注意散漫が明らかになり、ユーザーは目的のアクションを完了できませんでした。

フォームをクリックする代わりに、ユーザーはページの「ここをクリックしないでください」ボタンに気を取られていました。 Softmediaが気を散らすものを取り除くと、コンバージョンは51%増加しました。

2.ペアリング

ペア(現在はカップル)は、クリック後のランディングページのクリックヒートマップを特徴としており、訪問者がページ上部のナビゲーションバーに気を取られていることを示していました。

元のクリック後のランディングページは次のようになります。

カップル投稿クリックランディングページ

クリックマップは次のとおりです。

カップルクリックマップ

ヒートマップ分析を確認した後、ペアはA / Bテストを実行して、ページから気を散らすもの(ナビゲーションリンク)を削除するとコンバージョンが増加するかどうかを確認しました。

ページからナビゲーションリンクを削除すると、コンバージョンが12%増加します。

3.オーガストアッシュ

August AshがWebページでヒートマップを実行したとき、対照的な赤色で設計され、実用的なコピーが含まれているにもかかわらず、訪問者がCTAボタンをクリックしていないことを発見しました。

オーガストアッシュホバーマップの例

CTAボタンでのホバーマップの読み取りが赤から緑にすばやく混ざり合っていることに注目してください。これは、スケールによると、訪問者の45〜60%だけがCTAボタンまでスクロールスルーすることを意味します。 CTAボタンの位置を折り目の下から折り目の上に変更すると、クリック数が増加し、コンバージョン数が増加しました。

4.Bluewireメディア

Bluewire Mediaはヒートマップを使用して、訪問者がページを1回クリックしたところ、リードキャプチャフォームにユーザーアクティビティがほとんどないことを確認しました。

BluewireMediaクリックマップ

ヒートマップ分析に基づいて、Web戦略会社はWebページを再設計することを決定しました。 そして、これらは彼らの新しいデザインが生成したヒートマップの色です:

BluewireMediaの再設計

画像とフォームのデザインを変更することで、フォームとCTAボタンのクリック数を増やすことができました。

これらのヒートマップの例は、ヒートマップが企業の成長を促進するのに役立つことを証明しています。 問題は今も残っています。すべてのマーケティング担当者はヒートマップの使用を開始する必要がありますか?

ヒートマップの使用に関する考慮事項

ヒートマップはコンバージョンの増加につながる貴重な洞察を提供しますが、誰もがクリック後のランディングページでヒートマップの実行を開始する必要はありません。

収集するヒートマップデータが正確であり、最も重要なのは一般化可能であることを確認するためです。 十分なサンプルサイズがあることが重要です。そのため、データに基づいてクリック後のランディングページに加えた変更は実際に機能します。

クリック後のランディングページに変更を加える前にヒートマップを正確に読み取るには、デバイスごとに少なくとも2,000〜3,000ページビューをデバイスごとに推奨します。 トラフィックが非常に少ないヒートマップデータに基づいてクリック後のランディングページ要素を変更しても、適切な最適化の決定を下すのに役立ちません。

ヒートマップは、クリック後のランディングページでのユーザーの行動を理解するための貴重なツールです。 しかし、それらはあなたのマーケティングの武器の唯一のツールであるべきではありません。 一人で撮った場合、彼らはユーザーエクスペリエンスの不完全な絵を描き、訪問者の行動を判断するために彼らだけに頼ることはあなたを誤解させる可能性があります。

有用ではありますが、ヒートマップはまだ制限されています。

たとえば、ヒートマップに、多くの訪問者が最初のフィールドを超えてフォームに入力していないことが示されている場合、これは必ずしも訪問者が最初のフィールドにのみ入力したことを意味するわけではありません。 これは、訪問者がマウスではなくキーボードを使用してフィールドをタブ移動したことも意味します。

この特定のケースでは、単にクリックマップを見るのではなく、ユーザーが各フォームフィールド内で費やした時間を測定する方がよいでしょう。

ヒートマップを作成するときは、全体像を確認してください。そうすれば、ヒートマップ分析から実際に利益を得ることができます。

ヒートマップはどのように使用できますか?

ヒートマップは、訪問者がページで実行するアクションと、訪問者を引き付けることができるページ要素を確認するための貴重なツールです。 ヒートマップは、ユーザーを引き付けるクリック後のランディングページを作成することにより、コンバージョンの過程を最適化するのに役立ちます。 PPCマネージャーは、マップを使用して、関連する専用のクリック後のランディングページに広告を接続することにより、広告のROIを向上させることができます。

コンバージョン率最適化(CRO)の実践者とPPCマネージャーの両方が、ヒートマップから収集したデータを次の3つの目的に使用できます。

  1. 訪問者の行動の追跡
  2. コンバージョン率の最適化のため
  3. UXの決定を下す

訪問者の行動の追跡

訪問者のアクティビティを追跡することは、ヒートマップを作成する基本的な目的です。 あなたとあなたの訪問者を分離する画面があるので、つまりあなたは彼らが何をしているかを物理的に見ることができません。 PPCマネージャーとCRO実践者は、ヒートマップ分析を使用して、訪問者がWebページでの行動をしている理由を理解します。

分析メトリックは、クリック後のランディングページの正確なトラフィック数と、それらの訪問者のうち、ページを放棄した訪問者の数を示します。 訪問者がページにアクセスしたときに何が起こるかを説明するのはヒートマップです。訪問者がクリックした場所、クリックしなかった場所、読んだもの、読んでいないものです。

ユーザーがそのように振る舞う理由を理解することは、ユーザーが摩擦なしにナビゲートしやすいと感じるクリック後のランディングページを作成するのに役立ちます。

コンバージョン率の最適化のため

コンバージョン率の最適化は、さまざまな最適化プロセスの助けを借りてリードを顧客に変換するという点で、マーケティングファネルが正常に機能することを保証する継続的なプロセスです。 これらのプロセスには、A / Bテスト、ヒートマップを使用したページ上のエクスペリエンスの向上、ユーザビリティテストなどが含まれます。

ヒートマップから収集された洞察を使用して、ハンチではなく実際のデータに基づく情報に基づいたA / Bテストを実行できます。

収益が増えると思われるという理由だけでA / Bテストを開始することはお勧めしません。ページ要素をランダムにテストしても、コンバージョンにはあまり効果がありません。代わりに、ユーザーデータを調べて、テストする必要のある正確な要素を確認する必要があります。 。

A / Bテストは常に仮説から始めてください。 テストしたいものなので、勝利のバリエーションを見ると、何が機能するかが正確にわかります。 クリック後のランディングページをランダムにA / Bテストしないでください。特定のアイデアを念頭に置いて開始してください。仮説は、ヒートマップ分析から収集された洞察に基づいています。

UXの決定を下すには

ヒートマップを使用できるもう1つの方法は、クリック後のランディングページでユーザーエクスペリエンス(UX)を決定することです。 訪問者がクリック後のランディングページをどのように見るかについて推測する代わりに、ページ上のエクスペリエンスがどのようであったかに関するリアルタイムデータを収集できます。

このデータは、優れたユーザーエクスペリエンスを備えたページを作成するのに役立ちます。

クリック後のランディングページでヒートマップの使用を開始する

ユーザーが広告に関連性があると感じてクリックするとどうなりますか?

クリック後の旅は、クリック後のランディングページに到達したときに始まりますが、ページにアクセスしただけでは、CTAボタンをクリックする保証はありません。

クリック後のランディングページを作成するだけでは不十分です。 クリック後のランディングページでコンバージョンを獲得するには、訪問者向けにクリック後のランディングページが最適化されていることを確認する必要があります。

クリック後のランディングページデータを収集すると、そのために役立ちます。 ヒートマップは、クリック後のランディングページで訪問者がどのように行動しているかを示す定性的データを収集するのに役立ちます。 したがって、機能していない要素をテストできます。

クリック後のランディングページにヒートマップを作成するために使用できるさまざまなヒートマップツールがあります。最高のツールのいくつかは次のとおりです。

Hotjar

Hotjarを使用すると、ユーザーをすばやく視覚的に理解できます。 このツールを使用して、視覚的なフィードバックを即座に取得し、人々が実際にWebサイトをどのように使用しているかを確認し、洞察を明らかにして適切な変更を加えることができます。
Hotjarを使用して、クリックマップの作成、ヒートマップの移動、ヒートマップのスクロールを行うことができます。

Smartlook

Smartlookを使用すると、ユーザーはWebサイトやモバイルアプリの定性分析を収集できます。 明確で視覚的な洞察の助けを借りて、ユーザーの行動の「理由」を理解することができます。
Smartlookのヒートマップ機能は、UXの洞察を収集し、ユーザーの行動をよりよく理解するのに役立ちます。 Smartlookを使用して、新規およびリピーター向けのスクロールヒートマップ、移動ヒートマップ、クリックマップ、およびヒートマップを作成できます。

インスタページ

クリック後のランディングページにヒートマップを作成し、その情報を分析指標と組み合わせる場合は、Instapageヒートマップビジュアライザーを使用するのが最善の策です。 Instapageのヒートマップ機能は、A / Bテストするページ要素を決定するために必要な超特定の情報を提供します。

ヒートマップビジュアライザーは、マウスの動き、クリック、スクロールの深さなど、3-in-1の追跡機能を提供します。 訪問者がページで最も時間を費やしている場所、クリックした要素、スクロールした距離をよりよく理解できるため、クリック後のランディングページをコンバージョンに合わせて最適化できます。

プラットフォーム内のマップは次のようになります。

マウス動作

Instapageマウスの動きの例

地図をクリック

インスタページクリックマップ

地図をスクロールする

地図をスクロールする

Instapageプラットフォームでヒートマップを作成するには、次の手順に従います。

ヒートマップにアクセスするには、プレビューモードでページを開きます。 これは、ページビルダーから、右上隅の[プレビュー]ボタンをクリックして行うことができます。

インスタページダッシュボード

ページを公開しない場合は、ダッシュボードからプレビューモードにアクセスすることもできます。[ページのプレビュー]をクリックするだけです。

プレビューモードダッシュボード

プレビューモードになったら、トグルをクリックしてヒートマップモードを有効にします。

ヒートマップ有効化モード

そして今、あなたはあなたのページで訪問者の行動を見ることができます:

ヒートマップデモ

左上隅の火のアイコンの上にマウスを置くと、ここからヒートマップメニューが開き、3つの追跡メトリックを切り替えることができます。

ヒートマップメニュー

1.スクロールの深さを使用すると、訪問者がページをさらに下にスクロールしたかどうかを確認できます。

スクロール深度のアクティブ化

2.クリックすると、訪問者がクリックした要素が表示されます。

スクロール深度マップ

3.マウスを動かすと、クリック後のランディングページで、訪問者が最も時間を費やしている場所を確認できます。

地図の例をクリック

ヒートマップは、Webページ上の訪問者の行動を分析するために使用されます。 ヒートマップを介して収集されたデータにより、訪問者がページ要素を操作するときに摩擦に直面しているかどうかを判断できます。 この情報を使用して、ワイルドな推測ではなく実際のユーザーデータに基づくA / Bテストを作成できます。

Instapage Heatmap Visualizerツールを使用すると、外部ツールにサインアップして料金を支払うことなく、クリック後のランディングページにヒートマップを作成できます。 スクロールマップ、マウス移動マップ、クリックマップを作成して、クリック後のランディングページで訪問者がどのように行動するかを理解し、コンバージョンに合わせて最適化します。

ヒートマップビジュアライザーが、コンバージョン率の高いクリック後のランディングページの作成にどのように役立つかをご覧ください。 こちらからエンタープライズデモにサインアップしてください。