ユーザーのページ内の行動を見える化する「ヒートマップ」

Webサイトの利用状況を把握するための代表的なツールとしてアクセス解析ツールがありますが、Google Analyticsといった無料のツールもあることから、企業が自社のWebサイトに導入することが一般的になってきています。

それにより、アクセス解析ツールを導入することで把握できるPV（ページビュー）数やUU（ユニークユーザー）数、CVR（コンバージョンレート）等の指標をKPI/KGI（目標達成指標。詳しくはこちらのコラムでご紹介しています）として設けられている企業も少なくありません。そのため、多くのWeb担当者は日々これらの数値と戦い、なんとかいい数字を出そうと努力していると思いますが、そもそも数値が分かったところで何をどう改善すればいいかは分からないという方も多いのではないでしょうか。

「どう改善すればいいのか？」を把握するために、マイクロウェーブでは前回のコラムでもご紹介しましたが、「ユーザー行動観察調査」を推奨しています。「ユーザー行動観察調査」の手法は様々ありますが、本コラムではユーザーのページ内の行動を見える化する「ヒートマップ」についてご紹介します。

ヒートマップとは

ヒートマップ（Heatmap）とは、Webページ上に配置されているボタンや画像といった要素のクリック率やマウスの動きなどの情報を、頻度や程度によって色分けして示した図のことです。ユーザーの視線やマウスポイントが集中する箇所、集中傾向を実際のWebサイトのページと重ねあわせて表示します。

もともと「ヒートマップ」という言葉は、温度の高低を色の違いで表現した温度分布図を意味しています。Webマーケティングにおいてはユーザーの動きを色の違いで表現し、Webサイトページのレイアウト、デザイン、ユーザビリティ、広告の出稿位置等の検討・検証に用いられています。

ヒートマップにもいくつか種類があるのですが、その中に、人の眼球の動きを記録して分析する「アイトラッキング」という手法があります。それは特殊な計測装置を利用し、印刷物やWebサイト画面等を見るときの眼の動きを計測し、ヒートマップ等で表示させ、どこに注目していたかを判断する手法です。視線は無意識に移動するため、よりユーザーの直感的な動きとその深層心理に繋がる結果を得ることが出来ます。

しかし「アイトラッキング」は、コストも高く、被験者や実施場所の確保などの手間もかかり、頻繁に実施するのが難しいといった問題があります。そんな中、もっと手軽にユーザーのページ内の動きを「見える化」させるために、主にマウスの動きなどを計測し、簡易的にヒートマップを作成するツールが開発されてきました。

ヒートマップツールの種類・機能

実は驚くことに、Webサイト閲覧時のユーザーの“マウスの動き”と“視線の動き”は、84％～88％の精度で一致しているという研究結果がでています。つまり、マウスの動きを記録・分析することで、かなり高い精度でユーザーのWebサイト閲覧時の行動と注目ポイントが分かると言えます。

現在提供されているヒートマップツールは、無料のものと有料のものがあり、大きく分けると「ヒートマップ特化型」と「多機能兼備型」の2つのタイプがあります。「特化型タイプ」は文字通りヒートマップ機能に特化したもので、特にハイエンドなツールとなれば「分析力」と「カスタマイズ性」が高いのが特徴です。それに対して「兼備型タイプ」は、アスセス解析ツールなどと一体化しており、複数の分析がカバーできるという「便利さ」が特徴です。

どちらタイプもそれぞれのメリット・デメリットがありますので、導入するタイプの選定を行う際は、自社サイトとの親和性や、ツールの二重管理とデータ間のズレによる業務負荷の増加等のリスクを避けるため、自社の現状と導入目的を明確にしたうえで判断する必要があります。

また、一概に「ヒートマップ」といっても、ツールによって異なる種類のデータをヒートマップで表示しています。例えば一般的な「クリックヒートマップ」（クリックされた箇所を表示するもの）と「マウスムーブヒートマップ」（マウスの動きなどに基づいた情報を表示するもの）以外にも、「注目度ヒートマップ」（エリア範囲でよく見られているかどうかを反映するもの）や「スクロール到達度ヒートマップ」（ユーザーがページ上でどこまでスクロールしているかを反映するもの）などもあります。

アクセス解析との違い

通常のアクセス解析は、どのページがどれだけ見られたか、どのようなセッションが発生したか、どのような遷移だったのか等を中心に分析します。その元となるのはいわゆるアクセスログで、サーバへのリクエストデータ等が分析対象となります。サイト全体のパフォーマンスや流入経緯、ページ間の遷移や滞在時間、ページごとの直帰率や離脱率等、サイト全体の定量的な数値を把握することが出来ます。

その結果から、どのページがよく見られているからもっと力を入れるべきといったことや、逆にあまり見られていないので導線を改善すべきなのではないかといった方向性が見えてくる（あるいは「仮説」が立てられる）のですが、一つのページに絞って「あのページのどこをどう改善すればいいのか？」という質問には簡単に答えられるものではありません。

一方、ユーザーの各ページにおける動きを捉えたヒートマップを使えば、Webサイトを訪れてくる人の行動や、その背後にある「心理」（気持ち）をもっと理解するため、ページ内でユーザーがどこをクリックしたのか、どの画像やテキストに興味を示したのかといった、アクセス解析データだけでは掴みきれなかったWebマーケティングにおいて極めて重要なユーザーのインサイトを導き出すことが可能になります。

Webサイトの改善をする際は、まずアクセス解析で全体像・傾向を掴み、更にヒートマップを使ってユーザーの細かい行動を把握し、そして把握した現状を基に仮説を立て、A/Bテスト等でその仮説を検証する、というシナリオを実践すると効果的です。Webサイト全体を「広く浅く」見るアクセス解析と、個々ページを「狭く深く」見るヒートマップをうまく連携すれば、Webサイトにある問題点や秘められている可能性をマクロとミクロ両方から攻めることができるようになり、より精度の高い改善案と施策が生み出せるようになります。

ヒートマップの活用

ヒートマップの有効活用によって、どのようなことが実現できるのかをいくつかご紹介します。

• 入り口となるランディングページの最適化

  Webサイトのトップページと予め用意したランディングページに力を入れるのは一般的な考え方ですが、実際他にもアクセス数が多い、つまり集客力が高く、多くのユーザーがWebサイトとの第一接点となっているページがあったりします。これらのページにおけるユーザーの行動をヒートマップで重点的に分析することで、ユーザーのニーズを読み取る手がかりになり、見てほしいところと実際にユーザーの関心のあるところと対照すれば、SEO対策の見直しやWebサイトページのポテンシャル再発見のきっかけにもなります。

• ページ閲覧時の関心や注目箇所が明確に

  ユーザーがページ内の画像やテキストのどの部分を注目していたのかを知るには、アクセス解析ツールのような数値系のものでは難しいのですが、ヒートマップならそれを視覚化して表示することができるので、リンクのないところに興味があったことや、どこの情報を重点的に閲覧していたかなど、通常のアクセス解析では気づかないユーザーの行動が発見でき、本当に重要なコンテンツの洗い出しに役たちます。

• ページ構成と情報設計の合理性の向上

  Webサイトを構築する際、ユーザー行動のシナリオを立ててレイアウトやボタンの場所、コンテンツの配置等を設計していますが、実際にユーザーはそう簡単に想定通りに動いてくれません。ヒートマップからユーザーのリアルな利用習慣と行動が映し出され、リンクがないのにクリックされていたり、入力フォームの途中で諦めたりするといった想定外の動きも分かってきます。
  このようにレイアウトを変更したらユーザーにとって使いやすくなる、ここに導線を敷けば次のステップに進んでもらえる等、ユーザビリティと情報構成の改善による離脱率・直帰率の低下、サイト内回遊率の向上が期待でき、Webサイト全体の合理化とコンバージョン率アップに繋げることができます。

まとめ

コンバージョンに影響を与える要素を導き出すヒントは、ユーザー行動の中に隠れています。それを読み取るためには、ユーザー行動観察調査やヒートマップのような手法・ツールが有効です。しかしどんな手法・ツールでもあくまで手段であり、実施・導入自体は目的ではありません。例えヒートマップでユーザー行動が可視化されて把握出来たとしても、どこに問題があるのか、どうすれば良いのかの答えを出してくれるわけではありません。得られた情報に基づいて仮説を立て検証していくことが大切です。

もちろんどんな手法でも得意・苦手分野があり、メリット・デメリットもあります。また、単独に利用するのではなく、他手法と併用してこそ効果を最大限に発揮できるものもあります。導入を検討する際、自社の状況と目的を明確にした上でツール・手法を選択することで、より成果の出せるWebマーケティングが可能になります。

■本コラムの元記事はこちら
ユーザーのページ内の行動を見える化する「ヒートマップ」

Webやアプリに関するコラムを配信しています！

■株式会社マイクロウェーブ

株式会社マイクロウェーブは、Webを活用した事業戦略立案、マーケティング、
Webサイト構築、Webシステム開発から、スマートフォン/タブレット用アプリ
ケーションの開発等を行っています。

HP： http://www.micro-wave.net/