【保存版】ヒートマップツールで超簡単にWebサイトのCVをアップする方法

「せっかくページを作ったのに成果が出ない…もう泣きそう･･･」ランディングページ制作でこんなことに悩まされていませんか？
実際ランディングページって、作ってすぐに売れることってなかなかありません。年間150本ほどのランディングページをつくる弊社でも、いきなり売れるケースって実はそんなに多くないんです。
ランディングページは、リリースしてからも運用を行いながら改善をしていく必要があるのです。

しかし、「分析」とか「数値的」な難しい話は難しそうで苦手…という方も結構多いのではないんでしょうか。
でも今回紹介するヒートマップツールを使えば、 ユーザー心理や行動を視覚化してくれるので、分析が苦手な人でもサイトの質やCVを改善できます。
この記事ではヒートマップのメリットや基本的な機能から、使えるヒートマップツールまで紹介していきます。

ヒートマップツールとは？

ヒートマップツールとは、色を使ってユーザーのWebページに対するアクションを可視化できるツールです。

・ページのどの部分が一番見られているか
・どこが一番クリックされているか
・どこで離脱されてしまっているか
などユーザーの行動が色となって表してくれるため、簡単に理解することができます。

また最近はヒートマップツールも進化していて、マウスの動きやスワイプの動きなど様々な情報を把握できます。
いまやヒートマップは、ページを改善していく上で欠かせないツールの1つです。

ヒートマップのメリット

ユーザーのページ内での動きを分析できる

ページにいたるまでのユーザーの動きを確認できた従来のアクセス解析ツールとは違い、ヒートマップではページ上でのユーザーの動きを可視化できます。
ページ内でのユーザーの動きを理解できるため、コンテンツに対する反応を細かく分析できサイトの改善に役立てられます。

サイトの画面全体を分析出来る

どの部分がよく見られていて、どの部分で離脱が多いのかを分析することでサイト全体の構成を見直すことができます。コンテンツの順番、コンテンツの内容がユーザーの求めているものなのかをテストしながら判断し、質の高いページに改善していくことが可能です。

ユーザーの注目点が分かる

マウスの動きを可視化することで、ユーザーの視線がどこに注目されているかも確認することが出来ます。マウスと視線の動きは80％以上の確率で連動しています。マウスムーブヒートマップツールを使うことで、クリックとは別に、どの点に注目が集まっているか確認することが可能です。
つまり、ヒートマップでは、従来の分析方法では分からなかったユーザーの行動がよりリアルに、より分かりやすく分析できるようになったのです。

ヒートマップのデメリット

「そのページの要素が本当にいいのか悪いのか」は分からない

例えばあるコンテンツで滞在時間が長い場合、ヒートマップ上のデータからは「理解しにくいから長く見ているのか」「興味があるから見ているのか」「目立っているから見ているのか」ということは読み取れません。

あくまでも今ある要素の中で比べた時に一番見られているのが、そのコンテンツだったということです。データからすぐに結論を出すのではなく、データを基にテスト・検証を繰り返していくことが重要です。

ヒートマップツール4つの主要機能

・アテンションヒートマップ
ユーザーのサイト上の滞在時間を計測し、ユーザーが熟読している箇所やコンテンツをより濃い色で表示してくれるヒートマップ機能です。
あまり読まれず、スキップされている箇所は薄い色で表示されます。

・マウスムーブヒートマップ
ユーザーのサイト上でのマウスの動きをサーモグラフィーのように表示させるヒートマップ機能です。
長くマウスがおいてあった、カーソルが動かされたといった箇所は濃い色で表示されます。

・リックヒートマップ
ユーザーがクリックした箇所を表示するヒートマップ機能です。多くクリックされた箇所は濃い色で表示されます。ボタン機能のクリックはもちろんですが、クリックしても反応されない画像やテキストのクリックも表示されます。

・スクロールヒートマップ
スマートフォンが普及してから、クリック分析だけでなく、スクロールの分析にもかなり注目が集まっています。このヒートマップ機能は、ユーザーがサイトのどこまでをスクロールして見たかを確認できます。サイトの上の方が濃い色になり、下の方になれば離脱者が増え、薄い色で表示されます。

ヒートマップで気づける問題点

今までの分析とは異なった方法のヒートマップツールですが、これらの機能が従来の分析とどう違い、どう役に立つのでしょうか。

クリック出来ない箇所がクリックされていて、ユーザー心理に沿えていない

ヒートマップツールを使った結果、誤ってクリックされている箇所がテキストの場合は、ユーザーから見てそのテキストがクリック出来そうなデザインになってしまっている可能性が高いです。
また、写真や画像でしたら「アップにしてもっと詳しくみたい」というユーザー心理が働いている可能性もあります。
テキストの場合も、内容や配置場所によって「もっと詳しく知りたい」という心理があるかもしれません。

テキストを多くクリックされていた場合の改善方法は、本当のリンク先をもっと分かりやすい場所に置くなどの改善をすること、画像はクリックすることで拡大出来るような仕様にするなどの改善方法があります。
ヒートマップツールを使い、ユーザーの「知りたい」という気持ちをサイト上で満足させられれば、CVが上がる可能性大です！

読んで欲しい箇所があまり注目されていなかった

この場合の理由は、文章の配置場所が悪かった、または他のところに目線を奪われてしまうデザインだった、などが考えられます。
また、1回は注目したがターゲットの読みたい内容ではなかった、という場合もあります。

どういった理由で読まれていないのかを考えた上で、読ませたい文章をターゲットが興味のありそうなライティングに寄せ、デザイン的にも注目されやすい魅せ方にしましょう。
まずは目を向けてもらうこと、次に内容を正しくすることが大事です。でも、ヒートマップツールで分析した結果、読んでほしい個所が注目されていたとしても、その理由が「文章が分かりにくいから何度も読んでいた」というマイナスな場合もあります。

ユーザーが思ったよりも早い段階でサイトを離脱していた

ターゲットが離脱するのは、このサイトにはもう興味がないなと思われてしまうからです。
従来の分析ではどのくらいの滞在時間かは分かっても、ヒートマップツールのようにどこで離脱しているかまでは分かりませんでした。

ヒートマップツールで分かった、ユーザーが多く離脱してしまっている箇所には、商品の解説や説明などのコンテンツを置くことは一旦避けましょう。
それよりも、ユーザーが驚く、ワクワクするようなコンテンツをいれたほうが、興味を引けます。

離脱があまりにも早いという場合は、広告を出しているターゲットの見直しも必要です。

ヒートマップツールをご紹介！

では、実際にどのようなヒートマップツールがあるのかをご紹介します。
「ヒートマップツールを使うのが初めて」という方は、まずは無料版のヒートマップツールで試してみるのがいいでしょう。

無料で使えるもの

・User Heat

月間30万PVまで無料で使えるヒートマップツールです。
後ほど紹介する有料のヒートマップツール「User Insight」の無料版です。

無料版といっても、ヒートマップツールの基本的機能はちゃんと備わっています。「マウス」「クリック」「熟読エリア」「終了エリア」「離脱エリア」と5つの機能があり、パソコンとスマートフォン、どちらも対応しています。また、ヒートマップの初心者でも使いやすいようにユーザー登録からヒートマップツールを使うまでの行程も簡単です。

User Heatのサイトはこちら

・SiTest

初の人工知能を搭載したヒートマップツールです。こちらは完全無料版ではありませんが、1ヶ月間無料で使うことが出来ます。
無料版でも3万PVの計測ができ、動画の録画機能も300RECまで可能です。利用可能ページはなんと無制限です。

機能はスクロール解析、リンク指標、マウスグラフィ、タップ解析が利用できます。その他の分析ツールとしてスプリット機能解析機能、フォーム改善機能も搭載。30万以上のアカウントに使われています。

SiTestのサイトはこちら

・MIERUCA

月間1万PVまで計測できるヒートマップツールです。
機能はスクロール解析機能(読了・離脱率)、クリックヒートマップ機能(クリック・タップ)、アテンションヒートマップ機能(熟読エリア確認)の3種類です。

全部で6つのプランがありますが、どれも無料で試すことが出来るのも魅力です。
また、計測するサイトの文字数に対して、ユーザーがどのくらいしっかりと記事を読んでいるのかを計測する「有効熟読率」という機能もついています。

MIERUCAのサイトはこちら

・Ptengine
スマートフォン・PC タブレットに対応しており、25,000 PVまで無料です。
メールアドレスと簡単な情報を登録するだけで利用できます。

サイト内で今見られているページや訪れているユーザー情報を、リアルタイムで見ることができるのが特徴です。
また、分析レポートも URLで簡単にシェアできるため、チームのメンバーと連携して改善を行う際に便利でしょう。 WordPressのプラグインも用意されています。

Ptengineのサイトはこちら

有料で使えるもの

次は有料のヒートマップツールを紹介します。無料のヒートマップツールとの違いは、使える機能が多くなることや、データ保持期間や利用できるユーザー数、ページ数が多くなることです。

・Mouseflow
Mouseflowは、株式会社APOLLO11という会社が取り扱ってるヒートマップツールで、欧米での使用が盛んです。現在100万社以上の企業に導入されている有名ヒートマップツールです。

ヒートマップツールの他にも、ユーザーのクリックやスクロールの動きを録画する機能も使用することが出来ます。月額2,573円（※）から利用が可能で、無料トライアルも行っています。
※金額は2018年04月18日 19時50分04秒の為替レートにて計算されているものです。

Mouseflowのサイトはこちら

・USERDIVE

USERDIVEはヒートマップツールとアクセス分析ツールを組み合わせて分析します。

PCとスマートフォンに対応したヒートマップツールで、動画分析、マウスヒートマップ、クリックヒートマップ、スクロールヒートマップ、ルッキングヒートマップ、フォーム分析の6つの機能を持ち合わせています。
またアプリに対応したUSERDIVE for Appsというヒートマップツールも提供しています。

USERDIVEのサイトはこちら

・User Insight

早稲田大学の大学院での研究をもとにして作られたヒートマップツールです。先程、無料版のヒートマップツールでご紹介したUserHeatの有料版でもあります。
首相官邸や大手企業など、多くの企業が導入しています。

価格は5万円～/月で、熟読エリア、終了エリア、クリックエリア、全クリックエリア別での機能が搭載されています。
パソコン、スマートフォン、タブレットなどマルチデバイスに対応しています。また、Google Analyticsと似ている仕様になっており、ヒートマップツールを触ったことがない人でも扱いやすくなっています。

User Insightのサイトはこちら

・appsee　

こちらはアプリのユーザー分析ができるヒートマップツールです。ヒートマップ機能はユーザ記録（ビデオレコーディング）、タッチヒートマップ、アプリ利用分析、イベント自動記録、クラッシュレポートがあり、GoogleAnalyticsなどとの統合も可能です。

このヒートマップツールには2種類の料金プランがあり、片方のプランでは、2週間の無料トライアルも出来ます。金額は解析数やビデオの録画数によって異なりますが、95,000円～/月です。

appseeのサイトはこちら

・clicktale
イスラエルで開発され、現在では世界で約100,000社が導入している解析ツールです。
ユーザーの行動を可視化するために、リアルタイムモニターやフォームの解析、コンバージョン・ファネルなどの機能が実装されています。

メイン機能であるヒートマップ機能では、マウスの動きを集計してマウスヒートマップとして表示してくれます。訪問ユーザーがどこに注目しているのかが可視化されるため、全訪問者のマウスの動きやスクロールの視覚化が行われ、コンバージョン率の改善やユーザビリティの向上に役立ちます。
日本語でのサポート体制も整っていますので、導入時はもちろんツールの活用法なども相談できます。

clicktaleのサイトはこちら

・VWO
ヒートマップ機能を搭載したA/Bテストツールであり、マウスの動きやクリックを計測するアテンションヒートマップ、PCやタブレットで見る事ができるクリックマップ、スクロールマップにも対応しています。
HTML/ CSSの知識やデザイナーがいなくても A/Bテストを実施できます。

そのほか、 A/Bテスト以外にも、ヒートマップで仮説の設定が可能で、ホームページ内のどこがよくクリックされているのかを把握し、訪問ユーザーの行動を可視化することができます。
スマートフォンのホームページにも対応しており、フォームを分析してどこの項目で離脱が起きたのかというデータを抽出、そのデータをもとにフォームの最適化、多岐にわたるセグメント機能によって細かな分析が可能です。

VWOのサイトはこちら

「優れた」ツールがいいとは限らない

たくさんのヒートマップツールを紹介しましたがヒートマップツールの選び方のポイントは、どれが1番すぐれたツールかではありません。

あなたが分析したい内容、あなたの持っているサイトに一番合っているかどうかが重要です。
ヒートマップツールの機能や、統合できる他の解析ツールなどもしっかり見て選びましょう。

また、初めてヒートマップツールを使う方は、まずは無料版のヒートマップツールを使ってみる、または有料版ヒートマップツールのお試しバージョンを使ってどのような使い方ができるかを試してみるのもいいでしょう。

まとめ

今回の内容をまとめると
・ヒートマップツールとは「ユーザーがWebサイト上でとった行動を、色で判断できるツール」
・ヒートマップツールのメリットは「サイトの画面全体を分析出来る」
「ユーザーの注目点が分かる」
・ヒートマップツール選ぶときは「使う目的を定めて選ぶ」こと
リアルなユーザーの行動は、ユーザー視点にたったサイトを作成する上で必要不可欠です。様々なヒートマップツールがあり、迷うかと思いますが目的に応じて使い分け、自社サイトの改善を行っていきましょう。