コンバージョンを促進するためにeコマースストアを設計する方法

クリックするだけでeコマースサイトにアクセスしたことは何回ありますか?

必要な製品がないからではなく、とても混乱しているからですか?

私は持っています。何度も。

長年このビジネスに携わった後、私はおそらくこれらのサイトを回避する方法を見つけることができます。

しかし、他の場所で欲しい製品を見つけたときに、フープを飛び越える理由はありません。

平均的な消費者のように、私は便利なショッピング体験をしたいと思っており、好きで信頼できるブランドから購入したいと思っています。

情報を見つけやすくすることから、信頼できるブランドイメージを伝えることまで、コンバージョンに影響を与える多くの要因は、eコマースサイトの設計方法に関連しています。

ウェブサイトのデザインは単なる美しい写真以上のものです。

すべての視覚的要素が連携して、優れたユーザーエクスペリエンスを提供し、コンバージョン率の向上、売り上げの増加、リピーターの増加につながる必要があります。

コンバージョンを促進するためにeコマースストアを設計する方法は次のとおりです。

高品質の商品画像を使用する
触覚体験を提供できないことは、eコマースマーチャントにとって最大の課題の1つです。

顧客はあなたの製品に触れることができないので、あなたはあなたの製品の特徴と属性を伝えるために二次元のスクリーンを最大限に活用しなければなりません。

ニール・パテルとの相談
私の代理店があなたのウェブサイトへの大量のトラフィックをどのように促進できるかをご覧ください

SEO-大量のSEOトラフィックのロックを解除します。実際の結果をご覧ください。
コンテンツマーケティング-私たちのチームは、共有され、リンクを取得し、トラフィックを引き付ける壮大なコンテンツを作成します。
有料メディア-明確なROIを備えた効果的な有料戦略。
電話を予約する

画像を使用すると、コンバージョン率が上がることは間違いありません。ただし、増加量は、使用する画像とその使用方法によって異なります。

画像サイズ

商品画像に関しては、大きいほど良いとは限りません。

ConversionXL Instituteが実施した調査によると、製品の種類によって画像サイズに対する反応が異なることがわかりました。

貼り付けた画像0820

この調査では、ドレスシャツとハードドライブのさまざまな画像サイズの効果を比較しました。

人々は、大きな画像が使用された場合、体験商品(ドレスシャツなど)の価値が低いと見なし、大きな画像が使用された場合、検索商品(ハードドライブなど)はより高価であると考える傾向があることがわかりました。

貼り付けた画像0829

商品の種類に基づいて推測し、A / Bテストを実行して、商品の画像に最適なサイズを決定します。

画質

商品ページで使用する画像は高品質である必要があります。それぞれを慎重にステージングし、適切な照明で撮影する必要があります。

画像を商品ページにアップロードする前に、画像が最適化されていることを確認してください。

貼り付けた画像0812

ファイルサイズは、画像がぼやけて見えないように十分に大きくする必要がありますが、読み込み時間を遅くしないように十分に小さくする必要があります。読み込み時間が遅いと、ページの検索エンジンランキングに影響を与える可能性があります。

ズーム機能

ズーム機能を使用して、製品の詳細とテクスチャを表示します。

貼り付けた画像0832

これにより、訪問者は商品の詳細を確認できるだけでなく、商品が高品質であることを確認して、店舗から購入する自信を得ることができます。

画像を適切に最適化することで、読み込み時間やユーザーエクスペリエンスに影響を与えることなく、拡大しても見栄えが良くなります。

360度ビュー

さまざまな角度からさまざまな詳細レベルで製品の画像を表示します。

貼り付けた画像0839

厳選された一連の画像は、商品のさまざまな側面を紹介して、店舗で商品を保持して調べる体験を提供するのに役立ちます。

また、訪問者が画像を回転させることができる動的画像技術を使用することもできます。

このウェブサイトでは、回転する画像が静的な画像よりも優れており、コンバージョン率が27%向上していることがわかりました。

貼り付けた画像0841

コンテキストを表示

製品の動作を示す画像は、訪問者が製品の利点を使用して楽しんでいることを想像するのに役立ちます。

貼り付けた画像0822

感情的で内臓的な魅力

多くの購入決定は感情的な理由に基づいているため、画像は関連性があり、顧客が製品の使用から得たいと思う前向きな感情を伝える必要があります。

貼り付けた画像0834

人々は画像に対して強力で内臓的な反応を示します。そのため、顧客を刺激し、引き付ける画像を選択するために、視聴者を知ることが重要です。

ココナッツブリスのウェブサイトからの上の画像は、いくつかのことを正しく行っています。

それは、人々がおやつを共有するときにしばしば感じる楽しみとつながりの前向きな感情を引き出し、製品の動作を示すことによってコンテキストを与え、訪問者がアイスクリームを楽しんでいることを想像するのに役立ちます。

悪いストックフォトを避ける

安っぽいストックフォトを使用すると、不誠実に見え、顧客のブランドに対する信頼を損ない、訪問者をWebサイトから遠ざけることができます。

すべての写真は本物で本物に見えるはずです。訪問者に親指を立てるスーツを着たモデルは、善よりも害を及ぼす可能性があります。

人のストックフォトを使用する場合は、その方法を検討してください

 

それはあなたのサイトの信頼性と、ページ上の他の要素から顔がどのように注目を集めるかに影響します。

貼り付けた画像0824

アイトラッキング調査によると、人々は写真のモデルの視線を追う傾向があります。モデルが、商品の写真や行動の呼びかけなど、強調したい要素を見ていることを確認します。

貼り付けた画像0814

製品ビデオを組み込む
問題は、「eコマースストアでビデオを使用する必要がありますか?」ではなくなりました。しかし、「どうすればビデオを最大限に活用できますか?」

動画がコンバージョン率の向上に役立つという事実は否定できません。

貼り付けた画像0815

ランディングページに動画を組み込んで興奮を高めたり、商品ページに動画を組み込んで、訪問者に商品に関する追加の詳細を提供したりできます。


商品ページの動画に注目を集めるには、再生ボタンのアイコンが付いたサムネイルを含めます。

スクリーンショット20170809 at 5.18.20 PM

動画の長さによって、動画の効果も決まります。

それらは、有用な情報を提供するのに十分な長さでありながら、訪問者がそれら全体を見ることができるように十分に短い必要があります。

Wistiaは、最長2分の動画が最もエンゲージメントを高めることを発見しました。 2分から3分の間に大幅な低下が見られますが、滞在している視聴者は6分から12分の間にそれを際立たせる傾向があります。

貼り付けた画像0813

ほとんどの製品ビデオでは、2分未満の長さが最大の影響をもたらします。

実際、短いほど良いです。

貼り付けた画像0817

平均的なインターネットユーザーの注意力はわずか8.25秒であるため、視聴者の注意を引くには最初の数秒が重要であることに注意してください。

ビデオは、eコマースストアにとって強力な視覚的要素です。 eコマースのコンバージョンを増やすのに役立つことが証明されているさまざまなフォーマットを活用して、それを最大限に活用してください。

製品デモ

ビデオは、製品の動作を示すための理想的な媒体であり、多くの小売業者がコンバージョン率を上げるのに役立ちました。

オンライン小売業者のSimplyHikeは、デモ動画を使用してコンバージョン率を最大25%向上させました。

貼り付けた画像0838

理想的な顧客が識別できるモデルを使用して、さまざまな機能を使用して購入を最大限に活用する方法を学びながら、製品を楽しんでいることを想像できます。

あるいは、あなたの聴衆があなたの製品について話すための権威とみなす影響力者を巻き込むことができます。

ハウツービデオ

消費者が製品の使い方がわからないために購入をためらうことは珍しくありません。

ハウツービデオは、段階的な説明を提供し、複雑な機能を備えた製品や、熱心で詳細を重視する視聴者に適しています。

また、買い物客が生活の中でどのように商品を使用できるかを視覚化するのに役立つ、商品がどのように機能するかを示す絶好の機会でもあります。

貼り付けた画像0837

比較ビデオ

選択肢が多すぎるために消費者が購入を行わず、分析の麻痺に陥っている場合があります。

製品を競合他社と並べて配置する偏りのない比較ビデオは、視聴者が製品の違いと、決定を下す際に考慮すべきことを理解するのに役立ちます。

スクリーンショット20170809 at 4.04.41 PM

製品レビューとユーザー生成ビデオ

忠実な顧客が彼らの経験に非常に満足しているので、彼らが彼らの購入についてのビデオを録画するか、それがどのように機能するかを示すために少し時間をとることをいとわないなら、それはあなたのブランドと製品について多くを語ります。

貼り付けた画像0827

レビュー担当者は、製品の使用方法、最も役立つと思われる機能や機能、製品によって生活がどのように改善されたかなどについて話すことができます。

潜在的な購入者は、「彼らと同じような人々」があなたの製品から素晴らしい結果を得ていることに気付くと、購入する可能性が高くなります。

Webデザインのベストプラクティスに従う
優れたeコマースサイトのデザインは、顧客が購入を決定するために必要な情報を見つけて、[今すぐ購入]ボタンをクリックするなどの必要なアクションを実行するのに役立ちます。

購入体験を可能な限り摩擦のないものにするために、脳が視覚要素を認識し、視覚情報を処理する方法を操作する必要があります。

実証済みのWebサイトデザインのベストプラクティスを次に示します。

一貫したパレットと書体

ブランドスタイルガイドは、消費者が本能的にブランドに関連付ける一貫したユーザーエクスペリエンスと視覚的アイデンティティを維持するために開発されました。

貼り付けた画像0826

スタイルガイドは、ブランディングの練習の後に収納するための単なるドキュメントではありません。一貫性のある画像を伝えるのに役立ちます。

一貫性は信頼を生み出し、信頼は回心につながります。

Webサイト全体で統一された視覚的アイデンティティを維持するだけでなく、Facebook広告やポストカードなどの他のオンラインおよびオフラインのマーケティング資料にも拡張する必要があります。

これにより、カスタマージャーニー全体を通じて一貫したユーザーエクスペリエンスが保証されます。

すっきりとしたレイアウト

ミニマリストのデザインアプローチは、ページ上の不要な要素や気を散らすものを取り除くのに役立つため、会話を促進するために不可欠な要素のみ

 

イオンが残ります。

グリッド構造で要素を互いに整列させておくと、すっきりとしたレイアウトを作成することもできます。

大量の情報を表示する必要がある場合は、一連のタブを使用して、コピーを整理し、煩雑さを軽減します。

Fableticsが製品の説明でそれを行う方法は次のとおりです。

スクリーンショット20170811 at 9.18.05 AM

視覚的階層

視覚的な階層を確立することは、ユーザーの注意を引くために何かを大きく明るくするだけではありません。

コンテンツとグラフィック要素の配置をガイドするために、私たちの脳が情報を処理する方法を考慮に入れてください。

ほとんどの西洋文化では、左から右へ、上から下へと読みます。ページを下に行くと、目の動きはF字型またはZ字型のパターンに従います。

コンテンツの構成はこのパターンに従う必要があるため、訪問者は意図した順序でコンテンツを読むことになります。

Underwater Audioは、視覚要素をF- / Zパターンに合わせて再配置することで、売上を35.6%増加させました。

貼り付けた画像0836

緊急

緊急性を適用すると、コンバージョン率が向上することは誰もが知っています。注意を引き、切迫感を高めるために、デザイン要素を含めるようにしてください。

LIFTモデルの緊急性

在庫の少ない商品(「残り2個」)、翌日発送の期限付き購入(「明日欲しい?xx時間以内に注文」)、期間限定のオファー(「割引は有効になるまで」)を呼び出すことで、これを行うことができます。 」)、または期間限定の送料無料。

貼り付けた画像0810

販売前のカスタマーケア

あなたの潜在的な顧客の何人かは購入をすることに非常に近いかもしれません、しかし彼らはいくつかの長引く質問をします。

それらの質問にすぐに答えることができるなら、あなたはそれらを柵を越えて押します。

販売前のカスタマーケアに簡単にアクセスできるようにすることで、これらの見込み客を購入者に変えることができます。

貼り付けた画像0818

カスタマーサポートに連絡するためのリンクは、すべてのページに永続的な要素であり、目立つように表示され、魅力的である必要があります。

サイトでライブチャットを行っている場合(そしてそうすべきです!)、それをデザインに組み込んでください。そうすれば、邪魔にならずに簡単に見つけることができます。

送料無料

送料無料のオファーは、コンバージョン率を高め、平均注文額を増やし、顧客ロイヤルティを向上させることがわかっています。

スクリーンショット20170810 at 2.30.16 PM

ウェブサイト全体でデザイン要素を使用して、送料無料のオファーを強調します。

貼り付けた画像0831

また、送料無料の資格を得るために顧客がカートに追加する必要がある量を計算する動的要素を含めることもできます(「送料無料の取得から8.95ドル離れています!」)。

検索機能

訪問者が必要なものをすばやく見つけることができれば、訪問者は購入する可能性がはるかに高くなります。

多くの顧客にとって、検索ボックスは購入経路の始まりであるため、Webサイトで簡単に見つけられるようにしてください。

ほとんどのウェブサイトは検索ボックスを右上隅に配置しており、ユーザーが最もよく見る場所です。

対照的な色を使用し、「キーワードまたはアイテム番号を入力してください」などの説明テキストを表示するのに十分な長さにすることで、検索バーをより目立たせます。

貼り付けた画像0828

商品画像をサイト検索ウィンドウに追加すると、コンバージョン率を上げることもできます。

貼り付けた画像0830

さらに、顧客が必要なものを見つけやすいように検索結果を表示します。フィルタリング機能を含めると、顧客は結果をすばやく並べ替えることができます。

貼り付けた画像0816

アクションの呼び出し

訪問者が[今すぐ購入]ボタンを見つけられない場合、コンバージョンは発生していません。

訪問者がページ上の他の要素と簡単に区別できるように、行動を促すフレーズのボタンを目立たせる必要があります。

これを行う方法に関するヒントを次に示します。

対照的な色を使用してください。
ボタンの形を試してみてください。貼り付けられた画像0811
召喚状のテキストがすべてのデバイスで判読できることを確認してください。
テキストは短く、パンチがあり、アクション指向にしてください。
コピーを使用して、価値提案を強化します。
折り目の上にCTAを置きます。
ページに複数のCTAボタンを配置して、顧客がそれらを探すために上下にスクロールする必要がないようにします。
ボタンがクリック可能に見えることを確認してください。美しくデザインされた「ミニマリスト」のサイトをたくさん見かけますが、CTAボタンは非常にミニマルなので、誰も見つけることができません。
モバイルの最適化

Googleの報告によると、複数の種類のデバイスを所有している人の90%は、タスクを完了するときに画面を切り替えます。

eコマースサイトは、使いやすいインターフェースとデバイス間で一貫したユーザーエクスペリエンスを提供するために、モバイルに最適化されている必要があります。

デスクトップレイアウトが小さな画面にどのように変換されるか、ページ上で最も重要な要素がどのように強調表示されるか、モバイルでのナビゲーションがどのように機能するかを検討してください。

これを行うと、訪問者は必要なものをすばやく簡単に見つけることができます。商品が見つからないと購入できません!

スライドショーまたはカルーセル

多くの変換専門家によると、画像スライダーやカルーセルは大したことではありません。

それはあなたの訪問者をあまりにも多くのメッセージで混乱させながら、サイトの最も重要な要素から注意をそらします。

言うまでもなく、それはしばしばあなたの訪問者を引き起こす「バナー失明」を引き起こします

 

情報を完全にスキップするためのrs。

カスタマーレビューを最大限に活用する
ある調査によると、消費者の88%が、個人的な推奨事項と同じくらいオンラインレビューを信頼していると答えています。

貼り付けた画像0823

このオンライン小売業者は、製品ページに顧客レビューを追加した後、売上を58.29%増加させました。

製品のさまざまな側面を含めることで、評価をより役立つものにします。たとえば、多くの衣料品小売業者は、評価をデザイン、品質、快適さ、およびフィット感に分類しています。

スクリーンショット20170810 at 1.04.15 PM

さらに、注文の詳細(色、サイズなど)を表示し、カスタマーレビューの横に「確認済みの購入」としてマークすると、信頼性が向上します。ScreenShot 2017 08 10 at 1.06.11 PM

長所と短所のバランスを示し、レビュー担当者が製品をどのように使用しているかを示し、製品を競合ブランドと比較する高品質のレビューを収集します。

「レビュースナップショット」を設計して、顧客が最も役立つレビューを見つけられるようにすることができます。

貼り付けた画像0840

レビューの数も重要です。 100万を超える製品ページの訪問を分析した後、Reevooは、表示されたレビューの数が25から50になると、コンバージョン率が18%増加することを発見しました。

貼り付けた画像0825

チェックアウト時に紛失しないでください
あなたの潜在的な買い手はチェックアウトにそれをしました。おめでとうございます!

ただし、あまり早く祝わないでください。

Baymard Instituteによると、米国のオンライン買い物客の58.6%が、さまざまな理由で過去3か月間にカートを放棄しました。

貼り付けた画像0833

さらに、Baymard Instituteの調査によると、平均的な大規模なeコマースサイトでは、チェックアウトデザインを改善することで、コンバージョン率を35.26%向上させることができます。

チェックアウトプロセスを完了するために必要なステップまたはクリックの数を減らします。 1ページのチェックアウトを複数ページのチェックアウトプロセスに対してA/Bテストして、オーディエンスに最適なものを確認できます。
貼り付けた画像0809
チェックアウトに複数のページが含まれる場合は、進行状況バーを表示します。
貼り付けた画像0835
購入者が「ゲスト」としてチェックアウトし、購入が完了した後にアカウントを作成できるようにします。
顧客がチェックアウトフローを離れることを要求せずに、プライバシーポリシー、配送の詳細、FAQ、および返品ポリシーへのリンクを含めます。情報をポップアップとして表示できます。
支払い情報フィールドの横にクレジットカードのロゴとトラストシールを含めます。
貼り付けた画像0821
顧客が注文を完了する前に、最終価格と税金や送料などの内訳を明確に示してください。
クーポンコードボックスは、お客様が見やすい場所に置いてください。
さまざまな支払い方法を提供し、ロゴやアイコンを表示します。たとえば、PayPalを受け入れる場合は、PayPalバッジを含めます。
グラフィック処理を使用して、購入による節約額を繰り返し強調します。
貼り付けた画像0819
結論
コンバージョンを最適化するためにeコマースウェブサイトを設計する方法はたくさんあります。

ただし、サイトを機能させるためにすべてのものや台所の流し台を投入する必要はありません。

ブランドイメージを伝え、製品を可能な限り最高の状態に保つようにサイトを設計します。

また、eコマースストアは顧客に関するものであるため、常にユーザーエクスペリエンスを優先することを忘れないでください。

変更を加えるときはいつでも、メトリックを確認して、針を正しい方向に動かすのに役立つことを確認することを忘れないでください。

eコマースストアでのコンバージョンを増やすために何をしましたか?何がうまく機能していますか?