ヒートマップツールって何なの？
今話題のclarityについて知りたい！
clarity（クラリティ）とは、2020年10月にMicrosoftが公開した無料で使えるヒートマップツールのことです！
そのclarity（クラリティ）について、設定方法や使い方を今日はお話ししていきます！
- 「ヒートマップツールとは何か？」
- 「clarity（クラリティ）の設定方法」
- 「clarity（クラリティ）の使い方」
ヒートマップツールとは？
ヒートマップツールは、ブログ記事の改善に役立つ解析ツールです！
GoogleサーチコンソールやGoogleアナリティクスが解析ツールとして有名ですが、これらは検索流入数やユーザー数といった”数字”を見るためのツールです。
また、直帰率（離脱率）が100％の記事では滞在時間などが分からないことがあります。
対してヒートマップツールは、訪問したユーザーの”行動”そのものを見ることができるツールです！
ヒートマップツールを使うことで、より細かな改善点を見つけることができます！
「clarity」を使って分かること
「clarity（クラリティ）」は、数あるヒートマップツールのなかでもサイト訪問者の行動が群を抜いて可視化できるツールです！
しかもすべて無料で使えるんです！
- 記事をどこまでスクロールされたか
- 記事のどこをクリックされたか
- 読者がどのように記事を移動しているか
このようなことを、データではもちろんのこと”動画でも”見ることができます！
サイト訪問者の行動を録画したものが無料の範囲で見られるのは、たぶんclarity（クラリティ）だけだとおもいます！
- 記事のどこで離脱しているか
- 有効/無効なクリックの分析
- 内部リンクが適正かどうか
clarity（クラリティ）を使うことで、記事のリライトや収益の改善につながるポイントが分かります！
「clarity」の設定方法
clarity（クラリティ）の設定手順は、次の5つです！
- 「Microsoft clarity」サイトでアカウント登録
- ブログ情報の登録
- WordPressにプラグインをインストール
- プラグインにコード貼り付け
- Googleアナリティクスと連携
順番に解説していきます！
「Microsoft clarity」サイトでアカウント登録
まずはじめに、Microsoft clarityの公式サイトへアクセスします！
すると下のような画面になります▼
まだ日本語対応のサイトは無いため英語表記になります。
ただ、翻訳機能があるブラウザなら日本語表記に翻訳してくれます！
私は翻訳機能を使って設定をしていったので、ここから先は翻訳機能を使った画面で解説していきます！
公式サイトの「サインアップ-無料です！」をクリックします▼
サインアップするには、Microsoft・Facebook・Googleいずれかのアカウントが必要になります！
もしこれらのアカウントが無い場合は、先にアカウント作成が必要です！
次に、サインアップするアカウントを選択します▼
私はブログ管理をGoogleアカウントで統一しているためGoogleで登録しました！
複数のアカウントがある場合、どのアカウントを使用するか選択します▼
次の画面で「クラリティを受け入れます」のチェックボックスにチェックを入れ「継続する」をクリックします▼
ブログ情報の登録
次に、ブログ情報を登録していきます！
名前・ウェブサイトのURL欄に「ブログ名」「ブログのURL」を入力します▼
その下のサイトカテゴリでカテゴリを選択します▼
どれを選択してもいいですが、私は分かりやすく「ブログ」を選択しました▼
ここまで入力できたら「新しいプロジェクトの追加」をクリックして登録完了です▼
登録が完了すると、下の画面に切り替わります▼
この画面は後の設定で必要となるので、閉じずに一旦そのままにしておきます！
WordPressにプラグインをインストール
続いてclarity（クラリティ）のトラッキングコードをWordPressに貼り付けていきます！
コードの貼り付け方法は
- head内にコードを直接貼り付ける方法
- プラグインで貼り付ける方法
この2種類があります。
プラグインを使用した方が私のような初心者には分かりやすいので、ここでは「clarityのプラグインを使ってコードを貼り付ける方法」をお話ししていきます！
WordPressの画面から「プラグイン」→「新規追加」の順に進みます▼
プラグイン追加の画面で「clarity」を検索して「今すぐインストール」をクリックします▼
しばらく経つと有効化のボタンに変わるので「有効化」をクリックします▼
プラグインにコード貼り付け
次にプラグイン一覧の中から、Microsoft Clarityの下にある「settings（設定）」をクリックします▼
するとProject IDを入力する画面に切り替わります▼
Project IDを入力するために、閉じずにそのままにしておいた画面に戻ります▼
この画面のクラリティトラッキングコード欄の最後らへんにある「コード」をコピーします▼
Copy to clipboardをクリックすると欄全体がコピーされてしまうので注意しましょう！
（head内に直接貼り付ける際は欄全体コピーになります）
プラグインの画面に戻り「コードを貼り付け」して「変更を保存」をクリックして完了です▼
これでclarity（クラリティ）での計測データが収集されていきます！
Googleアナリティクスと連携
続いてGoogleアナリティクスと連携していきます！
トラッキングコードをコピーした画面のさらに下にある、Google Analytics integrationにスクロールして「Get started（はじめに）」をクリックします▼
アカウント選択画面になるので、アナリティクスで使用しているGoogleアカウントを選択します▼
次に、2つのチェックボックスにチェックを入れ「続行」をクリックします▼
アナリティクスと連携するサイト（clarityで登録したもの）を選択して「セーブ」をクリックします▼
しばらくして「Googleアナリティクスのリンクに成功」と表示されたら連携完了です！
これでアナリティクスからの情報も共有できるので、サイト分析がよりしやすくなります！
2つ以上のブログを追加する方法
2つ以上のブログ運営されている人のために、clarityにブログを追加する方法も解説しておきます！
clarityの画面の左上にある「マイプロジェクト」をクリックします▼
次に、「新しいプロジェクトの追加」をクリックします▼
新規のときと同様に、ブログ名・ブログのURLを入力して、カテゴリを選択して追加登録完了です▼
追加登録したブログもアナリティクスと連携することをお忘れなく！
連携方法は新規のときとまったく同じなので説明は省きます。
追加したブログの切り替え方法
複数登録したブログの切り替えはとても簡単です！
clarityの画面の「マイプロジェクト」をクリックすると登録してあるブログが表示されます▼
切り替えたいブログの方をクリックするだけで切り替え完了です！
clarityの使い方
clarityの使い方を解説していきます！
あまりにも多くの分析ができるので、ブログ改善によく使うものに絞っていきます！
ダッシュボード（Dashboard）
clarity画面にある「ダッシュボード」をクリックすると、全体のデータ分析画面になります▼
ダッシュボード画面では、下の5つの項目に注目します！
- スクロールの深さ（Scroll depth）
- デッドクリック（Dead clicks）
- 怒りのクリック（Rage clicks）
- 過度のスクロール（Excessive scrolling）
- クイックバック（Quick backs）
スクロールの深さ（Scroll depth）
スクロールの深さ（Scroll depth）は、ユーザーが記事を読み進めていった深さの平均値が見れます！
この数値が極端に低い場合、最初の方で離脱されている記事が多いことが分かります！
リード文が分かりにくかったり結論が先に書いてないために記事が読み進められてないことが原因の可能性があります！
記事冒頭のリライトが必要かどうかの判断材料になります！
デッドクリック（Dead clicks）
デッドクリック（Dead clicks）は、反応が無いところでユーザーがクリックした率が表示されます！
デッドクリック率が高いところはユーザーにクリックする場所だと誤解されている可能性が高いです！
装飾や文字色などの改善が必要かどうかの判断材料になります！
怒りのクリック（Rage clicks）
怒りのクリック（Rage clicks）は、ユーザーがクリックを連打した割合が表示されます！
文字が小さくてダブルタップで拡大されている可能性があります！
読みにくい部分が無いかどうかの判断材料になります！
過度のスクロール（Excessive scrolling）
過度のスクロール（Excessive scrolling）は、通常よりも速いスピードでスクロールされた割合が表示されます！
この割合が高いほど読み飛ばされている部分が多いことを示しています！
記事内に不必要なものが無いかどうかの判断材料になります！
クイックバック（Quick backs）
クイックバック（Quick backs）は、内部リンクをクリックしたユーザーがすぐに前の画面に戻った割合が表示されます！
飛び先の記事の質が悪かったり、ユーザーが誤クリックして記事に飛んだ可能性があります！
ユーザーに誤解を与える部分が無いかどうかの判断材料になります！
録音（Recordings）
録音（Recordings）は、ユーザーごとの行動そのものを動画で見ることができます！
ヒートマップツールでclarityを使う醍醐味がココにあります！
実際のスクロールしている様子や、画面のどこをクリック（タップ）しているかなど、ユーザーごとの動きが詳細に見れます！
離脱率が多い記事の改善に役立てたり、ASPの成果レポートと合わせて成果発生までのユーザーの動きを見ることにも役立ちます！
表示スピードは８段階（0.25倍・0.5倍・1倍・1.5倍・2倍・4倍・8倍・12倍）に変えれます！
ヒートマップ（Heatmaps）
ヒートマップ（Heatmaps）は、記事ごとのユーザーの行動を色分けや数値で見ることができます！
ヒートマップの画面は「クリック（Click）」「スクロール（Scroll）」「面積（Area）」を切り替えることができます！
「クリック（Click）」の画面
「クリック（Click）」の画面では、ユーザーが記事内のどの部分をどのくらいクリックしているかを実際の記事画像で見ることができます▼
クリックされやすい場所にボタンや記事リンクを移動するなど、記事構成の見直しの判断材料になります！
「スクロール（Scroll）」の画面
「スクロール（Scroll）」の画面では、記事がどこまで読まれているか（スクロールされているか）を見ることができます▼
赤いほどよく見られている部分で、青くなるほど見られなくなっていることが分かります！
早い段階で青くなっている記事は、ユーザーにあまり関心を向けられてない可能性があります！
リライトの対象を決めるときの判断材料になります！
「面積（Area）」の画面
「面積（Area）」の画面では、エリアごとにクリックされた割合が表示されます！
ボタンなどの配置が適切かどうかの判断材料になります！
ヒートマップツール「clarity」まとめ
今日は無料で使えるヒートマップツール「clarity（クラリティ）」について、設定方法と使い方について解説してきました！
無料とは思えないほど豊富な解析データが見れるこのツールをつかって、よりユーザーファーストの記事作成に役立てていきましょう！
コメント