「Clarity(クラリティ)」は、Microsoft社から2020年10月に公開された無料のアクセス分析ツールです。
Webサイトを訪問したユーザーの行動を把握することで、自社のホームページ改善に役立ちます。
本記事では、Clarityをはじめて導入する方へ向けて、機能や設定方法を紹介します。
Microsoft「Clarity(クラリティ)」は無料で使えるWebサイト分析ツール
![microsoft_clarity_top_page_images](https://www.axis-corp.com/hs-fs/hubfs/microsoft_clarity_top_page_images.jpg?width=640&height=326&name=microsoft_clarity_top_page_images.jpg)
Clarityは、ユーザーがWebサイト上でどのように行動しているかを分析できる無料ツールです。
分析したデータは、ほぼリアルタイムで表示されます。
また、1つのアカウントで分析できるサイト数や閲覧回数が決められていません。そのため、複数のWebサイトがあっても制限を気にすることなく分析ができます。
2022年2月現在では、日本語には非対応ですが、Googleの翻訳機能を活用すれば日本語で表示することもできます。
(2024年7月追記:Microsoft Clarityは日本語にも対応しました。)
なにより無料で利用できるため、Webサイトの改善ポイントを見つけたいときに導入して損はしない、アクセス分析ツールです。
Clarityの3つの機能
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/1eapQKUbUqOs30BiQoQNy9nBIVhs6y3dHVJu8uG5kD0Z4dpJXt2vTzzORlXBxi5tFhskBTeWAPILKOn4NXen6fwImqGlZ1JzluufIT0SiRW6COP_JW7I0NH1-h-BeNhWBP2nOuM.jpeg?width=640&height=426&name=1eapQKUbUqOs30BiQoQNy9nBIVhs6y3dHVJu8uG5kD0Z4dpJXt2vTzzORlXBxi5tFhskBTeWAPILKOn4NXen6fwImqGlZ1JzluufIT0SiRW6COP_JW7I0NH1-h-BeNhWBP2nOuM.jpeg)
Clarityの機能は下記の3つです(2024年6月現在)。
No.
|
機能
|
概要
|
1
|
ダッシュボード
(Dashboard) |
ページのセッション数やクリック率など、Webサイト全体の状態を表示
|
2
|
レコーディング
(Recording) |
Webサイトを訪れたユーザーの画面内の動き(スクロールやクリック)を録画
|
3
|
ヒートマップ
(Heatmaps) |
Webサイトを訪れたユーザーの動きをヒートマップで視覚化する
|
ダッシュボードでは、上記のようにどのくらいページが読まれたかや、PV数の多いページなどを確認できます。
さらにレコーディング機能により、Webサイトに訪れたユーザーのリアルな動きが保存されます。
Microsoft Clarityで録画されるユーザーの動きの例としては、以下のようなものが挙げられます。
- マウスの動き:
マウスカーソルの動きが記録され、ユーザーがどの部分に注目しているのか、どのコンテンツに興味を持っているのかを把握できます。 - クリック:
ユーザーがどのボタンやリンクをクリックしたのかが記録され、どのコンテンツがクリックされやすいのか、どの部分がユーザーの興味を引いているのかを分析できます。 - スクロール:
ユーザーがページをどこまでスクロールしたのかが記録され、コンテンツのどの部分が読まれているのか、どの部分が離脱ポイントになっているのかを把握できます。 - 入力:
フォームへの入力内容が記録され、ユーザーがどのような情報を入力しているのか、入力途中で離脱していないかなどを確認できます。 - ページ遷移:
ユーザーがどのページからどのページへ遷移したのかが記録され、ユーザーのサイト内での行動フローを分析できます。
また、ヒートマップでは、PCやモバイル・タブレットのデバイス別に、ユーザーがクリックしたポイントに色付けされます。
そのため、
- どこがよくクリックされたか
- そのページがよく読まれたか
- どれくらいの人がWebサイトを訪れたか
などを簡単に知ることが可能です。
Clarityを導入する4つのメリット
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/HmcVzXryzyYS2CTUpVtYIimPacfspLP1HqddmleUW6LKh64Ai9pRI2f7WDAZ5SIu4glHZU25Safp02QN2y89Mrisrob-Vax067MdwAilnV9Hpm-o0w-jThN-fwoyeCWlapp6h98.jpeg?width=640&height=390&name=HmcVzXryzyYS2CTUpVtYIimPacfspLP1HqddmleUW6LKh64Ai9pRI2f7WDAZ5SIu4glHZU25Safp02QN2y89Mrisrob-Vax067MdwAilnV9Hpm-o0w-jThN-fwoyeCWlapp6h98.jpeg)
Clarityには、下記のメリットがあります。
|
最大のメリットは、無料であらゆる機能を使えることです。セッション数やデータ保有期間に、制限がありません。
また、権限付与ができるため、社内外に複数の担当者へデータを共有できます。
アクセス解析ツール「Google アナリティクス」と連携することで、両者を照らし合わせより分析がしやすくなります。
無料でありながら、個人はもちろん、企業規模を問わず活用しやすいことが特徴です。
Clarityの設定方法4ステップ
ここで、Microsoft Clarityの設定方法を紹介します。
|
では、それぞれ解説します。
ステップ1.Microsoftアカウントへ登録する
まずは公式サイト(https://clarity.microsoft.com/)へアクセスし、「使い始める」をクリックします。
![microsoft_clarity_top_page_images](https://www.axis-corp.com/hs-fs/hubfs/microsoft_clarity_top_page_images.jpg?width=640&height=326&name=microsoft_clarity_top_page_images.jpg)
次に、サインインするアカウントを選択します。
![microsoft_clariy_top_page_images02](https://www.axis-corp.com/hs-fs/hubfs/microsoft_clariy_top_page_images02.jpg?width=640&height=319&name=microsoft_clariy_top_page_images02.jpg)
アカウント登録には、以下の3通りの方法があります。
- Microsoftのアカウントを使う
- Facebookアカウントを使う
- Googleアカウントを使う
何らかのアカウントが必須であるため、アカウントを持っていない方はどれか1つを登録する作業から始めましょう。
なお、Google アナリティクスと連携をするのであれば、Google アナリティクスで登録しているGoogleアカウントを選択するのがおすすめです。
ステップ2.新規プロジェクトを作成する
ここで、新規プロジェクトを作成していきます。まずは下記を入力します。
- Name:Webサイト名
- Website URL:WebサイトのURL
- Site category:Webサイトのカテゴリー(選択式)
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/h82W3knQDWjmXlbvCAKbHC25sa6T1u8pFRTpRBL2UUQLG4GXWWPOPC4WVqB25yoLl0cpKEjJ5G7we2TMCtduNoUaJrdsBSObPpiKW-QDWFnivKe0moYv51JbGcvppZVajHWcCwQ.jpeg?width=640&height=349&name=h82W3knQDWjmXlbvCAKbHC25sa6T1u8pFRTpRBL2UUQLG4GXWWPOPC4WVqB25yoLl0cpKEjJ5G7we2TMCtduNoUaJrdsBSObPpiKW-QDWFnivKe0moYv51JbGcvppZVajHWcCwQ.jpeg)
選択できるサイトカテゴリーは、以下の10通りです(2022年2月現在の情報)。
- E-Commerce
- SaaS
- Blog
- Marketing
- Consulting
- Media
- Education
- Community
- Non-profit
- Other
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/NPVaaisCWX23y4_afVv83SRxrDa3eBFOUmw3UjeFUsi2fWBXPn8KCbiL6LZZU4TjPRQOSeE_PmbrguiqU3gPIZmPsbaCWVmWj4HOKjEqnE42HJROZoYah19nOmJRevDQrl5SDGM.jpeg?width=640&height=369&name=NPVaaisCWX23y4_afVv83SRxrDa3eBFOUmw3UjeFUsi2fWBXPn8KCbiL6LZZU4TjPRQOSeE_PmbrguiqU3gPIZmPsbaCWVmWj4HOKjEqnE42HJROZoYah19nOmJRevDQrl5SDGM.jpeg)
入力が完了したら「Add new project」をクリックします。
なお、ユーザーヘルスケアや金融サービスなど、重要な個人情報を扱う機関のサイトでは導入ができないので注意して下さい。
ステップ3.Clarityタグを設置する
次に、Clarityタグを設置します。
新規プロジェクトを作成し終えると、トラッキングコード「Clarity tracking code」というタグが画面に表示されます。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/prrTOjaKGXBb58LlQKFlGELwzIkrCJsoYGHQgWLzE1FCSEz8lXGSs15kdqH4Is6b-Lj3CiZGQLP17KOZiu7USVAsEbBaV0rVCd9ds27EgcwOcUPjModDX79-21coJjAqmbs1VJM.jpeg)
タグをコピーし、Clarityを導入したいWebサイトへ設置します。
タグの設置方法に関しては、下記の記事で詳しく解説していますので、ぜひ参考にしてください。
関連記事:【徹底解説】ホームページにタグを設置する2つの方法
ステップ4.Google アナリティクスと連携する
最後に、Google アナリティクスと連携していきましょう。まず、メニューの中にある「Setup」をクリックします。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/6mMQ19yIIMv24mGppqr3r_aSV5JZlx09C28Xb-HGUhCf8hpRg-fw1J0a725peDby1aqZE8k9kfZWCg5BCY5h-ri36qcEayZASBx7tu0z7kc23iF_wXfg6WrIuKZVMBh_AFOxPhQ.jpeg)
続いて「Get started」を選びます。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/XuVeyaJp8B2PK0Yo1G-HY4D8wYRR5e93kl3E6OxT_izFOiCB3U0W3CjVNeGvm5a4cF0KjHSTfevXfY16Cjzhg6xbpWlaUJAXkwc2PlKZ5zE3yiNHmcnIWprnOZU3htJ3HHgeq-M.jpeg)
ここで、Google アナリティクスに登録しているGoogleアカウントを選択します。
その後「Site to connect」にあるプルダウンをクリックすれば、Webサイトの一覧が出てくるので、該当の項目を選びましょう。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/7Mt6VdVjqEZZKq0SleYPm1wbdiidHoBuA5lkoxNW4Q5y0lHVHUZHByXL_6K9GNqhBxU3TkUouwBiQxMajuzFsCXieBDBULom1vpBQJc3VQTUEitkv_dgT4n0k_C3vTa7G3mvpZA.jpeg)
下記の表示になっていたら、Google アナリティクスとの連携が完了です。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/AbBUjDfiyyVfETbooojF9jVfIw3OzYMF2hs2c9tAy3gXagiPdR0eRDvhFkWMEND3myqXTr9b15HXIR8pTvZHk31gbHBvIUo4RxZTFyhOqOqlMkFnJFIwTcvQyc9wXLkXVwc1TvY.jpeg)
なお、Google アナリティクスを使うには、事前に設定が必要です。
詳しくは「Googleアナリティクス4(GA4)の導入・移行方法と初期設定まとめ」をご覧ください。
【目的別】 Clarityの3つの使い方
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/0-aCmjvf2am7nGkQtRUjkmgiYv0LoFyrzcUIg_wnpUBQlNNmQ2nh_WdqrcucC_YuNFTS80KKriC7NAZLOs000sZd_VDJai_ZptM8HXnYKObR9HBHZMNCB6h_BkrJuVB2VXpBbGI.jpeg?width=640&height=426&name=0-aCmjvf2am7nGkQtRUjkmgiYv0LoFyrzcUIg_wnpUBQlNNmQ2nh_WdqrcucC_YuNFTS80KKriC7NAZLOs000sZd_VDJai_ZptM8HXnYKObR9HBHZMNCB6h_BkrJuVB2VXpBbGI.jpeg)
Clarityの便利な使い方について、以下3つをお伝えします。
|
それぞれ解説します。
1.レコーディングしたデータを共有する
|
レコーディングデータを共有するためのURL発行手順は上記のとおりです。どのメンバーに向けて共有リンクを発行するかで、選択項目が変わります。
- With project team:すでに権限を所有するメンバー
- With anyone:権限を所有していないメンバー
権限を所有していないメンバーへ発行した共有リンクには、有効期限があります。1~30日まで設定できるので、必要に応じて調整しましょう。
2.第三者へ権限を付与する
Clarityは、第三者へ権限を付与することも可能です。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/OiSEDxQbCBlQktFn_PmB8V-h1XGiln2v_YQby0sg1sp3abysFUKjequecKeLws-g8cCnHFf5OgHyTjAsWHdW6iIVs3iBeGFcI-cHdr_4Tb4S3BBVrWdLJTNOK_deB2qi_VIFjAE.jpeg)
上記のようにメニューの「Team」から「+Add team member」をクリックし、アカウントを追加できます。
権限の種類は下記の2つです。
- Member:メンバー
- Admin:管理者
メンバーの場合、ユーザー追加やプロジェクトの削除など設定に関わる管理ができません。
だれにどんな目的で共有するのかによって、権限の種類を選びましょう。
3.内部トラフィックを除外する
自分や関係者のアクセスを除外し、より正確なWebサイトデータを収集する設定も可能です。
![](https://www.axis-corp.com/hubfs/Imported_Blog_Media/tov6CPds32wYDCCpzMuEOJL147uaj_FwLcWsCcGtAJ1-7uQ0bQK1BCZ5lXG7pcUaNSs5jn78lQMsb4de2XHkzn82nWuQix0L65P49viNY2dQAD-6VXtZBvXvn547gW2nLw4gUTA.jpeg)
IPアドレスの除外は、管理画面の「IP blocking」で、下記2つを設定します。
- Name:管理上の名称
- IP address: IP アドレス
現在アクセスしている自分のIPアドレスを場外する場合は「Block my current IP」にチェックをいれるだけで完了です。
Webサイトの改善ならClarityと他ツールの併用がおすすめ
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/nmndzYM4b7RA0PEBSo7zm7T4JkLlMblJsjcotqWZV2F4KLNMgHgakNgZjipsH2lj0PRpd2_HxKZ6g4hwoVxif8cxQQXtoQ_68JSs0Xx5xgtCjeoOhDUOvDEpsq0jaY6-I-GPiIs.jpeg?width=640&height=426&name=nmndzYM4b7RA0PEBSo7zm7T4JkLlMblJsjcotqWZV2F4KLNMgHgakNgZjipsH2lj0PRpd2_HxKZ6g4hwoVxif8cxQQXtoQ_68JSs0Xx5xgtCjeoOhDUOvDEpsq0jaY6-I-GPiIs.jpeg)
Clarityは、無料で使える便利なツールです。ただ、無料であるがゆえ、
- 機能が突然使えなくなる
- 他ツールとデータの剥離がある
などのデメリットがあります。最も注意が必要なのは、プライバシーへ配慮することです。
取得したデータのなかに個人情報が含まれていた場合、自動的に保護する「マスキング」の設定は必須です。
もし多角的にデータ分析をしたいのであれば、Clarityだけに頼らず他ツールとの併用がおすすめです。
なお、Webサイト解析については下記で解説していますので、ぜひ参考にしてください。
関連記事:どんな人が来ているの?Webサイトへのアクセスを見る方法
まとめ
![](https://www.axis-corp.com/hs-fs/hubfs/Imported_Blog_Media/8nYtbEfLaWId9MmAaBIOEIO_qLfoxIfE-cvwNaP2-sHUVDvObfRGOK3jN5H-CyMrtTczWI1tJIY6uRsclqutF9WJfcZs8TqqBDf1kLi9AwEMnOwWBpB_xSVP0isOB5HqYcdCwHM.jpeg?width=640&height=426&name=8nYtbEfLaWId9MmAaBIOEIO_qLfoxIfE-cvwNaP2-sHUVDvObfRGOK3jN5H-CyMrtTczWI1tJIY6uRsclqutF9WJfcZs8TqqBDf1kLi9AwEMnOwWBpB_xSVP0isOB5HqYcdCwHM.jpeg)
Webサイトの改善をするなら、まずはユーザーの行動を把握することが重要です。Clarityを活用すれば、Webサイトを訪れたユーザーのリアルな行動データを取得できます。
まだ導入されていない方は、この機会にぜひチャレンジしてみてください。
関連記事: