ヒートマップを使用してWebサイトの全体的な品質を向上させる方法

公開: 2020-01-13

ヒートマップは非常に便利なツールです。 それらは、単なる数字では表現するのが難しいことが多い方法で、Webサイトでのユーザーの行動を追跡することを可能にします。 ヒートマップを使用すると、コンテンツを介した訪問者の旅を視覚化できます。 これにより、問題点をすばやく特定できるため、問題点のエクスペリエンスを向上させることができます。

WordPressはすぐに使用できるヒートマップ機能を提供していませんが、プラグインを使用して簡単にWebサイトに追加できます。 この記事では、ヒートマップがどのように機能するか、ヒートマップを使用する必要がある理由、およびWordPressユーザーとしてのオプションについて詳しく説明します。

それを手に入れよう!

ヒートマップの概要

最近では、訪問者がWebサイトでどのように行動するかに関するあらゆる種類のデータを追跡できます。 どのページに最も時間を費やしているか、どのリンクを操作しているか、各ページをどれだけ下にスクロールしているかなどを確認できます。

そのデータのほとんどは、数字の形であなたに届きます。 場合によっては、それが何を意味するのかを視覚化するのが難しいことがあります。 たとえば、どのページが最も人気があるかを知っている場合があります。 しかし、それはその特定のコンテンツが訪問者の共感を呼ぶ理由については何も教えてくれません。

ヒートマップを使用すると、Webサイトの分析の一部を視覚的に表現することで、別のアプローチをとることができます。 ほとんどの場合、その表現はページの上部にオーバーレイの形で表示されます。

クリックヒートマップの例。

上のスクリーンショットでは、ページの特定の領域が暖かい色で強調表示されていることがわかります。 ヒートマップは、冷たい色から暖かい色に移動する単純な色のグラデーションを使用します。 色が「熱い」ほど、ページの特定の部分がより多くの注目と相互作用を獲得しています。

前の例は、「クリック」ヒートマップと呼ばれるものを示しています。 使用できるヒートマップにはいくつかの種類がありますが、他の種類については後で詳しく説明します。 クリックヒートマップを使用すると、ページの訪問者が最も関心を持っている要素を視覚的に表現できます。

クリックヒートマップの例。

最新の分析ツールのほとんどは、データのライブラリ全体をあなたに投げかけます。 ただし、ヒートマップを使用すると、ユーザーの行動をより直感的に把握できます。 ページ上のどの要素が最も注目を集めているかを一目で判断できれば、そのデータから収集できる多くの洞察があります。

先に進む前に、ヒートマップはWebサイト分析のための優れたツールではないことに言及することが重要です。 ヒートマップは、天気予報から統計分析、金融市場の視覚化など、いたるところにあります。 これらのアプリケーションは興味深い読み物になります。 ただし、ここではWebサイトについて説明しているので、そのユースケースの利点について説明しましょう。

ヒートマップがWebサイトの品質向上に役立つ理由

前に述べたように、ヒートマップは、別の角度からWeb分析にアプローチしたい場合に最適です。 優先する情報に応じて、使用できるヒートマップにはいくつかの種類があります。

クリックヒートマップについてはすでに説明しました。 十分なデータがある場合、ヒートマップをクリックすると、ページのどの領域が「ホットスポット」であるかがわかります。 理想的には、これらのホットスポットを、召喚状(CTA)、製品、リンクなどの重要な要素と並べておく必要があります。

クリックマップの例。

ページの主要な要素を取り巻く十分なアクティビティが表示されない場合は、ユーザーエクスペリエンス(UX)の問題、最適化の問題、コピー不良、およびその他のさまざまな原因を示している可能性があります。 それは私たちに重要なポイントをもたらします-ヒートマップはあなたが修正する必要があるものを正確に教えてくれません。 しかし、彼らはあなたを正しい方向に向ける素晴らしい仕事をします。 ニュースレターの登録ボタンのアクティビティが少ない場合は、それをテストして対処する必要がある要素であることがわかります。

次に進むと、「スクロール」ヒートマップを使用することもできます。 このタイプのヒートマップは、訪問者がバウンスする(ページを離れる)前に、訪問者がどれだけ下にスクロールしているかを示します。

スクロールヒートマップの例。

理想的には、マップの暖かい領域をできるだけ下に配置するか、ページの主要な要素とCTAが配置されている場所に揃えます。 暖かい領域が上部にある場合、それは通常、ページのUXの問題を示しています。 長い形式のコンテンツの場合、ヒートマップに訪問者が読み続けるために下にスクロールしていないことが示されている場合は、コンテンツ戦略を再考することをお勧めします。

ユーザーアクティビティに関するより具体的な情報が必要な場合は、紙吹雪レポートの方がお好みかもしれません。 このタイプのヒートマップは、ページ全体での個々のクリックを示します。 エリアが暖かいほど、より多くのユーザーがクリックします。

紙吹雪ヒートマップの例。

紙吹雪レポートは、訪問者がクリックする正確な要素を把握するのに非常に役立ちます。 多くの場合、ユーザーインタラクティブではない要素をクリックしようとしていることに気付くでしょう。 これは、設計の選択が不十分であることを示している可能性があります。

このタイプのヒートマップは、オンラインストアを運営している場合、チェックアウトプロセスに関する優れた洞察を提供することもできます。 チェックアウトエクスペリエンスを可能な限り合理化する必要があります。購入時に訪問者が何をクリックするかを把握することで、チェックアウトを完成させることができます。

特にA / Bテストを定期的に実行している場合、ヒートマップを使用してもメリットが得られないWebサイトはほとんどありません。 A / Bテストとヒートマップを組み合わせると、ページのどのバージョンがターゲットオーディエンスに対してより優れたパフォーマンスを発揮するかについて、迅速かつ正確な洞察を得ることができます。

もちろん、ヒートマップが正確な情報を提供するためには、十分なデータが必要です。 一握りの訪問者はあなたの聴衆の正確な表現ではありません。 データに基づいて意思決定を行う場合は、統計的に関連している必要があります。 したがって、できるだけ早くヒートマップソリューションを設定することをお勧めします。 次に、ユーザーの行動を追跡し、正確な結果を生成するために十分な時間を与える必要があります。

WordPress用の3つのトップヒートマッププラグイン

ヒートマップが機能するにはデータが必要です。 つまり、Webサイトと統合し、ユーザー情報を収集し、それに基づいてヒートマップを生成する分析エンジンが必要になります。 それを念頭に置いて、WordPressユーザー向けのトップソリューションのいくつかを見てみましょう。 ここで取り上げる3つのプラグインのうち2つでは、サードパーティのサービスにサインアップする必要があります。 したがって、オプションを評価する際には、このことを念頭に置いておく必要があります。

1.オーロラヒートマップ

Auroraヒートマッププラグイン。

Aurora Heatmapは、サードパーティのプラットフォームにサインアップする必要がない、唯一推奨されるWordPressヒートマッププラグインです。 Aurora Heatmapを使用すると、プラグインを設定するだけで、すべてのページのクリックヒートマップにアクセスできます。 さらに、コンテンツのデスクトップバージョンとモバイルバージョンの両方について、個別のヒートマップを表示できます。

プラグインのプレミアムバージョンには、スクロールヒートマップも含まれており、データをより長く保持します。 データ保持は、ユーザーが時間の経過とともにページの複数のバージョンにわたってどのように異なる動作をするかを分析できるため、便利です。

主な機能:

  • ページのクリックヒートマップを設定する
  • デスクトップとモバイルの両方のヒートマップを生成する
  • ページのクリック数を追跡します

価格:無料、プレミアムプランは月額19.90ドルから| 詳しくは

2.クレイジーエッグ

CrazyEggプラグイン。

Crazy Eggは、追跡スクリプトまたは公式プラグインのいずれかを使用して、WordPressと統合できるヒートマップおよびA / Bテストサービスです。 Webサイトにコードを追加することに抵抗がない場合は、前者のアプローチを使用することをお勧めします。 結局のところ、プラグインの唯一の目的は、追跡スクリプトを追加することです。

Crazy Eggアカウントを設定し、WordPressと完全に統合すると、クリック、スクロール、紙吹雪のヒートマップを生成できます。 さらに良いことに、このプラットフォームでは、個々のユーザーセッションを記録できます。

つまり、データの内容の解釈に問題がある場合は、実際のユーザーセッションに飛び込んで、それらの動作を確認できます。 ただし、外部サービスについて話しているので、CrazyEggプラットフォームからヒートマップとユーザー記録にアクセスする必要があります。

主な機能:

  • ページのクリック、スクロール、紙吹雪のヒートマップを生成する
  • スクリプトまたはプラグインのいずれかを使用してWordPressと統合する
  • 個々のユーザーセッションを記録する

価格:プラグインは無料で、CrazyEggのプランは月額$ 24から始まります| 詳しくは

3.Hotjar

Hotjarプラグイン。

Hotjarは、ヒートマップ、ユーザーレコーディング、コンバージョン分析、および調査に重点を置いたWeb分析プラットフォームです。 プラグインが行うことは、一意のサイトIDを使用して、HotjarアカウントをWordPressと統合するのに役立ちます。

WordPressをHotjarと統合すると、ページのクリック、スクロール、および「移動」ヒートマップを生成できます。 このプラットフォームを使用すると、デスクトップページとモバイルページだけでなく、各タイプのヒートマップ間をすばやく移動できます。 以前のプラグインと同様に、Hotjarもユーザーセッションを記録します。 また、メモを取ったり、ビデオにタグを付けたりして、簡単に分類することもできます。

主な機能:

  • クリック、スクロール、および移動ヒートマップを生成する
  • ほんの数分でプラグインを使用してWordPressと統合する
  • すべてのヒートマップのモバイルバージョンとデスクトップバージョンを確認します
  • 個々のユーザーセッションを記録する

価格:無料プランが利用可能で、プレミアムオプションは月額$ 29から始まります(プラグイン自体も無料です)| 詳しくは

Google Analyticsを使用してヒートマップを生成できますか?

ご存知のように、ヒートマップを生成するには、分析エンジンが必要です。 Google Analyticsが市場で最も人気のあるオプションであることを考えると、それを使用することは理にかなっています。

ただし、ここに問題があります。GoogleAnalyticsは、すぐに使用できるヒートマップ機能を提供していません。 プラットフォームが提供するデータの量を考えると、これは大きな問題ではありません。 ただし、 2番目の分析エンジンをWebサイトに追加することを検討していない場合は、問題が発生します。

GoogleAnalyticsを使用して基本的なヒートマップを生成できるようにするいくつかの回避策があります。 たとえば、Google Tag Managerを使用してクリックイベントを追跡し、DataStudioで視覚的なレポートを生成できます。 このアプローチの利点は、Googleファミリー以外の外部サービスを使用する必要がないことです。 ただし、非常に単純なヒートマップ以外のものを生成することはほぼ不可能です。

2番目の選択肢は、GoogleAnalyticsとの基本的な統合を提供するCrazyEggなどのサービスを使用することです。 Crazy Eggは、無料のGoogleAnalyticsヒートマップジェネレーターを提供しています。 必要なのは、GoogleAnalyticsアカウントへのアクセスだけです。 次に、クリックヒートマップを生成するために必要なデータをフェッチできます。

CrazyEggヒートマップジェネレータ。

これは、まだいくらか制限されている場合でも、便利なアプローチになる可能性があります。 全体として、より高度なヒートマップにアクセスしたい場合は、GoogleAnalyticsと一緒に使用する追加のサービスにサインアップすることをお勧めします。

結論

おそらく、訪問者の行動を洞察するために、すでに分析ツールを使用しています。 最新の分析プラットフォームでは、解釈が難しいほど多くの情報にアクセスできます。 ヒートマップは、チャートやグラフよりもインタラクティブで視覚的な方法で、そのデータを取得して理解するのに役立ちます。

すでにGoogleAnalyticsを使用している場合、悪いニュースは、サービスがすぐに使えるヒートマップ機能を提供しないことです。 WordPressサイトのヒートマップにアクセスするには、Aurora Heatmap、Hotjar、CrazyEggなどのプラグインを使用する必要があります。 幸い、これらのソリューションはセットアップと使用が簡単です。

WordPressでヒートマップツールを使用したことがありますか?また、どのような経験をしましたか? 下のコメント欄で話しましょう!

octomesecam /shutterstock.comによる記事のサムネイル画像