購入への道を開く–eコマースUXのベストプラクティス

eコマースの売上は引き続き増加しています。 モバイルデバイスはeコマーストラフィックの大部分を占めていますが、デスクトップサイトはカートの放棄率が低く、平均購入額が高くなっています。 モバイルeコマースは未来ですが、デザイナーが現在の利益を最大化したい場合は、eコマースUXのベストプラクティスでデスクトップサイトを強化する必要があります。

可能性は驚異的です。 毎年、eコマースの収益は上昇しています。 オフライン販売は依然として小売収益の大部分を占めていますが、eコマースの上昇傾向は否定できません。 今年、米国のeコマース小売業者は8,400億ドルの売り上げを達成すると予測されており、これは2022年まで到達するとは予想されていなかったレベルです。

統計的な素晴らしさの中で渦巻いているのは、モバイルが支配的なeコマースの未来の宣言です。これには正当な理由があります。 モバイルデバイスは、世界中で最も多くのトラフィックと小売収益を生み出しています。 残念ながら、モバイルは2つの主要な指標を満たしていません。モバイルサイトは、デスクトップサイトよりもカートの放棄率が高く、平均購入額が低くなっています。

eコマースの運命はモバイルですか？ 間違いなく。 eコマースUXのベストプラクティスを使用してデスクトップサイトを最適化することで、かなりのお金を稼ぐことができますか？ 絶対。

4ページのeコマースエクスペリエンス

デスクトップでは、ほぼすべてのeコマースサイトが同様のページシーケンスに依存して、販売プロセスを通じて買い物客を集めています。

• 魅力的な価値提案を備えた整頓されたホームページ
• ナビゲートしやすいよく整理されたカテゴリページ
• 社会的証明と説得力のあるコンテンツを組み合わせた洗練された製品ページ
• 進捗状況を表示し、買い物客に安心感を与えるシンプルなチェックアウトページ

各ページのレイアウト、コンテンツ、およびナビゲーションは、買い物客が探している情報を見つけやすくすると同時に、購入に近づくように誘導するために存在します。 買い物客が望むシームレスなeコマースエクスペリエンスを作成するには、4つのページすべてが連携して機能する必要があります。 それはすべてホームページから始まります。

整頓されたホームページ

1.製品の価値を即座に明らかにする

ホームページは第一印象です。 買い物客は、製品の価値をすばやく確認できなければなりません。 ホームページを使用して、技術的な機能についてドローンを使用しないでください。 買い物客が製品がどのように問題を解決し、生活を改善するかを想像するのを助けます（Jobs to Be Doneフレームワークは有用な出発点です）。

コピーライティングは短く、要点を絞ってください。 製品の利点を説明する写真を使用してください。 買い物客が価値を理解するためにたくさん読んだり、たくさんスクロールしたり、長々とした解説動画を見たりする必要がある場合、価値はすぐにはわかりません。

2.どこからでも検索を有効にする

少数の商品しか販売していないeコマースサイトでは検索バーは必要ないかもしれませんが、商品が増えるにつれて、検索は顧客がメンタルモデルに従って商品を見つけるための不可欠な方法になります。 スティッキーな検索バーを使用すると、すべてのページのどこでも検索を利用できますが、変換のためにチェックアウトページから検索を削除することをお勧めします。

3.買い物客にわかりやすい名前を製品に付ける

内部的に意味のある製品名は、買い物客を困惑させる可能性があります。 意思決定のコンテキストを提供します。 モデル番号または基盤となるテクノロジーに基づく名前は、素人を遠ざけるリスクがあります。 可愛すぎるタイトルやクリエイティブなタイトルについても同じことが言えます。 買い物客の視点から有用性または価値を示す製品名を選択します。

4.お得な情報とプロモーションを強調する

買い物客は特定の商品を念頭に置いてeコマースサイトにアクセスします。 お得な情報やプロモーションがホームページに溶け込むと、見過ごされてしまいます。 明るい色、太字のテキスト、全ページの写真を扱っています。

販売が二次的に重要である場合、それは目立つはずですが、ホームページの主要な価値提案と競合してはなりません。 プロモーションが買い物客が知っておくべき一番のことである場合は、それにスポットライトを当ててください。

よく整理されたカテゴリページ

1.グリッドで製品を提示する

デスクトップ画面によって提供されるスペースは、製品グリッドに最適です。 グリッドはFパターンスキャンと連携し、買い物客が複数の製品をすばやく比較できるようにします。 写真で説明しやすいアイテムに特に効果的です。 グリッドのメリットを最大化するには、1行あたりのアイテム数を2から4の間に保つようにしてください。 5つ以上の製品では、グリッドのスキャンが非常に困難になります。

ボーナス：リストビューは機能しますが、より詳細な説明が必要な製品に最適です。

2.簡単なナビゲーションを確保する

ナビゲーションは直感的である必要があります。 買い物客は、カテゴリページを切り替えたり、商品フィルタを有効にしたりするのに苦労しないでください。 1つのカテゴリに多数の商品があるサイトでは、左列のナビゲーションを使用して、買い物客がさまざまな属性に従って商品を並べ替えることができるようにする必要があります（ファセット検索）。

3.ベストセラーを紹介する

ベストセラーアイテムに固有のアイコンを付けるか、ベストセラーセクションに配置します。 なんで？ ベストセラーは社会的証明の一形態です。 人々が不確かなとき、彼らは自分自身を決定するために他人の行動に目を向けます。 これは特に新しい買い物客に当てはまります。

同様の原則が最近発売された製品にも当てはまります。 新しく改良されたアイテムを紹介することは、単なる1回限りの販売戦術ではありません。 これは、買い物客が将来の更新のために戻ってくるように誘う方法です。

洗練された製品ページ

1.社会的証明で誘惑する

社会的証明は買い物客への信頼を植え付けます。 評価とレビューは購入の決定に大きな影響を与えますが、デスクトップサイトは、他の形式の社会的証明を処理するのに十分な広さです。

• お客様が撮影した商品写真
• 有名人とインフルエンサーの推薦
• 専門家からの引用
• 独立したレビューサイトからの承認バッジ

社会的証明の目標は、買い物客が他の人の前向きな経験と一致する情報に基づいた決定をしているように感じられるようにすることです。

2.コピーと画像を使用して良い生活を示します

eコマースのコンテンツは有益である必要がありますが、事実や機能リストよりも説得力があります。 テキストと画像を使用して、買い物客がチェックアウト後に彼らを待っている良い生活を想像できるようにします。

ここでも、デスクトップサイズが利点です。 巨大な写真やビデオを使用したり、さまざまな角度から製品を表示したりしない理由はありません。 同じことがコピーにも当てはまります。 ヘッダーを巨大にし、テキストブロックを十分な量の空白で囲むことを躊躇しないでください。

3.アップセルと関連製品でより多くを稼ぐ

買い物客が商品ページに表示される内容に満足していない場合は、他のオプションを見つけるためにカテゴリページに戻る必要はありません。 代わりに、同様の価格帯の代替製品、またはより優れた機能、レビュー、またはブランド認知度を備えたより高価なオプションを提示します。

商品ページを補完する関連商品を提案することも可能です。 靴を買う？ 靴ひもとアーチサポートも手に入れてみませんか？ 摩擦を減らすために、関連するアイテムに「カートに追加」オプションがあることを確認してください。

4.大きくて大胆な「カートに追加」ボタンをデザインする

商品ページに関しては、「カートに追加」ボタンを目立たせる必要があります。 それらを大きく、高コントラストで、クリックしやすいものにします。 機知に富み、明確で行動指向の行動を促すテキストを書くという衝動に抵抗してください。

買い物客は、ショッピングカートに商品を追加するときに、視覚的なフィードバックを受け取る必要があります。 多くのデスクトップサイトは、画面の横から瞬間的にスライドするカートサマリーオーバーレイを使用してこれを行います（買い物客がチェックアウトに移行したり、ブラウジングを続けたりできるようにするクリエイティブな方法）。

簡単なチェックアウトページ

1.買い物客のチェックアウトの進捗状況を表示する

eコマースの買い物客はオンラインで商品を探すのに多くの時間とエネルギーを費やしています。 購入する準備ができたら、プロセスの終わりが見えているという安心感が必要です。 プログレスバーは、チェックアウトの各段階で買い物客がどこにいるかを示す簡単な方法です。

2.複数の支払い方法を受け入れる

利便性とセキュリティは、買い物客が支払いゲートウェイに到達する際の主な懸念事項であり、カートを放棄する最大の理由の2つです。 幸いなことに、セキュリティ上の懸念を軽減し、チェックアウトを促進するオンライン支払いオプションが増えています。 信頼できる会社（AmazonやAppleなど）が支援するサードパーティの支払いオプションは、クレジットカード情報を入力するよりも買い物客にとって魅力的かもしれません。

Paypal CreditやKlarnaなどの「今すぐ購入して後で支払う」（BNPL）オプションも検討する価値があります。 BNPLは、顧客が商品を受け取った後、時間をかけて商品の代金を支払うことを可能にするPOSクレジットの形式です。

3.ゲストチェックアウトを検討する

ゲストチェックアウトは、すべてのeコマース小売業者、特に顧客アカウントの生成を中心としたビジネス戦略を持つ小売業者にとって適切ではない場合があります。 ただし、チェックアウトを加速し、アカウント作成の疲労を防ぎ、カートの放棄を減らすことが証明されています。

別の方法は、注文確認のために電子メールを要求し、その後、配送および配達メッセージで取引をフォローアップすることです。

4.明確な注文概要を提供する

これは必須です。 買い物客に次のような簡潔な注文の概要を提供します。

• 製品の詳細と数量
• すべての料金の内訳
• 配送と請求に関する情報

商品の写真を表示するのも賢明ですが、属性が顧客の選択（色、サイズ、仕上げなど）と一致していることを確認してください。

5.セキュリティバッジとカスタマーサポートで信頼を高める

セキュリティバッジとサードパーティの承認を表示して、買い物客に自信を与えます。 チェックアウトは、確認済みのランキングとレビューを買い物客に思い出させるのに最適な場所です。

近くには、チャットボット、返品ポリシー、FAQへのリンク、カスタマーサポートラインなどのサポート機能が含まれています。 買い物客はチェックアウト時にこれらのリソースを使用しない場合がありますが、それらが存在することを知っているので安心できます。

eコマースUXのベストプラクティスを遵守する

ショッピングは触覚です。 オブジェクトの重さ、角度とエッジ、フィット感と感触-これらは重要です。 存在感がない場合は、親しみやすさとディスプレイのサイズが非常に重要です。 デスクトップは両方を提供します。 これは、画面が広く、ナビゲーションが簡単で、画像やビデオがより現実に即した快適なパラダイムです。

その欠点にもかかわらず、モバイル小売は比較的新しい分野です。 解きほぐすためのねじれがありますが、それはオンラインショッピングの未来のままです。 それまでは、デザイナーはeコマースUXのベストプラクティスを使用してデスクトップサイトを最適化することにより、現在から利益を得るのが賢明です。

ご意見をお聞かせください。 以下にあなたの考え、コメント、フィードバックを残してください。

•••

Toptal Designブログでさらに読む：

• eコマースUX–ベストプラクティスの概要（インフォグラフィック付き）
• eコマースウェブサイトデザインの究極のガイド
• eコマース101：ショッピングカートの放棄を理解する（インフォグラフィック付き）
• eコマースUX–基本的な設計戦略と原則
• 著名なeコマースのトレンドとそのデザインへの影響（インフォグラフィック付き）