Moz - SEOとインバウンドマーケティングの実践情報

Eコマースサイトを成功に導く「新17ヶ条」

Eコマースの大半は、1990年代の終わりごろ、まだそれが陳腐きわまりない代物で、デザイナーたちが、ウェブにおけるショッピングとはどうあるべきかという問題と格闘していた時代から、大きく進化を遂げた。やがて標準が確立し、ユーザビリティが勝利を収め、現在は好きなだけ買い物ができるようになった。ちなみに、米国勢調査局のEコマース統計によると、今や年間のEコマース売上規模は、1070億ドルにものぼるそうだ。

とはいえ、まだ良くなる可能性がある。オンラインショッピングは、赤ん坊ほどじゃないにせよ、まだ少なくともよちよち歩きの幼子ぐらいの段階にある。僕らがここに至るまでの進歩によって、購入手続きは以前よりずっと単純になり、使いやすくなったけど、まだそのやり方を理解していないサイトもある。

実は僕、ここのところかなりオンラインショッピングにハマッてて、(先週末の盗難事件と、中国への長期旅行が控えているおかげで)大量に買い物をしたんだ。その結果、Eコマースサイトのデザインについて、いくつかおもしろいことに気がついた。正確には17項目あるんだけど、それをこれからいっしょに見ていこう。

※Web担編注 ここで示した画像はデザインの都合でオリジナルよりも縮小されている。各画像をクリックすると“少しだけ”拡大されるので、画像が見にくい場合はクリックしてみてほしい。
Bluefly Screenshot

#1ユーザーの居場所を明らかに

ユーザーが、Eコマースサイトの階層を何段階も降りて商品を物色する際には、いつでも自分がサイト内のどこにいるのか示すことが重要だ。これは、ヘッドライン、下位ヘッダー(必要に応じて)、階層リスト(ホーム>カテゴリ>サブカテゴリ>製品みたいなもの)で実装すべきだ。

#2選択肢の絞り込み条件をキャンセルできるように

ユーザーが特定のカテゴリ内で「商品の絞り込み」を行ったら(上図の場合は、デザイナー「Ted Baker」を選択)、絞り込みをやめるのに「戻るボタン」を何回もクリックしなくちゃならないよりも、条件をクリック1発でクリアできる方が断然良い。

#3ソート順の選択肢を複数用意する

ソート順の選択肢として標準的なのは、「値段の低い順」「値段の高い順」「人気の高い順」(つまり「売れている順」)、「お勧め品」「ユーザー評価順」(ユーザー評価付きの商品がない場合は「スタッフの評価順」でも)、「新商品」あるいは「新着順」といったところだろう。特に推したいものがなければ、「お勧め品」は省いてもいいけど、それ以外のソート順選択肢は(可能なかぎり)すべて用意するべきだ。

#4多くの商品を見せる

サブカテゴリ内に商品が200点以上ある場合を除いて、1ページですべての商品を見られるように、表示件数のオプションを用意するべきだ。ブロードバンドの普及のおかげで、読み込み時間の問題はおよそ無視できる程度になったからね。個人的には、このオプションがないサイトには我慢がならない(僕の愛するMystery Guestも同じ意見だ)。

#5便利な選択機能の提供で優れたユーザー体験を

便利な選択機能を提供できれば、ユーザー体験がさらに向上すること間違いなし。たとえば上図の場合、サイズの選択肢は特に重要。だって、「完ぺきだ」と思った服飾品を見つけても、後でサイズがないことがわかったら、ひどくがっかりするからね。

#6絞り込めれば絞り込めるほど良い結果をもたらす

このルール#6は、とっても重要だと念を押しておこう。実際、ルール#7を読めば、あるセクション内で商品を絞り込む(これがルール#6の内容)のと、別のサブカテゴリに誘導するのと、かなり違いがあるとよくわかる。関連商品やお買い得品を、後者の形でオプションとして提示するのは賢い判断だと言えるだろう(ただし、誘導先のサブカテゴリに十分な点数の商品があればの話)。

#7価格がいくらで、どれくらいお得なのか明示する

商品カテゴリのページで表示するアイテムに、ユーザーが求める詳細情報がない場合がある。もちろん、ディスカウントサイト(多少なりとも希望小売り価格より安ければコンバージョンにつながる)では、価格の表示が特に重要なのは言うまでもないが、各商品の個別情報ページに飛ぶ前に、ちょっとでも多くの詳細情報を掲載しておけば、およそすべてのサイトでメリットがある。商品カテゴリのページで、素材や、サイズ/色/オプションなどの在庫情報などを、ほんの少しでも表示しておこう。

eBay Screenshot

#8わかりやすい場所に検索バーを常に表示しておく

検索を実行した際、検索語句と検索結果だけを表示するんじゃなくて、検索エンジンみたいに、検索バーを手前の真ん中に表示しておくこと。そして、ユーザーが検索クエリを修正できるよう、入力語句の表示も消さないでおくこと。

#9より詳細な検索オプションを用意する

高度検索に対応したシステムを持っているか、ユーザーが価格やオプション、色、サイズ、モデルなどを選択できるのならば、ぜひその機能を提供しておくこと。そうすれば業績も上がる。なんたって多くのユーザーが、Eコマースサイトで最もイライラするのは「検索」機能だって言ってるんだから(ここで引用できる調査結果がないのが残念)。

#10できるだけ類似した検索結果を示す(関連性は崩さずに)

上図の例は、クエリ語句を細かく分けて検索結果を表示するeBayの見事な処理だ。こうした上級テクニックは、ほかにもどんどん応用していこう。

Booq Screenshot

#11「適した用途範囲」を明確に示す

製品の多くは、何らかの基準に「合う」ようできている。たとえば上図のバッグの場合ならノートパソコンに適合する商品だし、洋服なら人の身体、何かの機器なら互換性が考慮されている。こうしたすべての組み合わせについて、個別商品ページで重要な詳細情報を示しておこう。上図のサイトに行き当たるまで、ノートパソコン用バッグのサイトをどれだけ見て回ったか覚えてないけど、上図のサイトでは、そのバッグがどういったサイズのノートパソコン用なのかということが、はっきりとわかるね。

#12早い段階で在庫の有無を明確に

いまだに、「カートに入れる」とか、ひどい場合は「レジに進む」ボタンをクリックしてから、ようやく購入商品の在庫がないと判明するサイトがある。こんな経験をしたら、ユーザーは別のEコマースサイトに行ってしまい、もう二度と帰ってこない。

#13写真はいくらあっても多すぎることはない

ユーザーは、実際に商品を手にとって見られるわけじゃないので、写真やレビュー、映像、あるいは妥当なら3次元回転画像を使い、購入前に商品を「手にとって試してみた」かのように感じさせることは、非常に有益だ。製造業者がすべてのオンラインショップに送付する商品写真、それもある方向から撮影しただけの1枚きりを掲載しても効果はない。求められる以上の視覚情報を示せば、コンバージョンもうなぎ上りだ。拡大写真表示のリンクも忘れずに。

Ted Baker Screenshot

#14配送オプションを表示する

ユーザーのなかには、ショッピングを始める前に、配送オプションをチェックしなければ気の済まない人たちがいる。年配の人たちがこの部類にあてはまることが多いんだけど、ベビーブーマー世代の人たちは、まだこの先もオンラインショッピングを利用する年数が長いため、無視するわけにはいかない。一番いいのは、配送オプション情報へのリンクを常にはっきりと表示させておくことだ(置き場所は、各ページの最下部が最も一般的)。

#15入手方法が別にあるなら明確に示す

上図の例だと、Ted Bakerは、僕が欲しいと思っている200ドルのドレスシューズを、僕の住む米国には発送してくれないようだ。しかしもっと悪いのは、僕が誰からTed Bakerの靴を買えるのか明記していないこと。結局、Amazon.comでその靴を見つけたけど、Tedは販売先のリンクを表示していないため、ユーザーがこのサイトから販売先に到達できないという失敗を犯している(僕がこれほどまでにTedの靴のファンじゃなかったら、おそらく僕の分の売上も失っていただろう)。

Dell Order Confirmation Screenshot

#16注文確認メールを必ず送ろう

いやぁ、今夜はパニクっちゃったよ。今のノートパソコンから乗り換えようと注文したパソコンが、中国旅行に間に合わないんじゃないかと思ったからね。誰だって愛しのノートパソコンなしで、28時間も飛行機に乗っていたくないさ。まあ、運良くDellの注文確認で、僕はうまい具合に発注していたことがわかって一安心。Eコマースサイトを運営する人は、ぜひこの事例を真似てもらいたいね。顧客に何の連絡も取らずに放置しておくんじゃなくて(もっと悪いのは、顧客サービス部門が自動応答形式のメールで混乱することだけど)、きちんと注文の確認を取ろう。

#17できるだけ早い段階で、すべての注文内容を明示する

注文確認を送信する際には、必ず配送商品すべての詳細を記し、顧客が正しく商品を選んだか確認できるようにすること。たとえば、サイズ8が欲しかったのに、誤ってサイズ9を注文しちゃうこともあるだろう。そうした場合には、商品が届く前に注文を修正できたら嬉しいよね。

うまくすると、これらのテクニックは、みんなのEコマースサイトに応用できるだろう。たとえそれが適わなくても、プロジェクトマネージャをつかまえて、この記事に目を向けさせることは可能だよね。

みんなでいっしょに、インターネットをもっとすばらしいショッピングの場にしようじゃないか。

この記事が役に立ったらシェア!
みんなが読んでるWeb担メルマガで、あなたも最新情報をチェック
  • SEOやデジタルマーケの最新情報をゲット
  • 事例やインタビューも見逃さない
  • 要チェックのセミナー情報も届く
みんなが読んでるWeb担メルマガで、あなたも最新情報をチェック
  • SEOやデジタルマーケの最新情報をゲット
  • 事例やインタビューも見逃さない
  • 要チェックのセミナー情報も届く

Web業界の転職情報

もっと見る
Sponsored by

人気記事トップ10(過去7日間)

今日の用語

クリエイティブ
広告やデザインにおける、作品そのものや作品に使われている素材のこと、または、そう ...→用語集へ

連載/特集コーナーから探す

インフォメーション

Web担のメルマガを購読しませんか?
Web担の記事がコンパクトに毎週届くメールマガジン「Web担ウィークリー」は、10万人が読んでいる人気メルマガ。忙しいあなたの情報収集力をアップさせる強い味方で、お得な情報もいち早く入手できます。

Web担に広告を掲載しませんか?
購読者数10万人のメールマガジン広告をはじめとする広告サービスで、御社の認知向上やセミナー集客を強力にお手伝いいたします。

サイトマップ
RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]