ヒートマップとスクロールマップがオンラインストアのコンバージョンを9.3%押し上げた方法

公開: 2021-08-19

オンラインビジネスの運営に関しては、訪問者の行動を追跡し、コンバージョンファネルをテストすることは、売り上げを向上させるために不可欠です。 ほとんどのウェブマスターは、無料のツールであるGoogle Analyticsを利用して、サイトの全体的な統計を追跡しています。

しかし、Google Analyticsは非常に強力なツールですが、訪問者がサイトをどのように操作しているかを明確に把握するのに十分な情報を提供していません。 例えば…

  • Google Analyticsは、特定のページでユーザーがクリックしている正確なボタンとリンクを教えてくれません
  • Google Analyticsは、Webページのどの部分が最も読まれているかを教えてくれません
  • Google Analyticsは、ユーザーが下にスクロールしてすべてのコンテンツを読んでいるかどうかを通知しません

一言で言えば、グーグルアナリティクスだけではあなたのウェブサイトを改善するのに十分な情報をあなたに提供しません。

成功するeコマースストアを開始する方法についての私の無料ミニコースを取得する

あなたがeコマースビジネスを始めることに興味があるなら、私はあなたが完全にゼロからあなた自身のオンラインストア立ち上げるのを助けるであろうリソースの包括的なパッケージをまとめました。 出発する前に必ず手に取ってください!

訪問者の正確なアクティビティを追跡する

オンラインストアコースを最初に立ち上げた2011年以来、ウェブページの改善に役立つCrazyEggというツールを使用しています。 Google Analyticsとは異なり、Crazy Eggを使用すると、顧客がWebサイトをどのように操作しているかを正確視覚化できます。

たとえば、このツールを使用すると、ヒートマップ作成して、顧客がサイトをクリックしている場所を確認できます。

更新:現在、ヒートマップとスクロールマップに加えて、動作中の顧客のビデオを録画および視聴できるMouseFlowというツールを使用しています。 さらに、CrazyEggよりも大幅に安価です。

MouseFlowを30日間無料で試すには、ここをクリックしてください

下の写真は、訪問者が私の販売ページにアクセスしたときにクリックしているものを示しています。 ご覧のとおり、「ここをクリックしてツアーに参加する」ボタンを強くクリックします。これはまさに私が望んでいることです。

Create a Profitable Online Store

CrazyEggとMouseFlowはどちらも、ページのどの部分が実際に読み取られているかを判断できるスクロールマップを提供します。 下の写真は、私のページのどの部分がより人気があるかをはっきりと示しています。

ページの黄色と赤の部分は「ホット」ですが、緑と青の領域は、訪問者がコンテンツにそれほど関与していない領域です。

Scroll Map

とにかく、オンラインで何かを販売しようとしたことがあれば、このようなツールを使用することが顧客の行動理解し、訪問者を正しい方向に導くために必要な調整を行うのに非常に貴重である理由をおそらく理解できます。

個人的な話

ですから、ここで少し恥ずかしい思いをします:)ブログやランディングページを最適化するためにこれらのツールをかなり頻繁に使用してきましたが、昨年までeコマースストアでこのツールを使い始めませんでした。

そのため、最近実施した、ストアへのサポートコールの数減らし、コンバージョン数を9.3%増加させたテストを、少し時間をかけて共有したいと思いました。

そして、ページに変更を加えることにした唯一の理由は、CrazyEggやMouseFlowなどのツールを使用して収集したデータのためでした。

以下に示すのは、私たちのトップランディングページの1つがずっと前にどのように見えたかです。

landing page original

これがページデザインの裏話です。 当店では、パーソナライズされたハンカチを販売しております。 14種類のハンカチと14色の糸色からお選びいただけます。お客様は基本的にハンカチを好きなようにカスタマイズできます。

しかし、問題は、「写真に写っている」ハンカチにこだわって、スタイルや糸の色を選べないと思って、商品選びに戸惑い続けることでした。

そのため、ハンカチをパーソナライズする方法や、写真などとは異なるハンカチをパーソナライズできるかどうかを尋ねる電話がたくさんありました。

とにかく、混乱を避けるために、ページの上部にパーソナライズできるすべてのハンカチの写真を追加しました。特定のハンカチの上にマウスを置くと、大きな写真に拡大されます。 スレッドチャートも追加しました。

以下に示すのは、同じページの2回目の反復です。

personalized

パーソナライズを追加するときに、さまざまなハンカチから選択できることに顧客がすぐに気付くので、混乱して離れることはありません。

しかし、この変更後も、「ハンカチをパーソナライズするにはどうすればよいですか?」などの非常に基本的な質問を電話で定期的に受け取り続けました。

とにかく、私は私たちのユーザーインターフェースがまだいくつかの問題を抱えていることを知っていましたが、ページがまだ非常にうまく変換されていたので(3〜7%の間)、私はそれを最も長い間放っておいた。 しかし、これらの製品は私たちの大金持ちの1つであるため、Crazy Eggを使用することにしました。これは、私が気付いたものです。

personalized heatmap

ここで問題を見つけることができますか? リンクではないのに、顧客は実際にそれらの小さな写真をクリックしていました! 何かが起こることを期待して顧客がそこをクリックしていたのでしょうか?

そこで、ヒートマップを見た後、当店で買い物をしたことがない友人を招待して、パーソナライズされたハンカチを購入してみました。 そして、低くて見よ、彼女もそれらの写真をクリックし始めました!

彼女は、小さな写真をクリックすると、ハンカチをパーソナライズできる別のページに移動すると想定していました。 彼女はまた、明確な指示がなかったため、パーソナライズプロセス全体に混乱していました。

注:彼女が混乱した理由の一部は、それらの小さなハンカチの写真が折り目の上にあり、「本物の」製品が彼女のラップトップの折り目の下に隠されていたためだと思います。 これは本当の問題でした!

とにかく、私には多少のジレンマがありました。 ページの上部にハンカチをパーソナライズする方法の説明を含めた場合、それはすべての製品を折り目の下に押し下げてしまい、望ましくありませんでした。

そのため、最終的には、誰かがそれらの小さな写真の1つをクリックしたときに表示される小さな情報ポップアップを作成することにしました。 そして、このポップアップで、ハンカチをパーソナライズする方法について具体的な指示を提供しました。 さらに、スレッドのカラーグラフィックを削除して、製品をページ上移動しました。 以下に例を示します。

personalized popup

ポップアップを追加し、元のランディングページで分割テストを行った後、ポップアップを追加して商品をページの上位に移動すると、コンバージョンが約9.3%増加することがわかりましたが、最も重要なのは、それ以降、これに関するサポートコールを受け取っていないことです。 。

このページはまだ作業が必要ですが、ヒートマップ分析ですぐに見つけることができたランディングページで問題のある場所を見つけることに夢中になりました。 通常のGoogleAnalyticsだけでは、この動作を観察することはできませんでした。

学んだ教訓

この投稿から何かを取り除くと、何らかのトランザクションベースのサイトを実行している場合、GoogleAnalyticsはコンバージョンを改善するのに十分な情報を提供しないということです。

顧客の行動を分析することは重要であり、どの顧客が訪問しているかだけでなく、彼らがあなたのページをどのように操作しているかを知ることも重要です。

オンラインストアの運営はほぼトランザクションであるため、すべてのeコマースストアは分析を超えて考え、顧客をよりきめ細かいレベルで観察することをお勧めします。

最良の部分は、ここをクリックしてこれらの追跡ツールを30日間無料で試すことができることです。

以下、ご不明な点がございましたらお気軽にお問い合わせください。