ヒートマップとはなにか?
ヒートマップは、Webサイトの訪問者がどのようにページを閲覧しているかを視覚的に分析するためのツールです。ページ上の要素がクリックされた回数や、ユーザーがどの部分に滞在した時間が多いかを色分けして表示することで、ユーザーの行動パターンを把握することができます。
ヒートマップを使うことで、以下のことがわかります。
ユーザーがどの要素に興味を持っているのか
クリックされた回数が多い要素は、ユーザーが興味を持っている要素である可能性が高いといえます。
例えば、具体的な商品ページであれば、商品画像や購入ボタンがどのくらいクリックされているのか、可視化することによって、どのくらいのユーザーがその商品に興味を持っているかを把握することができます。
ユーザーがどの部分で離脱しているのか
滞在時間が短い部分や、スクロールダウンしていない部分は、ユーザーが興味を持っていない部分であるということがわかりますし、さらに、Webサイトを離脱する部分を把握することによって、ユーザーがどの程度そのWebページに興味を持っているのかを把握することができます。
ユーザーの閲覧経路
ユーザーがWebページの中でどのようにマウスカーソルを動かしているのか、どのような順番でどこをクリックしているのか、などを分析することで、ユーザーがどのようにページを閲覧しているかを知ることができ、ページ全体の構成や導線を把握することができます。
デバイスごとの閲覧傾向
パソコンとスマートフォンでユーザーの行動パターンが異なる場合があるため、デバイスごとにヒートマップを分析することで、より詳細な分析を行うことができます。
また、レスポンシブデザインの Web サイトであれば、各デバイスで正しく表示されているかどうかを確認することができます。
Microsoft Clarityとは?
Microsoft Clarityは、Microsoftが提供する無料のヒートマップツールです。他のヒートマップツールと比べて以下の特徴があります。
セッション数無制限
多くのヒートマップツールは、月間セッション数に制限がありますが、Microsoft Clarityは、ページ数、PV数、期間ともにセッション数無制限で利用することができます。
録画機能
ユーザーの画面操作を録画し、マウスの動きやクリック箇所などを確認することができます。これは、ユーザーの行動をより詳細に分析したい場合に役立ちます。
属性分析
ユーザーの性別、年齢、地域、デバイスなどの属性に基づいて分析を行うことができます。これにより、特定の属性のユーザーの行動パターンを分析することができます。
A/Bテスト機能
異なるバージョンのページを作成し、ユーザーの反応を比較することができます。これは、Webページの改善施策の効果を検証したい場合に役立ちます。
GDPR/CCPA準拠
ユーザーデータはEU一般データ保護規則(GDPR)やカリフォルニア州消費者情報保護法(CCPA)に準拠して保護されています。
Microsoft Clarityの導入手順
Microsoft Clarityを導入方法は以下の通りです。
Microsoft ClarityのWebサイトにアクセスします。
https://clarity.microsoft.com/ にアクセスし、「使い始める」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/bde36f095ff03689875820d1d2c4ee79-1024x536.png)
サインアップの方法を選択します
Miceosoft Clarityには、Microsoftアカウント、Facebookアカウント、Googleアカウントのいずれかでサインアップすることができますので、お手持ちのアカウントでサインアップします。
いずれも持っていない場合は、任意のアカウントを用意してから再度サインアップします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/a5d41ddd1b5322ee2a10b7b652443379-1024x538.png)
Microsoftアカウントを選択する場合は、以下のような画面が表示ますので、サインアップしたいMicrosoftアカウントを選択します。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/411a9d457df147eb503545dcef62746c-1024x721.png)
Facebookアカウントを選択する場合は、以下のような画面が表示ますので、サインアップしたいFacebookアカウントを選択し、「次へ」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/3ca38a735b62a07804d33c8bf6be4596-1024x351.png)
Googleアカウントを選択する場合は、以下のような画面が表示ますので、サインアップしたいGoogleアカウントを選択し、「次へ」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/8fd8584f387edfbe2272ad09106fc8cb-1024x634.png)
Microsoft Clarityを使って測定したいWebサイトのURLを入力します。
サインアップが完了すると、新しくプロジェクトを作成する画面が表示されます。
Microsoft Clarityを使って測定したいWebサイトの情報を入力します。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/3c8b8e31d4285794ff24abfbe7b2ed77-1024x543.png)
「新しいプロジェクトを追加する」をクリックすると、トラッキングコードが発行されます。
取得したトラッキングコードをWebサイトに設置します
作成したプロジェクト一覧が表示されますので、トラッキングコードを設置したいプロジェクトをクリックし、ダッシュボードを開きます。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/d6fe320e4597daf6e3849d7450c36bb0-1024x493.png)
プロジェクトのダッシュボードが表示されたら、上部メニューから「設定」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/b5c83b8f3545c722d8f711d5b16d7d67-1024x198.png)
左メニューから「セットアップ」を選択し、「インストール方法」の項目からトラッキングコードを設置する手段を選択します。ここでは「手動でインストールする」方法を選び、「追跡コードを取得する」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/bd612761cdcd27c3d1cfd6a04d124517-1024x540.png)
トラッキングコード(Clarityコード)が表示されますので、「クリックボードにコピー」をクリックしてトラッキングコードをコピーし、測定したいWebサイトのheadタグ終了直前にペーストして、設置完了です。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/ada7a456235302875dfd9b2e9d69eda4-1024x509.png)
サードバーティのプラットフォームにインストールしたい場合は、「すべてのプラットフォームを表示」をクリックします。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/c70a7d7d699d2ea60a8d75df010ab816-1024x549.png)
利用しているプラットフォームを選択し手順通りセットアップを進めます。
ここではGTM(Googleタグマネージャー)を利用したい場合などはこちらの手順を使います。
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/1b6ddc44dbf0fe1adf530adedda9e0c8-1024x553.png)
以上でMicrosoft Clarityの導入は完了です。
計測開始されるまで、通常、数時間かかりますので、ある程度時間が経ったら、トラッキングデータが計測されているか確認してみましょう。
Microsoft Clarityの使い方
Microsoft Clarityにログインすると、以下の画面が表示されます。
ダッシュボード
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/82e20aea523483c455fe7b4a7fa97008-1024x549.png)
訪問者数、セッション数、平均滞在時間などの基本的な指標が表示されます。
また、ユーザービリティの低下につながる可能性のある原因を把握することもできます。
レコーディング
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/2e21ba2d2965d9128900dfd1fd3eb90e-1024x513.png)
特定のユーザがサイト上でどんな操作をしたのかを、録画された動画でセッション単位で確認できます。
何ページ見たのか、滞在したトータル時間、クリックした数、閲覧したデバイスやOSなども記録されているほか、訪れた最初のページから閲覧を終了したページまで、一連の行動履歴が記録されています。
ヒートマップ
![](https://www.e-bird.biz/cms/wp-content/uploads/2024/05/41d1fc4aae2097a65cb1a5e8c51d4f51-1024x447.png)
デバイスごとにクリックされた回数や、ユーザーがどの部分に滞在した時間が多いかを色分けして表示します。
- クリックヒートマップ
ユーザーがWebページ内のどこを何回クリックしたのか可視化されます。
ユーザーがどの部分に興味を持っているのかを把握することができます。 - スクロールヒートマップ
ユーザーがページをどこまで見ていのか可視化されます。
ページ全体の読了度や、ユーザーの興味の範囲を把握することができます。 - 領域ヒートマップ
ユーザーがどの部分に滞在した時間が多いかを色分けして表示します。
ユーザーがじっくり読んでいる部分や、興味を持っているコンテンツを把握することができます。
各画面には、詳細な情報を確認するためのフィルターやオプションが用意されていますし、測定しているWebページの項目からダッシュボード、レコーディング、ヒートマップそれぞれのページにすぐにアクセスできるようになっていてとても便利です。
まとめ
ヒートマップは、Webサイトの改善に役立つツールです。Microsoft Clarityは、セッション数無制限、録画機能、属性分析など、他のヒートマップツールにはない多くの機能を搭載しており、無料で利用できるため、Webサイトの改善を検討している方におすすめです。
ぜひ、Microsoft Clarityを使って、ユーザーの行動パターンを分析し、より良いWebサイトを目指しましょう。