2026.10.01 2026.10.01

Microsoft Clarityの使い方【WordPressへの導入からヒートマップの読み方まで丁寧に解説】

weluca

「Microsoft Clarityって聞いたことあるけど、どうやって使うの？」という方へ。

Microsoft Clarityは完全無料で使えるヒートマップツールです。読者がページのどこをクリックしたか・どこまでスクロールしたかが色付きの地図で一目で分かります。この記事ではアカウント作成からWordPressへの設置・ヒートマップの読み方まで、初めての方が迷わず進められるよう丁寧に解説します。

WELUCA Web

Microsoft Clarityとは何か

Microsoft Clarityは、Microsoftが無料で提供しているユーザー行動分析ツールです。

「Googleアナリティクスが何人が来たかを教えてくれるツール」なら、「Clarityはその人たちがページのどこを見てどこをクリックしたかを教えてくれるツール」です。

料金：完全無料。セッション数・データ保有期間に制限なし
提供元：Microsoft（マイクロソフト）
公式サイト：clarity.microsoft.com
Googleアナリティクスとの連携：GA4と連携することで数値と行動を両面から分析できる

導入前に知っておくべき注意点

Clarityを導入する前に、一つ大切なことをお伝えします。

Clarityのヒートマップは、PVが十分に集まっていないと正確なデータが得られません。

1記事に10人しか来ていない状態でヒートマップを見ても、10人分のデータしかないため「たまたまそこをクリックしただけ」かもしれません。1記事に最低でも月100〜200PV程度集まってから確認することをおすすめします。PVが少ない段階で導入してもデータが薄く、有効な判断ができません。まずPVを増やすことを優先してください。

WELUCA Web

ただしClarityの設置自体は早めにしておくことをおすすめします。設置してからデータが蓄積されるため、PVが増えてきたときにすぐにヒートマップを確認できます。「PVが増えてから導入しよう」と思っているとデータがゼロからのスタートになります。

ステップ1：Clarityのアカウントを作成する

ブラウザで「clarity.microsoft.com」にアクセスする
「使い始める」または「Get started for free」をクリックする
サインアップ方法を選択する（Microsoft・Facebook・Googleアカウントの3種類から選べる。Googleアカウントで登録すると後でGA4との連携がスムーズ）
メールアドレスを入力してアカウントを作成する

ステップ2：プロジェクトを作成する

アカウント作成後、計測するサイトの情報を登録します。

「Add new project」または「新しいプロジェクトを追加」をクリックする
「Name（プロジェクト名）」にサイト名を入力する（例：WELUCA）
「Website URL」にサイトのURLを入力する（例：https://weluca.jp）
「Create」をクリックしてプロジェクトを作成する

ステップ3：WordPressにトラッキングコードを設置する

プロジェクトを作成すると、WordPressへの設置方法を選択する画面が表示されます。

WordPressへの設置方法は「専用プラグインを使う方法」と「トラッキングコードを手動で設置する方法」の2種類があります。初心者にはプラグインを使う方法が簡単でおすすめです。

方法1：専用プラグインで設置する（初心者向け・推奨）

Clarity管理画面の設置方法選択画面で「WordPress / WooCommerce」をクリックする
「プロジェクトID」をコピーしておく（後で使う）
WordPressの管理画面「プラグイン」→「新規プラグインを追加」をクリックする
検索欄に「Microsoft Clarity」と入力して検索する
「Microsoft Clarity」プラグインをインストールして有効化する
WordPress管理画面「設定」→「Clarity」をクリックする
「Clarity Project ID」欄に先ほどコピーしたプロジェクトIDを貼り付ける
「Save Changes（変更を保存）」をクリックして完了

方法2：トラッキングコードを手動で設置する

Clarity管理画面「Setup」→「Install tracking code manually」をクリックする
表示された<script>から始まるトラッキングコードをコピーする
WordPressのテーマ設定・SEOプラグイン（Rank Math・Yoast SEOなど）のheadタグ欄に貼り付ける
Cocoonの場合は「Cocoon設定」→「アクセス解析・認証」→「ヘッド用コード」欄に貼り付ける
「保存」をクリックして完了

設置後すぐにはデータが表示されません。数時間〜1日程度でヒートマップやセッション録画が使えるようになります。設置直後に管理画面を確認してデータがゼロでも焦らず待ってください。

ステップ4：設置が正しくできているか確認する

ブログのトップページをブラウザで開く
「Ctrl+U」（Macは「Command+Option+U」）でソースコードを表示する
「Ctrl+F」で検索窓を開き「clarity.ms」と入力する
Clarityのコードが見つかれば設置完了

ステップ5：ヒートマップの見方を理解する

データが蓄積されたら、ヒートマップを確認してみましょう。

ヒートマップの色の読み方

🔴 赤・オレンジ：最も多くの読者が見ている・クリックしている場所。広告を置くのに最適な場所
🟡 黄色：比較的多くの読者が見ている場所
🟢 緑：ある程度見られている場所
🔵 青：あまり見られていない場所。広告を置いてもクリックされにくい

ヒートマップの種類

クリックヒートマップ：読者がどこをクリックしたかを色で表示する。赤い場所が最もクリックされている場所。広告配置の参考に最も活用しやすい
スクロールヒートマップ：読者がどこまでスクロールしたかを表示する。読者がどこで離脱しているかが分かる。記事のどこまで読まれているかを確認するのに使う
マウスムーブヒートマップ：読者がマウスをどこに動かしたかを表示する。視線の代わりとして参考にできるが、スマホでは取得できない

ステップ6：セッション録画でユーザーの動きを確認する

ヒートマップと並んで便利なのがセッション録画機能です。

実際の読者がページをどのように読み進めたかを動画で確認できます。読者がどこで迷っているか・どこで戻っているか・どこで離脱しているかが一目で分かります。

Clarity管理画面「Recordings（録画）」をクリックする
確認したいセッションを選んで再生ボタンをクリックする
読者の動きを動画で確認する。再生速度を2〜4倍にすることで効率よく確認できる
読者がどこで離脱したか・どこで迷っているかを記録する

ステップ7：ヒートマップのデータを広告配置に活かす

ヒートマップのデータを確認したら、広告配置の改善に活かします。

ヒートマップを広告配置に活かす手順

PVの多い記事のヒートマップを確認する（PVが少ない記事はデータが不正確なため避ける）
クリックヒートマップで赤くなっている場所（よくクリックされている場所）を確認する
スクロールヒートマップで読者がどこまで読んでいるかを確認する（読まれていない場所に広告を置いても効果がない）
赤い場所の近くに広告を設置または移動する
青い場所に広告を置いていた場合は移動する
1〜2週間AdSenseのCTRの変化を確認する

ヒートマップで確認できる「よくクリックされている場所」はサイトによって異なります。「定番の場所に置けば必ずCTRが上がる」というものではありません。自分のサイトの読者が実際にどこを見ているかをClarityで把握してから配置を決めることが、最も確実な収益改善の方法です。

WELUCA Web

よくある質問

Clarityは本当に無料ですか？: はい、完全無料です。セッション数の上限・データの保有期間・機能の制限は一切ありません。Microsoftが提供する公式サービスのため、信頼性も高く個人・法人問わず無料で使い続けられます。

Googleアナリティクスと重複して設置しても問題ありませんか？: 問題ありません。ClarityとGoogleアナリティクス（GA4）は役割が異なるため、両方設置することをおすすめします。GA4は「何人が来たか・どのページが人気か」という数字を、Clarityは「読者がどこをどう見たか」という行動を教えてくれます。両方のデータを組み合わせることでより深い分析ができます。

PVが少ないうちはClarityは使えませんか？: 使えますが、データの正確性が低くなります。1記事に月100〜200PV程度集まってから確認することをおすすめします。ただしClarityの設置自体は早めにしておくことをおすすめします。設置してからデータが蓄積されるため、PVが増えてきたときにすぐにヒートマップを確認できます。

プライバシーポリシーへの記載は必要ですか？: はい、必要です。Clarityは読者の行動データを収集するため、プライバシーポリシーにClarityを使用していることを明記してください。「当サイトはMicrosoft Clarityを使用してユーザーの行動データを収集しています」という旨の記載を追加してください。AdSenseのプライバシーポリシーと同じページに追記する形で問題ありません。

ABOUT ME

Warning: Undefined array key 0 in /home/amazonzon/weluca.jp/public_html/adsense/wp-content/themes/jinr/include/shortcode.php on line 306