より読者の方の役に立つサイトを作成するために、読者がサイトのどこに注目して、どこで離脱してしまったのかを把握することは、サイトのアクセスアップのために非常に重要です。
読者のサイト内での動きをより可視化できないかと思って調べてみたら、「ヒートマップ」というツールに出会いました。
ヒートマップって名前は聞くけど、そもそも何？どんなことが出来て、どうやって改善できるの？と思い詳しく調べてみました。
この記事ではヒートマップとは何かを詳しく解説し、機能や特徴、おすすめのヒートマップツールまで、ご紹介していきます。
1. ヒートマップとは？
ヒートマップとは、「色を使って、訪問者がWebサイト内をどのように見ているかを可視化する手法」です。
Webサイトの特定ページを分析した時、数値ばかりの結果一覧だと分かりにくいかと思います。
ヒートマップを用いることで、数値ではなく視覚的に、ユーザがサイト内の特定ページに対して、どこをよく見てクリックし、ページ内から離脱しているのはどこなのか、といったページ内でのユーザの行動を細かく分析することが出来、サイト改善に役立てやすくなるのです。
特徴としては、色を用いて、分析結果をサーモグラフィのように、グラデーションで表現していることです。赤や黄色といったカラフルな色を使って一目で分かりやすく表現されているため、分析になれていないユーザにも理解しやすいというメリットがあります。
では具体的にどのように可視化されているのか、その仕組みをご紹介します。
2. ヒートマップの仕組み
ヒートマップは主に
・マウスの動き
・クリックされた箇所
・スクロールの位置
・滞在時間
といった数値化されたものを、分類して色づけしています。
ページ内の各要素のアクセス数を照らし合わせて確認するのは大変ですが、色づけされて視覚化されたページを確認するだけで良いので、簡単に分析結果を把握することが可能となります。
赤がよくクリックされるところ、青があまりクリックされないところ、というように、数値の高いものほど赤く表現されることが一般的です。
3. ヒートマップの分析機能
ここではそれぞれの数値を視覚化したヒートマップで、どういった分析ができるのかについてご紹介したいと思います。また、ツールによっては多少変わることもありますが、ヒートマップの機能も一緒にご紹介していきます。
3-1. マウスの動きを可視化「行動傾向の分析」
ユーザがページのどこを見ているのか、その動きを可視化する（マウストラッキング）で行動傾向を把握することが出来ます。多くのユーザが特定の箇所にカーソルをあてている、年代などある条件にしぼったユーザはこういう動きをしている、といった行動傾向を把握することが可能になります。
一番見てほしい箇所をしっかりと通っているか、何度も上部に戻っているといったことなく、ユーザが知りたい情報を整理して伝えられているか分かるので、改善に役立ちます。
ヒートマップの機能としてはマウスムーブヒートマップといいます。
3-2. クリック箇所の可視化「導線分析」
ユーザがページを訪れてから、最初にクリックする場所はどこなのか、最後にクリックする場所は売上げなどのコンバージョンに繋がっていく箇所なのか、そういったクリックする箇所からユーザのページ内での導線を可視化する（クリックトラッキング）ことができます。
全く意図していない箇所をクリックしている場合には、その箇所の位置を変更したり、なくすといった修正することが可能です。自分たちがページ内で見てほしい部分を通る流れになっているのかを確認することで、目的達成までの流れをより強化することができるでしょう。
ヒートマップの機能では、クリックヒートマップといいます。
3-3. スクロール位置の可視化「離脱箇所の分析」
ユーザがページのどの部分まで確認したのかを可視化する（スクロールトラッキング）ことで離脱箇所を確認することができます。
例えば、ページの冒頭部分で離脱していることが多ければ、ランディングページなどの流入元の情報と該当ページの情報が一致しておらず、ユーザが求める情報が載っていなかったということも考えられます。離脱箇所を確認することも、ページ内の改善に大変役立つのです。
ヒートマップの機能としてはスクロールヒートマップといいます。
3-4. 滞在時間の可視化「熟読箇所の分析」
ユーザがページ内のどの箇所で長く滞在したのかを可視化することで熟読箇所を把握することが出来ます。反対にあまり読まれていない箇所も把握することができるので、両面からの改善が可能となります。
ヒートマップではアテンション、熟読エリア分析等と言われることが多いようです。
4. ユーザテストとの違い
ユーザテストとは、ユーザにサイトやツールを使ってもらい、意見や改善点の発見などに役立てることです。今回の場合であれば、実際にページを使ってもらい、感想や使いにくかった点、分かりづらい点などを確認するような形が考えられます。
ヒートマップとの大きな違いとしては、ヒートマップが数値などのデータであることに対して、数値だけでは判断できない、ユーザの心理を把握できる点でしょう。
この二つを並行して使うことで、まずはヒートマップでページ内のアクセス状況から改善ポイントを特定し、実際にどういった問題や課題が隠れているのかをユーザテストで確認して、より使いやすい形に改善していくということが可能です。ヒートマップの活用にあわせて、ユーザテストの活用も検討してみても良いかもしれません。
5. ヒートマップを使って分析結果を改善する方法
ここではヒートマップを活用して、実際にどのような改善に繋げることができるのか、改善手法をご紹介していきます。
5-1. コンバージョン率の改善
ページに訪れても、コンバージョンに繋がらなければ意味がありません。コンバージョンとはサイトの最終目的を達成することで、ECサイトでは商品の購入、ECサイト以外では企業の認知度の向上、登録者数のアップといったように、企業によってその目的は異なります。
例えばECサイトの場合、商品の購入がコンバージョンとなることが多いので分かりやすいでしょう。商品紹介ページでヒートマップを活用した場合、商品の購入までにページのどの部分見ているのかを確認していきます。商品画像をクリックして離脱している場合には、商品画像が小さすぎて分かりづらいといったことが分かります。商品の魅力について長々と説明していて、商品詳細まで到達していないといった課題なども見えてくるかもしれません。こうしたページ内での課題を一つ一つ整理していくのにヒートマップがとても役立つでしょう。
5-2. 離脱率の低下
コンバージョンアップには、離脱ポイントの特定はとても重要です。商品の購入ボタンよりはるかに前の段階で離脱している場合には、いくら購入ボタン付近の情報を改善しても見てもらえないのです。
スクロールトラッキングを活用してよく離脱に繋がっている部分を特定し、内容の修正や全体配置を変更することで、離脱率の低下につながり、コンバージョンアップにも繋がっていくでしょう。
5-3. 導線の改善
ユーザが意図する流れでページ内を移動しているのか、特にリンクやボタンの配置などで改善することも多いです。そこで、マウストラッキングやクリックトラッキングを活用して確認してみましょう。
例えば、資料請求を増やすことが目的となるページの場合、「資料請求はこちら」などと書かれた資料請求ボタンの配置は重要となるでしょう。ヒートマップを活用することで、わかりづらい位置にないか、画面の上部と下部など複数配置すべきかといったことが分析できます。
5-4. コンテンツや配置の改善
先にも述べたボタンやリンクの配置もその一つですが、視覚的なコンテンツもとても重要な要素です。例えば、画像や動画などです。全く見られていない画像などがあれば、画像自体を変更するといった対応が必要になるでしょう。
ユーザはまず文字よりも画像や動画に目を向けるので、そこが全く見られていないとなると、その画像自体が内容と合っていなかったり、情報として薄い可能性が高くなります。コンテンツ自体や配置もマウストラッキングを用いて確認してみると良いでしょう。
6. おすすめのヒートマップツール
ヒートマップツールには、無料と有料があります。ヒートマップツール自体に慣れることも大切なので、まずは無料ツールをある程度使って、必要な機能などを確認してから、必要な機能が充実した有料ツールで本格的に改善していくといった使い方もおすすめです。ここでは、いくつかヒートマップツールをご紹介します。
6-1. MIERUCA
無料プランと有料プランがあり、有料プランは9,800円/月～となっています。
計測可能なPV数の上限などで料金が分かれているので、比較的PV数が少ないページで、無料プランを試してみることもできます。無料プランは1万PVまで使うことができます。
ヒートマップの機能としては、スクロールヒートマップ・クリックヒートマップ・アテンションヒートマップが使えます。有料プランではABテストなど分析機能も使うことができます。
6-2. Ptengine
Ptengineも無料プランがあります。3000PVまで無料プランを利用することが可能で、有料プランは14,800円/月～となっています。
データ分析の機能が充実していて、有料プランによっては12ヶ月のデータ保存も可能となっています。過去のデータを活用して分析すると、より課題が発見しやすいので、大きな特徴といえるでしょう。
6-3. User Heat
User Heatは無料版のみのヒートマップツールです。他の無料ツールより多い30万PVまで無料で利用できるのが特徴です。
クリックヒートマップ、マウスムーブヒートマップ、スクロールヒートマップ、アテンションヒートマップの4つのヒートマップ機能に加えて、スクロールヒートマップとは別で離脱エリアをヒートマップ機能の一つとして提供しており、無料で使えるヒートマップ機能がとても充実しています。
6-4. User Insight
先ほどご紹介した「User Heat」と同じ会社が運営しています。企業向けのヒートマップツールです。
ヒートマップの機能としては、アテンションヒートマップ、クリックヒートマップ、スクロールヒートマップが利用できます。全クリックエリアや性別や年齢で絞り込んだヒートマップもあり、より詳細な分析が可能です。
料金は問合せが必要となります。
6-5. Contentsquare（Clicktale）
Clicktaleは、Contentsquare（コンテントスクエア）と統合し、サービス展開をおこなっています。
機能や料金などの詳細は要問合せとなっていますが、有名なヒートマップツールですので、興味があれば一度問合せしてみても良いでしょう。
7. まとめ
いかがだったでしょうか？ヒートマップの機能やしくみなどについてご紹介しましたが、いくつか並行してヒートマップツールを使ってみると、相性の良いツールに出会えるかもしれません。コンバージョンに繋がるページや、離脱率が高いページなど、特定のページの課題を発見して、改善につなげたい、そんな場合にヒートマップツールは活躍してくれると思います。他の分析ツールとも上手く組み合わせながら、改善に繋げていってもらえればと思います。
