ユーザーの行動を理解する最高のウェブサイトデザイン
公開: 2020-08-14この記事では、Web サイトでの顧客の行動を追跡する方法、UX Web サイト分析の革新、およびヒートマップを使用してユーザーの行動を追跡し、最高の Web サイト デザインを実現するすべての理由について説明します。
あなたが見つけるもの:
- ユーザー行動とは?
- UX デザインはオンライン ストアや Web サイトのプロモーションにどのような影響を与えますか?
- ヒートマップ ツールを使用したユーザー行動分析とは?
- 追跡する必要があるものを Web サイトがクリックする理由
- ウェブサイトのクリックとスクロール分析によるユーザーの行動
- ライブ Web サイトでのユーザーの行動の視覚的表示の例
記事内のユーザー行動に関連するすべての例は、 Plerdy heatmapで収集された 4,000 万回を超えるクリックに関する独自の統計に基づいています。
何かを買った瞬間を考えると、商品よりも自分の気持ちを思い出す可能性が高くなります。 オンライン ストアまたは Web サイトとのやり取りは、感情的な記憶に記録され、Web サイトでの行動の一部となります。
ユーザー行動とは?
今日、Web は、家から出ずに注文できる大量の製品やサービスを提供しています。 たとえば、「ピザを注文する」をグーグルで検索すると、11 億件以上のオファーが表示されます。 同じことが、他の多くの製品カテゴリにも当てはまります。
これは疑問につながります: あなたの Web サイトのユーザー エクスペリエンスが否定的な感情や行動を引き起こし、潜在的な購入者の最大 99% が離脱する可能性があることに気付いたことがありますか? Webサイトに UX の問題がないかどうかを確認し、分析を追跡するよう説得するいくつかの統計を次に示します。
- 顧客の 79% は、現在の Web サイトが期待に合わない場合、別の Web サイトを探すことを認めています。
- スマートフォン ユーザーの 96% は、モバイル バージョンがないか、モバイル表示に対応していない Web サイトに遭遇したことがあります。
- ユーザーの 52% は、否定的なモバイル エクスペリエンスが原因で、会社とやり取りする可能性が低くなると述べています。
- ユーザーの 63% が、さまざまな種類のデバイス (スマートフォン、タブレット、ラップトップ、PC など) で製品やサービスを閲覧しています。
ユーザーの行動に関する同様のデータが多数あり、デジタル マーケティングやオンラインの顧客にとってユーザー エクスペリエンス (UX) を追跡することの重要性が証明されています。 それでは、UX 分析について知っておくべきことをすべて説明しましょう。
UX デザインはオンライン ストアや Web サイトのプロモーションにどのような影響を与えますか?
情報アーキテクチャと検索サービスを提供するコンサルティング会社の社長である Peter Morville は、 Web サイトの UX と動作に影響を与える次の要因を特定しています。
つまり、優れた UX を備えた Web サイトは次の条件を満たしている必要があります。
- 使える
Web サイトのコンテンツは、顧客のニーズを完全に満たし、前向きな行動を喚起する必要があります。
- 使える
使いやすさは、依然としてユーザー エクスペリエンスの重要な要素であり、優れたユーザー行動を提供します。
- 望ましい
すべての画像、ブランド、およびデザイン要素は人目を引き、ポジティブな感情と行動を誘発する必要があります。
- アクセス可能
Web サイトのすべての要素とコンテンツは、障害を持つユーザーがアクセスできる必要があります。
- 信頼できる
Web サイトに公開するものはすべて、ユーザーに信頼してもらうために信頼性と正確性を備えている必要があります。 これにより、ウェブサイトでの行動が改善されます。
- 検索可能
コンテンツは適切に構成され、明確なナビゲーションが必要です。
適切な Web サイトの UX と動作を保証するこれらの 6 つの要素がすべて満たされている場合、Web サイトの訪問者はリソースの使用を楽しみ、適切な動作を示します。 したがって、これらの要因を追跡する価値があります。
しかし、前述の統計と分析の結果だけが、UX が重要な役割を果たしていることを証明しているわけではありません。 最近、Google は 108 ページのオンライン ブック、 UX Playbookを発行しました。 UX で売り上げを伸ばす方法について、テスト済みのヒントが満載です。 このレビューは、幅広い調査、分析、記事の A/B テストに基づいています。 数千の小売ウェブサイトを調査した結果、Google アナリティクスは特定の普遍的な UX 要素があることを発見しました。
この本には、モバイル Web サイトの UX を 6 つの主要分野で分析および改善するのに役立つチェックリストが含まれています。
- ホーム/ランディング ページ。
- メニューとナビゲーション。
- 探す。
- カテゴリ/製品。
- 変換。
- フォームの最適化。
質の高い Web サイト UX は、サイトでの顧客の行動を改善するだけでなく、検索ランキングも改善します。 モバイル サイトのユーザビリティは、最も重要な 200 のランキング要素の 1 つです。 新しい Google Mobile-First Indexing アプローチは、Web サイトの UX にも多くの注意を払っています。
✨ お見逃しなく: インクルーシブ Web デザインの究極のガイドとその方法に関するヒント
ヒートマップ ツールを使用したユーザー行動分析とは?
オンラインストアの大部分は、ユーザーの行動を追跡するために同様の分析を使用しています. これは、既存のすべての Web リソースが既にテストされており、潜在的な顧客にとって非常に便利であるという主観的な信念があるためです。 実際には、各サイトまたはオンライン ストアには独自のターゲット ユーザーがおり、それらのユーザーはあなたのユーザーとは異なる動作をする可能性があります。
そのため、潜在顧客がオンライン ストアでどのように行動するかを理解するには、クリック ヒートマップを使用する必要があります。
この分析マップで収集されたデータにより、ユーザーの好みや行動について詳しく知ることができます。 また、顧客が購入を完了するのを妨げる障害や欠陥も表示されます。
このような調査および追跡方法は、オンライン ストアのコンバージョンを増やし、ユーザー エクスペリエンスを向上させるのに役立ちます。
ヒートマップ分析ツールによるユーザー行動追跡
これらの追跡ツールは、データを収集し、Web サイトの表示に使用されたデバイスの種類とユーザーの行動によってセグメント化します。
これらの追加の利点は、すべての動的 Web サイト要素 (ポップアップ、メニューなど) との行動相互作用を追跡する機能です。 繰り返しますが、すべてがリアルタイムで行われます。
ウェブサイトの追跡データを処理するこれらのヒート マップは、クリックが発生した場所を検出するだけでなく、その順序も記録します。 分析ツールは、ページをパーセンテージ ベースで 5 つの部分に分割し、それぞれのクリック数を追跡します。 また、ユーザーの行動の非常に重要な側面でもあるスクロールの深さを追跡します。 ユーザーの行動に関するこのデータを使用して、重要な情報を配置するのに最適な場所 (クリック数が最大の領域) を定義できます。
さまざまな Web リソースのページでのユーザー エクスペリエンスと行動を追跡および調査して得られた数値と結果について詳しく説明しましょう。
ヒートマップデータに基づくユーザー行動分析
ユーザーの行動は、Web サイトの主題、トラフィック ソース、および Web サイト訪問者の意図によって異なります。 より正確なユーザー行動分析のために、さまざまなソースから約 1 億回のクリックを収集しました。 これらのやり取りは、主題や機能が異なる Web サイトで行われました。
これは、トラフィック ソース別にグループ化された合計クリック数のグラフです。 ユーザー行動に関する次の調査では、この分析データに依存していました。
デバイス タイプ別の合計クリック数のセグメンテーション
グラフからわかるように、クリック数が最も多いのは PC です。 モバイルでのクリック数は大幅に少なく、クリック数が最も少ないのはタブレット ユーザーです。
モバイル トラフィックが年々着実に増加していることは誰もが知っており、これはユーザーの行動にも影響を与えます。 これは論理的な疑問を提起します:なぜほとんどのクリックは依然としてデスクトップ上で行われているのでしょうか?
答えは簡単です。 ユーザーがモバイル デバイスから Web サイトにアクセスする場合、特定の目的 (別のページに移動する、ボタンを選択する、またはアクティブなリンクを選択する) だけをクリックします。 残りの時間はスクロールします。 ユーザーが PC からブラウジングする場合、テキスト上にマウスを置いたり、要素を強調表示したり、要素をコピーしたり、いわゆる空クリック (Web サイト要素の外側をクリック) を行ったりすることがよくあります。 ターゲットを絞ったクリックは、インタラクション全体とその行動の一部にすぎません。
クリック前のマウス ホバーの分析
グラフは、デスクトップ Web サイト バージョンのユーザーが要素をクリックする前にホバーする (少なくとも 2 秒間停止する) 頻度がはるかに高いことを明確に示しています。 これは、コンテンツを注意深く読んだり、躊躇したりすることを意味します。
一般的な行動パターン (さまざまなトラフィック ソースとデバイスに基づくクリック) がわかれば、Web サイトの訪問者の行動と行動を予測し、Web サイトをより効率的に使用できるようにすることができます。
ユーザーの行動をより詳細に追跡、分析、予測するために、ページの各部分間のクリック数の分布を示すグラフも用意しました。

スクロールの深さとデバイスの種類に応じたクリックの分布
以下のグラフは、クリック数がデバイスの種類とページの一部にどのように依存するかを示しています。
ご覧のとおり、ユーザーはページの最初の部分 (0 ~ 20%) で最も多くのクリックを行いました。 他の部位のクリックを足してもまだまだ少ない。
また、グラフは、ページの 2 番目の部分 (20 ~ 40%) からでもクリック数が大幅に減少していることを示しています。 つまり、コンテンツの構造を計画する必要があります。 ユーザーにとって最も重要な情報は、肯定的な行動を形成するために非常に重要であるため、常に最初の部分に配置する必要があります。
もちろん、すべてのページが同じというわけではありません。 サイズやデザインが異なる場合があります。 それにもかかわらず、このグラフは 1 つの主要なアイデアを伝えています。顧客を維持したい場合は、行動を促すフレーズをページの上部に配置してください。
ページの部分に応じたクリックシーケンスの分布
前のグラフは主な情報を配置する場所を示していますが、次のグラフは、ユーザーが Web ページをどのようにナビゲートし、何を最も頻繁に行うかを理解するのに役立ちます。
クリック シーケンスは、デバイス タイプごとに意図的に分割されています。 これは、ユーザーの行動の全体像をより明確に把握するために必要です。
PC でのクリック シーケンスの分布
グラフは、ほとんどのユーザーが最初のクリックをページの上部 (0 ~ 20%) で行ったことを示しています。 また、ページの 2 番目 (20 ~ 40%) 以降の部分では、最初のクリック数が急激に減少します。
このような分布は、さまざまなページ セクションでの最初のクリック数が、2 回目、3 回目などのクリック数よりも常に多いことも示しています。
このグラフからどのような結論を引き出すことができますか?
最初のクリックの後、多くのユーザーはページを離れて別のページに移動したり、Web サイトを閉じたりします。 ページの閲覧と Web サイトの操作を継続するユーザーの数は、大幅に少なくなります。
スマートフォンでのクリックシーケンスの分布
状況は、モバイル デバイス ユーザーの間でも同様です。 しかし、この場合、ページの最初の部分 (0-20%) と 2 番目の部分 (20-40%) で行われたクリック数の差はより顕著です。
これは、どのモバイル Web サイト バージョンでも、必要なすべての情報を上部に含める必要があることを意味します。 ユーザーが詳細を求めて下にスクロールすることはほとんどありません。
タブレットでのクリック シーケンスの分布
このような比較は、さまざまな種類のデバイスに合わせて Web サイトを最適化し、ユーザーにポジティブな行動を提供するために不可欠です。 たとえば、デスクトップ バージョンではページの上部に多くの情報を含めることができますが、モバイル バージョンではスペースが限られています。 ユーザーの行動を改善するためにモバイル Web サイトを設計する際は、この点を考慮してください。
ページの部分に応じたスクロール深度の分布
以下のグラフは、ユーザーがクリックせずにページをスクロールする深さを示しています。
インジケーターに基づいて、ページの特定のポイントから始まるスクロールの深さが徐々に低下していることを検出できます。 ページのすべての部分で、ユーザー数が減少します。 下に行くほど、スクロールし続ける訪問者は少なくなります。 クリックの大半はページの最初の部分で行われるため、このグラフでも、2 番目の部分から減少が始まります。
追跡する必要があるものを Web サイトがクリックする理由
見込み客があなたのウェブサイトを快適に利用できるようにするには、ページに到着した直後に彼らが最初に何をするかを知る必要があります。 したがって、これは追跡する価値があります。
ユーザーがどのようなクリックをしたか、どのセクションにアクセスしたか、セールス ファネルのどの段階で Web サイトを離れたかを調べます。 さまざまな Web サイト要素のクリック数から、次の質問に答えることができます。
- ユーザーはあなたの Web サイトで何が好きで、何が購入を妨げているのでしょうか?
- ある Web サイト ページのコンバージョン率が別のページよりも高いのはなぜですか?
- あなたのウェブサイトの直帰率が高い(または別のページの離脱率が高い)のはなぜですか?
- あなたのウェブサイトには、クリック可能ではないのにクリック可能に見える要素が含まれていますか?
- 内容はいいですか? スクロールの深さを増やすにはどうすればよいですか?
- 内部 URL や興味深いオファーを配置するのに最も適した場所はどこですか?
- 特定のページに表示されるポップアップは適切で効果的ですか? (ほとんどのユーザーがポップアップを閉じる場合は、ポップアップを削除してみて、ユーザーがポップアップなしでどのように動作するかを確認してください)。
- 行動を促すフレーズやその他の要素は効果的ですか?
この情報があれば、不満を持つ顧客の数を減らし、ユーザーのポジティブな行動を増やし、新しい顧客を獲得することができます。
ウェブサイトのクリックとスクロール分析によるユーザーの行動
トラッキング スクリプトをインストールした直後に、Plerdy のクリックとスクロールのヒートマップのデータ スライスを表示できます。 Ctrl-Alt-H を押すだけで、分析ツールのサイドバーが開き、ユーザーの行動を追跡できます。 統計は各ページに個別に表示されます。 追跡情報は、Hotjar などの多くの同様の分析ツールで使用されるスクリーンショットではなく、ライブ Web サイトにリアルタイムで表示されます。 これにより、動的要素を追跡し、ページとメイン ダッシュボード間の切り替えを回避できます。
ダッシュボードには、収集されたすべての分析データが、ユーザー行動の特定のパラメーター別にグループ化されて含まれています。 顧客の行動に影響を与える Web サイトのパフォーマンスの偏差を確認することは非常に便利です。
ライブ Web サイトでのユーザーの行動の視覚的表示の例
Web サイト訪問者の行動を分析して、どの機能ボタン (対応するセクションに転送される) が最も高い CTR を持っているかを調べるために使用されるヒートマップ追跡ツール。 最も一般的な要素は、ユーザーが分析したい Web サイトの URL またはドメインを入力できるフィールドです。 追跡データによると、このフィールドは 10612 回クリックされましたが、[検索] ボタンは 1890 回しかクリックされませんでした。
したがって、他のユーザーがEnterをクリックしただけで、結果を待っているか、Web サイトを離れたと想定できます。
Web サイトの所有者がこの行動パターンを無視していたら、大量のユーザーを失っていたでしょう。 さいわい、 Enter をクリックすると、訪問者はリンク分析を実行できます。 唯一の問題は、分析が非常に遅く、ユーザーがページを離れてしまう可能性があることです.
要素で行われたクリックの総数とは別に、ユーザーが最初にクリックした要素/ブロックを表示することもできます. これにより、訪問者がページに到着した直後に何が注目を集め、それが彼らの行動にどのように影響するかを理解できます。
検索バーの直接トラフィックのみの CRT を個別に分析すると、この要素が直接トラフィックの合計クリック数の 12.3% を占めていることがわかります (直接トラフィックは 47% を占めています)。 つまり、このページでは検索バーが強調されていますが、ユーザーは注意をそらす他の要素もクリックし、これがユーザーの行動に影響を与えます。
Web サイトの訪問者が最初にどこをクリックし、それがどのように行動を決定するかを知りたい場合は、分析ヒートマップが非常に役立ちます。 最初のクリックをトラフィック ソースだけでなく、クリック シーケンスによってもフィルタリングします。
たとえば、この方法で、オーガニック トラフィックから来た訪問者が最初にクリックした場所とその行動を知ることができます。
顧客の行動をさらに分析するために、ページのさまざまな部分でのクリック シーケンスの前のグラフに戻りましょう。
このスクリーンショットを見ると、すべてのクリックの 97.6% が最初の画面で行われていることがわかります。 したがって、ページの他の 4 つの部分は効果が低く、ほとんどクリックされません。
マウス ホバーの分析は、ユーザーが要素を非常に高速に操作することを示しています。 ほとんどの訪問者が PC で Web サイトを閲覧しているにもかかわらず、訪問者がクリックするのに 2 秒もかかりません。
スクロール深度の状況も同様です。 Serpstat の Web サイトのホームページは、1920×1080 ピクセルの 8 つのスクロール画面で構成されています。 収集したデータによると、ユーザーの 5% だけが 2 番目の画面を見た、つまりスクロールしたため、2 番目の画面での行動はあまり生産的ではありませんでした。
スクロール深度の分析データは、Web サイトの下部をチェックする人はほとんどいないことを再度証明しているため、そこでの動作はほとんどありません。 そこに追加要素を配置してもほとんど意味がありません。
最後の言葉
これが私が Plerdy のチームと一緒に行った研究です。 Web サイトの UX 分析とユーザー行動の理解に役立つことを願っています。