MicrosoftClarityを設定する方法

MicrosoftClarity(マイクロソフトクラリティ)」は、あなたのブログを訪れた人が、どのようにサイトを使っているのかがわかる、とっても便利な無料のツールなんです!

この記事では、Clarityの導入メリットとGoogleタグマネージャーを使った簡単な設定方法を解説しています。

おかだ

サイトを作って終わりではなく常に改善が必要です。

Clarityは改善の大きな手助けとなるので、必ず導入して有効に活用してくださいね!

目次

  1. Microsoft Clarityって何?導入メリットは?
    1. 【ヒートマップ】ユーザーがサイトのどこをよく見ているかわかる
    2. 【セッションレコーディング】ユーザーがどのようにサイト内を見ているかわかる
    3. 【インサイトダッシュボード】ユーザーがサイトのどこで困っているかわかる
  2. Googleタグマネージャーを使えば簡単に設定可能
  3. 【ステップ1】MicrosoftClarityのアカウントを作成
    1. MicrosoftClarityのアカウント作成・ログイン
    2. ステップ:新しいプロジェクトを作成
  4. 【ステップ2】GoogleタグマネージャーでClarityを設定する
    1. Clarityの設定画面から連携
    2. Googleタグマネージャーのセットアップ
  5. 【ステップ3】Clarityが正しく設置されたか確認
  6. まとめ
目次

Microsoft Clarityって何?導入メリットは?

Microsoft Clarityは、あなたのウェブサイトを訪れた人が、どこをクリックしたかどこまでスクロールしたかどんな動きをしたかなどを記録してくれるツールです。

まるで、サイトを使っている人の行動をこっそり見ているみたいで、あなたのサイトの改善点を見つけるのに役立ちます!

例えば、こんなことがわかるようになります。

Clarityの機能
  • 【ヒートマップ】ユーザーがサイトのどこをよく見ているかわかる
  • 【セッションレコーディング】ユーザーがどのようにサイト内を見ているかわかる
  • 【インサイトダッシュボード】ユーザーがサイトのどこで困っているかわかる

これらの情報を知ることで、あなたのサイトをもっと使いやすく、ユーザーが探している情報を見つけやすくしたりと効果的に改善できるんです。

しかも、これだけの機能を備えながらClarityは完全無料で使えます。

まずは導入前にどのような機能があるか知っておきましょう。

ヒートマップユーザーがサイトのどこをよく見ているかわかる

ヒートマップは、ウェブサイトのどの部分がユーザーによく見られているかを色の濃淡で示す機能です。

下の画像は実際のヒートマップ画面です。

ヒートマップのサンプル画像(クリック・タップ)

クリック・タップが多い場所は赤く少ない場所は青く表示され、ユーザーの関心が高い箇所が一目でわかります。

また、次のようにスクロールデータも視覚化されているので改善に役立てます。

ヒートマップのサンプル画像(スクロール)

これにより、重要な情報が見られているか、クリックされていないボタンはないかなどを分析し、ウェブサイトの改善に役立てることができます。

【セッションレコーディング】ユーザーがどのようにサイト内を見ているかわかる

セッションレコーディングは、ウェブサイトを訪れた個々のユーザーの行動を動画として記録する機能です。

セッションレコーディングのサンプル画像

ユーザーがどこをクリックし、どのようにスクロールし、どのページを見たかなどを確認できるので、飽きられるポイントや、読み返しているポイントがわかります。

まるでユーザーが実際にサイトを使っている様子を覗き見しているような動画なので、ユーザー心理を確認するのに有効です。

【インサイトダッシュボード】ユーザーがサイトのどこで困っているかわかる

インサイトダッシュボードは、ウェブサイトの全体的なパフォーマンスとユーザー行動の主要な指標をまとめて表示する機能です。

インサイトダッシュボードのサンプル画像

例えば、ユーザーが何度も同じ場所をクリックする「イライラしたクリック」や、ページをすぐに離れる「クイックバック」などを検知できます。

これにより、ユーザーがサイトのどこで困っているのかを素早く把握し、改善に繋げることができます。

おかだ

Clarityはユーザーの動きを確認できるので、作り手では思いつかない問題点や改善点を発見できるのが大きなメリットです。

Googleタグマネージャーを使えば簡単に設定可能

無料で使えるMirosoftClarityの設定方法はGoogleタグマネージャーを使うと簡単です。

Googleタグマネージャーを使うメリット
  • コードを直接編集する必要がない:WordPressのテーマファイルを直接触らずに、Clarityのトラッキングコードを追加できます。
  • 管理がしやすい:ウェブサイトの様々なトラッキングコードを一元管理できるので、Clarityのコードも他のコードと一緒に管理できます。
  • 設定変更が簡単:Clarityの設定を変更したい場合も、Googleタグマネージャーの画面から簡単に行えます。

まだGoogleタグマネージャーを未設定の人は次の記事で設定方法を解説しているので参考にしてください。

【ステップ1】MicrosoftClarityのアカウントを作成

ここからGoogleタグマネージャーを使ったMicrosoftClarityの設定方法を解説します。

MicrosoftClarityのアカウント作成・ログイン

まずは次のリンクからMicrosoftClarityのウェブサイトにアクセスし、「使い始める」をクリックします。

https://clarity.microsoft.com/lang/ja-jp

Microsoftアカウント、Facebookアカウント、Googleアカウントのいずれかを持っていれば、登録不要でサインアップできます。

ステップ:新しいプロジェクトを作成

サインアップ後、「プロジェクト」ページで「新しいプロジェクト」をクリックします。

プロジェクト名(例:覚えやすいあなたのサイト名)と、あなたのWordPressサイトのURLを入力し、「新しいプロジェクトを追加する」をクリックします。

【ステップ2】GoogleタグマネージャーでClarityを設定する

それでは、いよいよGoogleタグマネージャーを使ってClarityを設定していきましょう。

Clarityの設定画面から連携

先の「新しいプロジェクトを追加する」をクリックすると次の画面が表示されるので、Googleタグマネージャを使用してインストールするにある「セットアップ開始」を選択します。

まだGoogleタグマネージャを設定していない場合は下記の記事に解説しているので参考にしてください。

「今すぐつながりを申請」をクリック。

Googleアカウントへのログイン画面が表示されるので、Googleタグマネージャを登録したGoogleアカウントにログインします。

すると次の画面が表示されます。

「すべて選択」を選んで次に進みましょう。

Googleタグマネージャーのセットアップ

次に左に表示されるメニューから「セットアップ」を選択し、Googleタグマネージャーの接続先のアカウントを選択します。

「作成と発行」をクリックするとGoogleタグマネージャーとの接続を開始します。

問題なければ次の画像のように「ログイン済」のマークが表示されます。

これでClarityの設定は完了です。

【ステップ3】Clarityが正しく設置されたか確認

Clarityの設定が終わったら、ちゃんと動作しているか確認しましょう。

Clarityのダッシュボードを開き数時間以内にClarityのダッシュボードにデータが表示され始めます。

あなたのサイトを実際に訪れてみて、次の画像の様にダッシュボードが更新されているか確認しましょう。

まとめ

最後に記事の内容をまとめます。

・Clarityは読者がサイトでどのように動きをしているか可視化できる無料ツール
・クリックされている場所や、どこまでスクロールされているかがわかる
・読者の動きから作り手が思いつかない問題点に気づける
・Googleタグマネージャーを使えば簡単に導入できる

Googleタグマネージャーを使えば、WordPressサイトへのClarityの設定はとっても簡単です。

ユーザーの行動を可視化できるClarityを活用して、あなたのサイトをさらに使いやすく、魅力的なものにしていきましょう!

この記事が気に入ったら
いいねしてね!

目次