無料で利用できるヒートマップツール「Clarity」のアカウント作成方法

ヒートマップツールは、視覚的に、サイト内でのユーザーの行動（どこまで閲覧したか？、クリックされた箇所など）に関するデータを取得することができるツールです。

ヒートマップツールを利用することで、Google アナリティクスなどの解析ツールとは異なり、ユーザーの滞在箇所やクリックされる箇所などを色で表示されているため、専門的な知識がなくても簡単にユーザーの行動を把握することができ、ページの改善につなげることができます。

有料で提供されているツールもありますが、 Microoftが無料で使用することができるヒートマップツール「Clarity」を提供してくれています。

今回は、無料で使用できるヒートマップツール「Clarity」の導入方法を図解でわかりやすくご紹介いたします。
ぜひ、参考にしていただきみなさんのサイトに導入されてみてはいかがでしょうか？

Clarityアカウントの作成

まずは、Clarityにログインするためのアカウントの作成を行う必要があります。
ここからは、Clarityのアカウントの作成方法をご紹介いたします。

1.Clarityのサイト上部にある「サインアップ」をクリックしてください。

Clarity：https://clarity.microsoft.com/

2.サイト上部の「サインアップ」をクリックすると、サインアップするために連携するためのアカウントが表示されます。

サインアップするためのアカウントは、「Microsoft」「Facebook」「Google」の3種類があります。

3.今回は、Googleアカウントでサインインしていきます。

4.「Clarityに同意します」をクリックし、続行をクリックしてください。

5.プロジェクトを作成するサイトの名前とWebサイトのURLを入力し、「新しいプロジェクトを追加する」をクリックします。

6.今回は、Google タグマネージャーを使用し、Clarityのインストールを行います。

7.「今すぐつながりを申請」をクリックしてください。

8.インストールを行うGoogle タグマージャーの「アカウント」と「コンテナー」を選択してください。

9.Clarityと連携を行うGoogle アナリティクスの設定を「開始する」をクリックします。

10.今回、計測を行いたいサイトを選択してください。

11.Google タグマネージャーとGoogle アナリティクスの設定が完了しましたら、プロジェクトの作成が完了となります。

Clarityのトラッキングコードの設置方法

ここからは、Clarityを実際に使用していくための設定についてご紹介いたします。
今回は、Google タグマネージャーでの設置方法についてご紹介していきます。

もし、まだGoogle タグマネージャーを導入していないという方がいらっしゃいましたら、下記記事を参考に導入されてみてはいかがでしょうか？

【実践】Googleタグマネージャーとは？設定・導入・ログイン方法などの入門編

Google タグマネージャーの設定方法

それでは、早速、Google タグマネージャーでの「Crarity」のトラッキングコードの設定方法についてご紹介していきます。

1.Google Tag Manager にサインインしてください。

Google タグ マネージャーのワークスペースで、[新しいタグ] を選択します。

2.[名前] フィールドで、タグに任意の名前を付けます。例）Clarity タグ

[タグの設定] パネルを選択して、「Clarity」のタグの設定を行います。

3.[タグタイプを選択] パネルから、[コミュニティ テンプレート ライブラリで他のタグを検出する] を選択します。

4.「タグテンプレートのインポート」で、「clarity」を検索します。

5.[Microsoft Clarity – Official] を選択してください。

6.「テンプレートの詳細」の上部にある、「ワークスペースに追加」をクリックしてください。

7.[タグの構成] ページで、Clarity プロジェクト ID を入力

今回計測するClarityプロジェクトのIDを、Google タグマネージャーに設定する必要があります。

ClarityプロジェクトのIDは、ブラウザーのアドレスバーのプロジェクトURLに記載があります。
例: https://clarity.microsoft.com/projects/view/projectid/

8.「トリガー」をクリックし設定を行います。

9.[トリガーの選択] パネルで、[All Pages]を選択してください。

10.トリガーが追加されましたら、右上の[保存]ボタンから保存を行ってください。

11.Google タグマネージャーのワークスペースページ上部の[公開]をクリックすることで、Clarityのタグ設定は完了となります。

設定完了からデータ反映まで約2時間程度かかります。

IPアドレスのブロック

Clarityでは、特定のIPをブロックすることが可能です。
社内のIPや制作会社などのパートナー会社のIPを登録しておくことで、より正確なヒートマップの結果を取得することができるようになります。

まとめ

今回は、Clarityの設定方法についてご紹介させていただきました。
アクセス数や売上の向上を目指し、みなさんのサイトに導入されてみてはいかがでしょうか？

ウェブ広告をはじめ、ウェブマーケティングに関する不安や疑問を無料でスッキリ解決しませんか？

当社では、事業会社様向けにデジタルマーケティングについてのお悩み、貴社の課題に
対して専任のコンサルタントによる無料の個別相談会を毎週金曜に定期開催しております。

運用型広告に関するお悩みごとだけでなく、マーケティングから技術的なことまでお気軽にご相談ください。