あなたのウェブの最初の折り目

あなたのウェブサイトの最初の折り目は最も重要なセクションです。 あなたのページにアクセスしたすべての訪問者は、そのブロックを見ることになります。 そしてこれは彼らにあなたのウェブサイトを閲覧し続けるか、それについてもっと知るためにスクロールするか、あるいはただ去るようにするでしょう。

ヒートマップについて話したとき、ほとんどの場合、Webの最初の折り目がより関連性の高いものであることがわかりました。 そこで分析したヒートマップとスクロールマップの両方で、Webの最初のブロックのアクティビティの量が多かった。

多くの訪問者は最初の折り目を見るだけで、ページを下にスクロールしません。 表示内容を最適化することが、コンバージョン率を向上させるための鍵となります。 そのため、今月は、当社のWebサイトのランディングページの最初の折り目の最適化について説明します。

仮説：メッセージに焦点を当てる

Nelioには、WordPress用の2つのプレミアムプラグインがあります。NelioContentとNelio A /BTestingです。 今日は、2番目のものに焦点を当てます。これは、Webサイトのこのセクションでテストを実行するために使用するものでもあります。 Nelio A/Bテストのランディングページの最初の折り目を分析してみましょう。

このページの目的は、潜在的なユーザーに製品を表示して、最終的に価格設定ページにアクセスできるようにすることです。 このランディングから価格設定ページに移動する訪問者が多いほど、最終的に製品を購入する可能性が高くなります。これが私たちの要望です。

Web分析に使用するツールのおかげで得られたデータは、このページがすでに非常にうまく機能していることを示しています。 具体的には、ランディングページにアクセスする訪問者の半数が最終的に価格設定ページにアクセスすることを知っています。 悪くないですよね？ 問題は、これらの数値を改善できるかどうかです。

上のスクリーンショットは、そのページの最初の折り目に表示されるものを示しています。 その主なタイトルは、製品の名前です：Nelio A /BTesting。 次に、ユーザーがサイトのテストを開始できるように、ユーザーに切迫感を与えようとするサブタイトルがあります。

しかし、テキストを再考し、メッセージを変更して緊急性ではなく好奇心を起こそうとすると、私が提示したばかりのこれらの数値を改善できる可能性があります。 さらに、気を散らすことを避けるために、Webの最初のブロックを変更して、最初の折り畳み全体を使用し、ページの2番目のセクションを非表示にすることができます。これはここでの目的には寄与しません。

したがって、ここで作成するテストの仮説は、Webサイトの最初のセクションに焦点を合わせて明確なメッセージを送信する場合、変換を改善する必要があるというものです。 成功しますか？ どれどれ…

最初のフォールドのバリアントを作成する

最初に行うことは、WordPressのNelio A / Bテストに移動し、ページの新しいA/Bテストを作成することです。 ランディングページでも同じことを行い、コメントで結果を共有することをお勧めします。 このテストは、WordPressプラグインディレクトリからNelio A /BTestingをインストールするだけで無料で実行できます。

次に、作成するテストとバリアントに名前を付ける必要があります。 テストの目的は、価格設定ページにアクセスすることです。 したがって、価格設定ページへのアクセスをコンバージョンとして追跡するコンバージョンアクションを追加します。 このすべてのテストを設定すると、1分もかかりません。 次に、変更を加えてバリアントを編集します。

バリアントを編集するときは、WordPressでデフォルトで構成されているページエディターに移動します。 グーテンベルクブロックエディタを使用します。 これまたは他の快適なものを使用することをお勧めします。

次の比較では、ランディングページの最初のブロックで行った変更を確認できます。 ブロックの上にマウスを置くと、仕切りを右または左に移動して、テストするページの元のバージョンまたはそのバリアントを表示できることに注意してください。

バリエーションではタイトルを変更し、ロゴに既に表示されている商品名の代わりに、来場者の好奇心を刺激するメッセージを追加しました。 私たちは彼らに彼らのウェブサイトへの最もうまくいくかもしれない変更について考えてもらいたいです。 別の色？ ボタンの別の形？ このすべてのための代替の場所？

これに続いて、サブタイトルを、好奇心をくすぐる解決策があることを示すものに変更します。「WordPressのさまざまなバージョンを作成してテストし、視聴者が最も気に入っているものを見つけて、コンバージョンを改善します。」

A / Bテストの作成とページのバリアントの編集は、ほんの数分で完了します。 私たちが見返りに得ることができるものは、献身的な努力よりもはるかに大きいです。

最後に、スペイン語と英語のWebサイトがあるので、スペイン語のページでも同じことを行います。 次の比較で、スペイン語ページのバリアントの変更を確認できます。

すべての準備ができたら、言語ごとに1つずつ、2つのページのテストを開始し、結果が到着するのを待つ必要があります。 Nelio A / B Testingは、テスト対象のさまざまなバリアント間でトラフィックを分割し、訪問数とコンバージョン数をカウントする責任があることを忘れないでください。 他に何もする必要はありません…ただ待ってください。

結果の分析：変更はうまく機能しましたか？

英語でのページのテストの結果から始めましょう。 次のスクリーンショットですべての詳細を確認できます。

このテストは26日間実行され、合計で約1000人の訪問者が分析されました。 ご覧のとおり、この時点で、テストはバージョンBが勝者であることを識別できました。

すでに知っているように、元のバージョンのコンバージョン率はこの場合54％です。 これは、前述のWeb分析ツールのデータと一致します。 一方、このバリアントは60％を超えるコンバージョン率を達成しており、これは12.3％の改善に相当します。

データは統計的に有意であり、信頼値は95％を超えています。 したがって、ページの最初の折り畳み全体を使用する新しいコピーのバリアントが、これまでのバージョンよりも優れていることを確認できます。 私たちの仮説は正しかった。 それなら、私たちは幸せでなければなりません。

受賞バリアントを適用する方法

現在のページよりも優れた代替バージョンのページがあることがわかったら、このバリアントをすべての訪問者に表示されるようにする必要があります。 これを行うには、最初にテストを停止する必要があります。 次に、バリアントの結果があるセクションに移動し、ボタンを押して適用します。

それが行うことは、私たちが持っていたページを、私たちが見つけた最もよく機能するバリアントに置き換えることです。 ワンクリックで簡単にできます。 また、必要に応じて、いつでも元のバージョンを再適用して、前の状態に戻すことができます。

スペイン語のページのテストはどうですか？

さて、あなたは以下の結果を持っています：

26日後、テスト対象のページのトラフィックが少ないため、テストは結論に達していません。 訪問者の数が非常に少ないため、このページをテストしても意味がありません。 したがって、ここから導き出せる唯一の結論は、スペイン語の聴衆はA/Bテストを行うことにあまり関心がないということです。

これは興味深いことです。同じWebサイトで、非常に異なるオーディエンスを持つことができることを証明しているからです。 この場合、差別化の事実は言語だけでなく、英語圏の国ではこのタイプの変換最適化手法がスペイン語圏よりも広く普及しており、成熟しているという事実です。

したがって、ここでの私たちの仕事は、スペインの聴衆にA/Bテストの利点を説明し続けることです。 これを行うことで、このトピックに関するトラフィックと関心を高めることができます。

今月は以上です。 今後数か月以内に分析するテストを知るために、定期的に当社のWebサイトに立ち寄ることを忘れないでください。

UnsplashのMatthewTRaderによる注目の画像。