Microsoft Clarityとは
Microsoft Clarityは、Microsoftが無料で提供している、ヒートマップと操作の録画でサイト訪問者の動きを見るツールで、アクセス数の上限やデータの間引き（サンプリング）がありません。公式のよくある質問では、Clarityは永久に無料で、アクセス数の上限によって有料版への切り替えを求められることはないと説明されています。
Clarityでできることは、大きく3つです。
| 機能 | わかること | 主な使いどころ |
|---|---|---|
| ヒートマップ | どこまで読まれたか（スクロール）、どこが押されたか（クリック）、範囲ごとの押され方（エリア） | LPの直す場所を見つける |
| 録画 | 1人ずつの操作（スクロール・タップ・入力）の再生 | 気になった場所で何が起きたかを確かめる |
| インサイト | 反応のないクリック、同じ場所の連打、すぐ戻る動き | 使いにくい場所を自動で見つける |
GA4とは役割が違います。GA4は「何人が来て、何件申し込んだか」を数えるツールで、Clarityは「ページの中でどう動いたか」を見るツールです。申込が少ない理由を探すときは、GA4で問題のページを見つけ、Clarityでそのページの中を見る、という使い分けになります。
導入の手順（3ステップ）
Clarityは、プロジェクトを作り、計測コードをサイトに入れ、データが届くのを確認する3ステップで使い始められます。公式の手順では、計測コードを入れた直後からデータを見られると説明されています。
- Clarityにログインし、「新しいプロジェクト」からサイト名・URL・サイトの種類を入れてプロジェクトを作ります。
- 計測コードを入れます。方法は、ページの
<head>に貼る、WordPress などの連携を使う、Google タグマネージャー（GTM）で配信する、のいずれかです。GTM を使っている場合は、Clarity の設定画面で GTM との連携が自動で見つかります。 - データが届くか確認します。Clarity のダッシュボードにライブの利用者数が出るか、ブラウザの開発者ツールで
https://www.clarity.ms/collectへの送信があるかを見ます。
注意点が2つあります。1つは、Clarityは既定で、サイト上の機密性の高い内容を隠して（マスクして）記録することです。もう1つは、公式の手順で、18歳未満を対象にしたサイトやアプリでは使わないよう書かれていることです。
ヒートマップは「スクロール → クリック → 録画」の順に見る
Clarityのヒートマップは、どこまで読まれたか（スクロール）を先に見て、次にどこが押されたか（クリック）を見て、気になった場所だけ録画で確かめる順番が効率的です。読まれていない場所のクリックを見ても判断できないため、まずは読まれている範囲を確かめます。
Clarityのヒートマップには、クリック・スクロール・エリア・コンバージョン・アテンションの5種類があります。最低アクセス数の決まりはなく、アクセスが少ないページでも作れます。LPの改善で最初に使うのは、スクロールとクリックの2つです。
スクロールマップ：色が変わる位置と、大事な情報の位置を比べる
スクロールマップは、ページのどこまで読まれたかを色で表した図で、暖色ほど多くの人が見た場所、寒色ほど見た人が少ない場所です。公式の説明では、図にマウスを乗せるとその位置まで到達した人の割合が表示され、左側のパネルではページの長さの5%刻みで到達率と離脱率を確認できます。
見るポイントは3つです。
- 平均のファーストビュー（Average fold）：スクロールする前に平均して見えている範囲です。ここに何を置くかで、読み進めてもらえるかが変わります。
- 色が変わる位置：読む人が大きく減る場所です。直前に置いている内容が、離脱のきっかけになっている可能性があります。
- 大事な情報の位置：申込フォームや申込ボタン、価格などが、どの色の場所にあるかを確認します。青い場所にあれば、ほとんどの人に見られていません。
スマホとPCは、画面の大きさが違うため結果も変わります。Clarityはパソコン・タブレット・スマホを切り替えて表示できるので、必ず分けて見てください。
クリックマップ：押されている所と、押されていない申込ボタン
クリックマップは、ページのどの部分がどれだけ押されたかを表す図で、申込ボタンが押されているか、押される予定のない場所が押されていないかを確かめるのに使います。Clarityのクリックマップは、画面上の位置ではなくページの要素ごとに集計するため、画面サイズが違う端末のデータもまとめて見られます。
確認する順番は、次のとおりです。
- 申込ボタン・電話ボタンが押されているか（押されていなければ、見つけにくいか、押す理由が足りない）
- リンクのない画像や文字が多く押されていないか（訪問者が「もっと見たい」と思っている場所）
- メニューや戻るボタンばかり押されていないか（探している情報が見つかっていない）
「押したのに反応しない」を見つける（デッドクリック・レイジクリック）
Clarityは、使いにくさのサインになる動きを自動で見つけ、ダッシュボードの「インサイト」に表示します。公式の定義は次のとおりです。
| 用語 | 公式の説明（要約） | LPで多いときに疑うこと |
|---|---|---|
| デッドクリック | 要素を押しても、見た目が変わらず、ページも移動しないクリック | 写真や見出しが「押せそう」に見えている |
| レイジクリック | 同じ場所を短い時間に何度も押す動き | ボタンの反応が遅い、壊れている |
| クイックバック | 別のページへ移り、短い時間で元のページに戻る動き | リンク先が期待した内容と違う |
| 過度なスクロール | 平均より多く上下にスクロールしているセッション | 探している情報が見つからない |
実例：地方企業のLPで分かったこと
検討期間の長い高額なサービスを扱う地方企業のスマホ向けLPでは、ヒートマップから「申込フォームがページの約9割の位置にあり、そこまで読まれていない」「事例の写真にタップが集まっている」ことが分かりました。この会社は、資料請求（無料の資料）を申し込んでもらうために、考え方の違う4つのLPに広告を出して比べていました。特定を避けるため、社名・地域・業種は伏せ、内容の一部を変え、数値は丸めて紹介します。
まず広告の数字では、クリック率が4つの型で最も高かった「写真で憧れる型」の申込が0件で、クリック率が中くらいの「価格から入る型」が申込率 約2%でした。クリックが多いのに申込が無い理由は、広告の数字だけでは分かりません。
そこでヒートマップを見ると、LPごとに次のことが分かりました。
| LP | ヒートマップで分かったこと |
|---|---|
| 写真で憧れる型（最初の画面が大きな写真） | 事例の写真と「事例をもっと見る」ボタンにタップが集まり、写真は見られていた。一方で、ページの最後にある申込フォームまで読む人は少なかった |
| 改善したLP（最初の画面が文字だけ） | 申込フォームがページの約9割の位置にあり、そこまで読まれていなかった |
どちらのLPにも共通していたのは、申し込みたい人がいても、フォームまでたどり着く前に多くの人が離れていたことです。また、事例の写真へのタップから、高額な買い物を検討する人には、まず実物の事例を見たい人が多いと考えられます。
この結果から、改善したLPを次のように直しました。
| 分かったこと | 直したこと |
|---|---|
| フォームがページの約9割の位置にあり、そこまで読まれていない | フォームを前の方に移し、ページの途中にも申込ボタンを置いた |
| 最初の画面が文字だけで、写真が無い | 実物の写真のスライドに変え、お得な情報を最初に見せた |
| 別のLPで、事例の写真にタップが集まっていた | 事例をフォームより前に置き、見たい情報を先に出した |
| 入力の途中でやめる人がいる | 必須・任意を表示し、「対応エリア外（ご相談）」の選択肢を足した |
クリックが多いのに申込が無いページは、ヒートマップで見ると、どこまで読まれ、どこで離れているかが分かり、直す場所を決められます。
ヒートマップから直す順番
直す順番は、ページの上から「読まれなくなる位置」→「押されていない申込ボタン」→「反応のないタップ」の3つです。上の方を直すと、その下まで読む人が増え、下の方の結果も変わるため、上から順に1つずつ直します。
- 読まれなくなる位置：スクロールマップで色が大きく変わる場所の直前を見直します。申込フォームや申込ボタンがその下にあれば、前に移すか、途中にもボタンを置きます。
- 押されていない申込ボタン：読まれている範囲にあるのに押されていないボタンは、目立たないか、押す理由が足りません。ボタンの文言（例：「無料ガイドを受け取る」）と、その直前の説明を見直します。
- 反応のないタップ：デッドクリックが多い写真や見出しは、訪問者が「もっと見たい」と思っている場所です。拡大表示にする、詳しいページへつなぐ、などを検討します。
一度に複数の場所を直すと、どの変更が効いたか分からなくなります。1か月に1か所を目安に直し、翌月のヒートマップと比べてください。Clarityには、2つのヒートマップを並べて比べる機能があります。
録画の使いどころ
録画は、ヒートマップで気になった場所で何が起きているかを確かめるために、条件をしぼって数本ずつ見るのが効率的です。録画は1人ずつの操作をそのまま再生する機能のため、すべてを見ようとすると時間が足りません。
| 見たいこと | しぼり込みの例 | 見るポイント |
|---|---|---|
| フォームでやめる理由 | フォームのあるページ・スマホ | どの項目で手が止まるか、入力を消していないか |
| 反応のないタップ | デッドクリックがあったセッション | 何を押そうとして、次にどう動いたか |
| すぐ離れる理由 | 滞在が短いセッション | 最初の画面で何を見て離れたか |
5〜10本ほど見ると、同じ場所で同じように迷う人が見つかることがあります。その場所が、次に直す候補です。
毎月の見方（チェックリスト）
Clarityの記録は30日で見られなくなるため、月に1回、決まった順番で見てスクリーンショットと数字を残します。公式のよくある質問では、データは記録から30日まで、ヒートマップは9か月まで見られると説明されています。
- 期間を1か月にして、スマホとPCを分けて主要なLPを開いた
- スクロールマップとクリックマップをPNGで保存した（Clarityはヒートマップを画像とCSVで保存できる）
- 申込フォームの位置の到達率を記録した
- インサイトのデッドクリック・レイジクリックが多いページを確認した
- 気になった場所の録画を5〜10本見た
- 直す場所を1つ決め、先月の変更の結果を比べた
よくある質問
Microsoft Clarityは本当に無料ですか？
無料です。公式のよくある質問では、Clarityは永久に無料で、アクセス数の上限によって有料版への切り替えを求められることはないと説明されています。アクセスの一部だけを記録する間引き（サンプリング）もありません。
GA4とは何が違いますか？
GA4は「何人が来て、何件申し込んだか」を数え、Clarityは「ページの中でどう動いたか」を見ます。申込が少ないページをGA4で見つけ、そのページの中をClarityで見る、という組み合わせで使います。
データはいつまで見られますか？
記録から30日までです。ヒートマップは9か月まで見られます。録画を残したい場合や、月ごとに比べたい場合は、毎月スクリーンショットと数字を保存してください。
スマホとPCは分けて見るべきですか？
分けて見てください。画面の大きさが違うと、最初に見える範囲も、押しやすい場所も変わります。Clarityのヒートマップは、パソコン・タブレット・スマホを切り替えて表示できます。
まとめ
Microsoft Clarityは、無料で「ページの中で訪問者がどう動いたか」を見られるツールです。
- 導入は、プロジェクト作成・計測コードの設置・データの確認の3ステップ
- ヒートマップは、スクロール → クリック → 録画の順に見る
- スクロールマップでは、色が変わる位置と、申込フォームなど大事な情報の位置を比べる
- 直すのは上から順に1か所ずつ。翌月に比較機能で前後を比べる
- 記録は30日で見られなくなるため、月に1回、画像と数字を保存する
クリックが多いのに申込が増えないときは、広告ではなくページの中に理由があることがよくあります。まずは主要なLPを1つ選び、スクロールマップで申込フォームがどの色の場所にあるかを確かめてみてください。