WordPress用ヒートマップ『QA Heatmap Analytics』 設定と機能解説
WordPress用ヒートマップ『QA Heatmap Analytics』 設定と機能解説

WordPress用ヒートマップ『QA Heatmap Analytics』 設定と機能解説 【製品提供記事】

UZUREA編集部 アイコン

UZUREA編集部

/ 更新:

当記事では、WordPress用のヒートマッププラグイン『QA Heatmap Analytics(QA ヒートマップ・アナリティクス)』の導入方法・基本設定・使い方について解説します。

訪問者がサイトのどの部分に興味を持ち、どこをクリックしたのか?……といった点などを可視化し分析できるのがヒートマップですが、その有用さから、昨今はWordPressで構築したWebサイトに導入できるプラグインも増えてきました。

そんな中、2020年にリリースされたのがこの『QA Heatmap Analytics』。 まずはヒートマップを使ってみたいという初心者から、本格的にデータ分析やマーケティングに活用したいWebサイト制作・運用に従事しているプロフェッショナルにもお勧めできるプラグインです。

※無料でも解析ページ数に制限はあるものの全機能を利用できるプラグインですが、サイト全体を解析対象としたい……という場合には有料プランが用意されています。

『QA Heatmap Analytics』について

『QA Heatmap Analytics』は2020年2月にリリースされた、ワードプレス用プラグインです。QuarkA(クォークエイ)の代表 丸山氏ご本人Twitter)らによって制作された日本産のプログラムで、公式サイトにはその開発秘話なども掲載されています。

面倒な登録もなく簡単に導入でき、日本語サポートも充実しているのは非常ありがたいところ。機能追加やバグフィックスのアップデートも短いスパンで提供されており、開発に対する熱意が感じられます。

また、11月にリリースされたver0.9からユーザーの動きを録画した動画を再生できる『セッションリプレイ』という機能も追加され、これがなかなかすごい機能です。 ユーザーの操作動向を動画で閲覧できるというもので、ヒートマップとこのセッションリプレイを組み合わせる事で、かなり綿密なユーザービリティチェックや効果検証ができそうです。

無料版と有料版の違い、ライセンス形態

『QA Heatmap Analytics』は基本無料で利用できますが、そのままだと計測できるURL(ページ)数が1ページのみに制限されている『フリー』ライセンスが適用されています。 ただし、公式サイトのお友達紹介プログラムを利用してこのプラグインを紹介することで、紹介者本人と紹介されて利用開始したユーザー双方に『フレンド』ライセンスが適用され3ページまで計測できるようになります。

なお、当記事執筆時点(2021年2月)では、フリー、フレンドライセンス共に、計測URLの数以外の機能制限ははありません。

当サイトでも紹介した、別の無料WP用ヒートマップ・プラグイン『Aurora Heatmap』は機能自体の制限はないものの、1カ月間分のデータ解析に制限されているので、無料の範囲でヒートマップを利用したいというユーザーは状況に応じて使い分けるとよいのではないでしょうか。

有料版は最もリーズナブルな『パーソナル』ライセンスが月額3,850円のサブスクリプションで1サイトに適用できます。

プラン フリー フレンド パーソナル ライト ビジネス エージェント エンター
プライズ
月額利用
価格(税込)
0 0 3,850 8,470 12,100 46,200
ドメイン数 1 1 3 5 30
計測URL 1 3~無制限 無制限 無制限 無制限 無制限 無制限
データ保存期間 無制限 無制限 無制限 無制限 無制限 無制限 無制限
計測可能PV上限 無制限 無制限 無制限 無制限 無制限 無制限 無制限
『QA Heatmap Analytics』 ライセンス形態
最新版は公式ページ https://quarka.org/plan/ をご確認ください

※エンタープライズライセンスは、100万PV以上のサイト向け。 要問い合せ。

個人向けサイトの利用であれば、トップページや人気記事などアクセスの多いページでこのプラグインを試してみるというのが良いのではないでしょうか。

インストールの手順

『QA Heatmap Analytics』は、WordPressの管理画面からインストールできます。WordPress管理画面の左メニュー [プラグイン] > [新規追加]から『QA Heatmap Analytics』を検索し、『今すぐインストール』をクリックするだけです。

QA Heatmap Analytics をプラグインディレクトリからインストール
QA Heatmap Analytics をプラグインディレクトリからインストール

ダウンロードしFTP経由でインストールしたい、という場合には下記のページからダウンロードして下さい。

インストール後は『有効化』すれば、インストール完了です。

WordPress管理画面から、QA Heatmap Analytics を有効化
WordPress管理画面から、QA Heatmap Analytics を有効化

利用方法と設定画面について

『QA Heatmap Analytics』プラグインの有効化後、自動的にユーザーのデータを収集を開始します。そのため能動的にしなければならない設定は特にありません。

設定内容を確認・変更したい時は[WordPress管理画面] > [QA Heatmap Analytics] と進みます。

WordPress管理画面の左側メニューに
QA Heatmap Analytics の項目が追加されている。
QuarkAアイコンもかわいい
WordPress管理画面の左側メニューに
QA Heatmap Analytics の項目が追加されている。
QuarkAアイコンもかわいい

主に使用する機能としては

  • ダッシュボード
  • ヒートマップ管理

の2つでしょう。 ライセンスを取得された方は『ライセンス認証』ページからライセンス情報を入力していきますが、無料プランの場合はこの作業は必要ありません。

ダッシュボード

[WordPress管理画面] > [ダッシュボード]とアクセスすると過去24時間に完了したユーザーの行動データが一覧で表示されます。 またセッションリプレイ機能も、このダッシュボードからアクセスできます(後述)。

QA Heatmap Analytics ダッシュボード画面
端末どの端末から訪問したのかを表示
smp:スマートフォン/tab:タブレット/pc:パソコン
1ページ目ユーザーが最初に訪問したページ。クリックするとページを表示
離脱ページユーザーが離脱したページ。クリックするとページを表示
参照元ユーザーがどのチャネル(google.com/yahooなど)から訪問したのかを表示
PVこのユーザーの合計ページビュー
滞在時間ユーザーのサイト合計滞在時間
再生ここのボタンをクリックすると、『セッションリプレイ』を再生できる
『QA Heatmap Analytics』の項目

ヒートマップ管理

WordPress仮画面から[WordPress管理画面] > [ヒートマップ管理]と進むと計測しているURLごとのヒートマップ分布を見ることができます。こちらはリアルタイムのデータではなく、一定期間蓄積されてから閲覧できるようになるようです。

各デバイス(スマホ・タブレット・PC)ごとに見ることができ、各デバイスのアイコンをクリックすると、その記事のページが表示されます。

ヒートマップ管理 項目
ヒートマップ管理 項目

対象記事のアイコンをクリックすると、4つのヒートマップ機能が付与された記事へ移行します。4つのヒートマップ機能ではそれぞれ違ったデータを取得することができます。

スクロールマップユーザーのうち「何%の人がどの位置まで読んだか?」がパーセンテージで表示される
アテンションマップユーザーが「どのあたりに興味を持っているのか?」の箇所を色分けして表示される
クリックヒートマップユーザーの興味を持った箇所(マウスクリックや指のタッチ)が点で表示される
クリックカウントマップユーザーのクリックしたボタンやリンクの数が計測される
QA Heatmap で分析できるヒートマップの4項目

スクロールマップ(精読率)

どこでユーザーが離脱したのかが分かるようになっています。ページの左上にパーセンテージ表示されます。

スクロールマップ機能 スクリーンショット
スクロールマップ機能

最上部(ファーストビュー)は アクセスしたユーザーのうち何パーセントがこの画面をみているか……という事になるので当然100%、そして下に進めば進むほどパーセンテージが低くなっていきます。 LPや記事など縦に長いページの場合、極端にパーセンテージが下がっている部分のコンテンツ見直しなどに役立ちそうです。

アテンションマップ

アテンションマップでは、ユーザーの滞在ポイント(関心の強さ)を知ることができます。

アテンションマップ機能 スクリーンショット
アテンションマップ機能

暖色(赤色系)に近付くと滞在時間が長く、ユーザーが興味を示している部分。逆に寒色(青~紫系)の箇所は滞在時間が短く、ユーザーの関心が薄い部分になります。 ユーザーの注目ポイントが分かることで、コンテンツの強化や広告設置場所の変更などに使えそうです。

クリックヒートマップ

一般的な『ヒートマップ』といえば、このクリックマップでしょう。 ページのどの部分がどのくらいクリックされたのか、ユーザーの興味を持った箇所が赤外線サーモグラフィーのように分かるマップです。

クリックヒートマップ機能  スクリーンショット
クリックヒートマップ機能

記事のどこがクリックされるのかを把握することで、適切な位置に広告やリンクを貼ったりするのに役立ちそうです。

クリックカウントマップ

『クリックカウントマップ』は前述のクリックヒートマップを更に数値化したもの。

クリックカウントマップ機能  スクリーンショット
クリックカウントマップ機能

クリックしたボタンやリンクの数が計測され、何回クリックされたかがひと目で分かる仕組みになっています。

以上、4つのヒートマップ分析を活用することで、サイト改善策のヒントが沢山得られます。第三者の客観的な視点が詰まっているので、当事者が気付かない新たな発見がありそうです。

強力な『セッションリプレイ』機能

セッションリプレイ機能は『QA Heatmap Analytics』独自の強力なユーザーテスト収集機能で、アクセスしたユーザーがどういったページ遷移を辿ったかが閲覧できるというものです。

ページ遷移……といっても単なるURLの羅列ではなく、実際にユーザーがどう操作したか……というのを画面のスクロールマウスポインタの動き、そしてクリックした場所などをリアルタイム録画した動画で再生できるのです。

セッションリプレイの再生ボタン
セッションリプレイの再生ボタン

[WordPress管理画面] > [ダッシュボード]とアクセスしたダッシュボードの一覧の右側にある『再生ボタン』から再生画面に勧めます。

前述した4種のヒートマップ機能を、さらに動的にした解析ツールとして本格的なページ解析ができます。 ページの問題点チェックや、Webリニューアルのプレゼンテーション、コンバージョンへ至るユーザーの動向など、この機能から得られる見地はかなり多いでしょう。

まとめ、総合評価・関連リンク

以上、ユーザーの行動を細かく分析できる便利なプラグイン『QA Heatmap Analytics』について解説しました。

ヒートマップ系のWordPressプラグインでは『Aurora Heatmap』『Heatmap UserHeat』などが有名ですが、機能面では今の所この『QA Heatmap Analytics』が一歩抜きんでていると感じました。

唯一欠点を挙げるとするならば、フリー(無料)プランの場合、ヒートマップ分析できるURLが1つしか選択できないという点。1つの記事しかデータを計測することができないため、記事数が膨大なブログやWebメディアで利用する方は、少し歯がゆさを感じるかもしれません。

そして、業務としてWeb制作や運用、コンサルティングに関わる企業や事業所であれば、このプラグインが強力な営業・解析ツールとなりそうな予感がします。 運営の問題点チェックや、リニューアルのプレゼンテーション、効果検証など、その用途はかなり多くなりそうです。

この記事で興味をもっていただけた方は、まずは悩まずに無料プランで一度使ってみて下さい。 感動すること間違いなしです。

総合評価

インストールのしやすさ★★★★☆(4.5)
プラグインディレクトリから簡単にインストール・有効化できる。
設定の柔軟性★★★★(4.0)
複雑な設定はなく、シンプルで分かりやすい。
データ保存期間やDBの使用容量を自分で設定できるのもありがたい。
機能★★★★☆(4.5)
ヒートマップは便利で、『セッションリプレイ』も強力。
ただし無料プランだと1URL(友達紹介プログラムを使って3URL)しか分析できず、やや物足りない。
有料版であれば制限は解除され高機能に。 多サイト運営用のライセンスも。
価格★★★(3)
有料版はサブスクリプション ¥3,850(本体¥3,500)/月より。
個人サイト/ブロガーにはやや高額かも。
総合評価★★★★☆(4.0)
本格的なヒートマップ分析を日本語サポート付きで利用できるので、ヒートマップ入門者には打ってつけのプラグイン。
2021年2月現在、やや動作や表示が不安点な箇所があるも、頻繁にアップデートされているので、今後に期待大
QA Heatmap Analytics 総合評価
ワードプレス公式プラグイン|QA Heatmap Analytics ver0.9 新機能がすごい!
WordPress用ヒートマップ『QA Heatmap Analytics』 設定と機能解説

この記事をシェアする

この記事のタイトルとアドレスをコピー

この記事を気に入ったらハートマークで応援してください

この記事の執筆は……

UZUREA編集部 アイコン

UZUREA編集部

UZUREA.NET 編集部アカウント。 webデザイン会社altstackのメンバー、及び契約ライターによる匿名寄稿を含みます。


page top