スマホ解析は「タッチアクション」ヒートマップにおまかせ | SiTest (サイテスト) ブログ

メニューボタン閉じるボタン

スマホ解析は「タッチアクション」ヒートマップにおまかせ

スマートフォンが普及した現在、多くのサイトでスマートフォンからのアクセスが半分以上を占めるようになっています。
つまり、これからの時代はスマートフォン向けにサイトやページを最適化していく必要があります。

しかし、サイトの最適化をしていく中で、パソコンとスマートフォンでは解析の手段やみるべきポイントが異なります。
その理由は、画面の大きさやユーザーの行動目的などに加えて、スマートフォンではフリックやスワイプなど、パソコンに比べてユーザーがとれる行動の種類が豊富であることが考えられます。

今回は、スマートフォン特有のスワイプやフリックなどの動きを追跡できるヒートマップ「タッチアクション」の見方と、その活用方法をご紹介します。

目次

タッチアクションヒートマップとは

スマホ特有のフリックやスワイプがどこで発生したのかを視覚化


タッチアクションヒートマップとは、スマートフォン向けサイト用のヒートマップです。
スマートフォン特有のアクションである「スワイプ」「フリック」「ピンチアウト(拡大の動き)」「ピンチイン(縮小の動き)」がどこで、どのくらい発生しているのかを6種のアイコンによって視覚化します。

上記の動きが発生している場所を視覚化することで、「タップ解析」ヒートマップとは別の切り口でユーザビリティの検証とコンテンツの評価ができるようになります。

※スワイプ:ディスプレイに指が触れた状態で、指を動かすジェスチャー操作です。上にスワイプした場合、画面が下に移動します。
※フリック:ディスプレイ上で、弾くように指を動かすジェスチャー操作です。上にフリックした場合、画面が下に素早く移動します。

タッチアクションヒートマップで検証できること

タッチアクションで追跡できるスワイプ、フリック、ピンチイン、ピンチアウトがどこで発生しているかを分析することで、スマートフォン向けにサイトの利便性を向上させる施策に結びつけます。

タッチアクションによって、以下の5項目を検証できます。

① 熟読されているコンテンツはどれか

スワイプが発生している位置を分析することで、熟読されているコンテンツがわかります。

タッチアクションヒートマップでは、スワイプが青の矢印で表示されます。
上下の青矢印が多く確認できる部分は、ユーザーがその部分を繰り返し閲覧している可能性が高いです。

② 読み飛ばされているコンテンツはどれか

フリックが発生している位置を分析することで、読み飛ばされているコンテンツがわかります。

タッチアクションヒートマップでは、フリックが緑の矢印で表示されます。
フリックは、指で軽く弾くようなジェスチャー操作で、画面を素早くスクロールさせます。
したがって、上方向に緑矢印が多い箇所とその下のコンテンツは、素早くスクロールされ読み飛ばされている可能性が高くなります。

③ 表やカルーセルなど横スクロールが必要なコンテンツが確認されているか

タッチアクションヒートマップでは、横方向へのスワイプ、フリックも計測しています。
スマートフォン向けのサイトでは、画面を広く使うために表を横スクロールで閲覧できるようにしたり、ページが縦に長くなることを避けて、カルーセルを使用しているケースがあります。
このようなコンテンツの上で、横方向へのフリックやスワイプが発生しているか確認することで、隠れているコンテンツが認知されているかがわかります。


④ 注目されているコンテンツがわかる

タッチアクションヒートマップでは、ピンチアウト(拡大の動き)を紫の矢印で表示します。

画像などのコンテンツが拡大表示されているということは、ユーザーがそのコンテンツに興味があり、より詳しく見たいと考えている可能性があります。
タップ解析と組み合わせて、注目コンテンツの発見が可能です。

⑤ 画像や文字のサイズが適切かどうか

ピンチアウトの動きは、ユーザーの興味があるコンテンツと説明しましたが、一方で視認性が悪いため拡大しないと見づらいという可能性も考えられます。

スマートフォンの場合、画面がパソコンより小さいため、必然的に画像や文字が小さくなる傾向にあるため、視認性の検証が必須です。
ヒートマップを確認して、ピンチアウトの動きが多い場合には、文字や画像のデザインが見づらい可能性があるため、対策が必要です。

タッチアクションヒートマップを利用したウェブサイトの改善施策

タッチアクションヒートマップでは、ユーザーが注目しているコンテンツや読み飛ばし、画像などの視認性を分析することができます。
この中でも、ピンチアウトの分析による改善施策はインパクトが大きいため、それらを用いた改善施策をご紹介します。

サイト内の潜在的な注目コンテンツを発見し、さらに注目度をアップ

タッチアクションヒートマップとスクロールヒートマップ(アテンションヒートマップとも呼ぶ)を使用することで、サイト内の潜在的な注目コンテンツを発見できます。


上記のように、滞在時間が短めのコンテンツでも、拡大の動きが見られます。
このようなコンテンツは注目されているにも関わらず、
「文字が小さいから途中で読むのを止めてしまった」
「コンテンツが見づらいために、内容が伝わってこなかった」
というような理由で、本来の役割を達成できていない可能性が高いです。

コンテンツのデザインや見せ方の変更、文字や画像サイズの拡大などによって視認性の改善を図ることで、より注目されるコンテンツにすることができます。

【改善事例|アヴァンス法務事務所様】ファーストビューの視認性を改善し、コンバージョン率が向上

タッチアクションヒートマップからユーザーの視認性などを確認し、コンバージョン率を改善した例です。
変更前はファーストビューでの文字が小さく、視認性が悪い状態でした。
そこで、文字サイズを一部大きくし、デザインを変更したところコンバージョン率が125%改善しています。

訴求を変えなくても、ユーザーにコンテンツが伝わるように見せ方やデザインを変更するだけでもコンバージョン率が改善することがわかります。
タッチアクションから視認性が課題となっている部分は、デザインなどの変更を検討してみて下さい。

さいごに

タッチアクションヒートマップを利用することで、タップ解析やスクロールだけでは分からなかったスワイプやフリック、拡大・縮小の動きが明らかになります。
今後、ますますスマートフォンからのアクセスは増えていくと考えられます。
特にBtoCのビジネスサイトであればその傾向は顕著です。
スマートフォンでの利便性をより良いものにするために、各コンテンツに対して、どのようなアクションをとっているのかを知っておくことが必要になります。

多機能ヒートマップ解析ツール SiTest(サイテスト)

弊社が運営、開発を行う多機能ヒートマップ解析ツール SiTest(サイテスト)は、豊富なヒートマップを搭載しています。
この記事でご紹介したヒートマップと同等の機能を搭載しているので、ユーザービリティの検証、コンテンツの評価が視覚的に行うことができます。
また、定量データによる解析もできるので、客観的な分析も可能です。

面倒なタグ設置などの初期設定からオンラインデモ等、サポートも充実しています。
お見積りは無料です。
お問合せはこちらから。