売れるECサイトのデザインってどんなの？作り方や制作事例までをご紹介

監修者

売れるECサイトのデザインとは？

まず売れるECサイトのデザインとはどんなものか見ていきましょう。

▼売れるECサイトのデザインとは？
・トップページでは店舗の強みを全て伝える
・カテゴリーページでは商品ページへの導線を工夫する
・商品ページは詳細がわかるような丁寧なデザインに
・カートページではとにかく使い勝手の良いデザインを意識
・特にスマホサイトで見やすいデザインを重視する

詳しく解説していきます。

トップページでは店舗の強みを全て伝える

まず売れるECサイトにするために重要なのが、ECサイトのトップページのデザインになります。

結論、ECサイトのトップページは、店舗の強みが全て伝わるような構成とデザインにするべきです。

基本的なECサイトのトップページは以下のように「ヘッダーエリア」「メインビジュアルエリア」「メインコンテンツエリア」「サイドメニュー」「フッターエリア」の５つで構成されているので、それぞれのエリアでどういった訴求をするべきか見ていきましょう。

◆ヘッターエリア

まずトップページのヘッダーエリアでは、以下の要素を入れるようにしましょう。

・ロゴ
・ログイン、会員登録、買い物カゴ
・カテゴリー
・商品検索窓口
・問い合わせ窓口、電話番号

ヘッダーエリアは、トップページを見る中でも追従して表示されるエリアなので、買い物をするうえで必要な要素を必ず入れるようにしてください。

ヘッターに上記の要素がないECサイトは、かなり使いづらいです。セオリー通り、基本的に必要なものを設置するようにしましょう。

◆メインビジュアル・メインコンテンツ

メインビジュアルは、トップページの中でも一番目立つ部分なので、「今一番買うべきおすすめ商品」や「セール情報」「展開中のキャンペーン」などを画像バナーで掲載するようにしましょう。

▼メインビジュアルキャンペーン情報　掲載例

※参照：ファッション通販fifth

またメインビジュアルの下のメインコンテンツ部分には、「おすすめ商品」や「新着商品」「商品の人気ランキング」などを掲載すると、ユーザーがスムーズに欲しい商品を見つけることができますよ。

◆サイドメニュー

サイドメニューでは、商品を見つけやすくするための商品カテゴリーページやキャンペーンページへの誘導メニューを配置しましょう。

なお商品カテゴリーの表記は、テキストだけではなく、カテゴリーをイメージさせるアイコンも一緒に掲載するのがおすすめです。アイコンの表記もすれば、ユーザーが直感的に何のカテゴリーなのかを理解しやすくなり、購入率もUPする傾向にあるからです。

◆フッターエリア

フッターエリアは、サイトの最下部で目立つ位置ではないため重要度の低い以下の内容を掲載するようにしましょう。

・運営会社
・利用規約
・プライバシーポリシー
・採用情報
・お問い合わせ

特にECサイトで決済することに対して不安があるユーザーのために「運営会社情報」は、しっかりと掲載するのがおすすめですよ。

カテゴリーページでは商品ページへの導線を工夫する

次に商品のカテゴリーページでは、商品の探しやすさを重視したデザインを意識しましょう。

カテゴリーページ内では、基本的に「商品写真」「商品名」「価格」のワンセットを羅列して掲載します。またそれだけではなく、以下のようなコンテンツも掲載することで、より多くのお客さんを商品ページへ斡旋させることができますよ。

◆カテゴリー内のおすすめ商品を案内すると◎

カテゴリーページのファーストビューでは、カテゴリー内でのおすすめ商品をピックアップするのがおすすめです。
▼アイコン設置例

※参照：ファッション通販fifth
上記ECサイトのように、カテゴリ内での人気ランキングを設置することで、お客さんがほしい商品をいち早く見つけることができ購入率UPにもつながりますよ。

◆アイコンを追加するのもおすすめ

またカテゴリーページで羅列する商品の中でも、割引セール中の商品には「〇％引き」「SALE」というような目立つアイコンを追加すれば、お客さんの購買意欲を一層高めることができますよ。

▼アイコン設置例

※参照：グレイル

また、上記のECサイトのように、新商品に「NEW」といったアイコンを設置すれば、リピートのお客様も手軽に新商品を見つけることが可能です。

商品ページは詳細がわかるような丁寧なデザインに

売れるECサイトの商品ページは、商品の詳細がわかるような丁寧なデザインであることが多いです。

商品名や価格、特徴やスペックなどの商品情報を正しく掲載するだけではなく、利用した時のイメージが伝わるような情報を記載しましょう。

◆利用イメージができる商品写真を掲載する

商品ページでは、商品写真が一番重要といっても過言ではありません。

ただ単にきれいな商品写真を掲載するだけでなく、購入後の利用イメージが沸くような写真を掲載するようにしましょう。

例えばアパレルECであれば、身長別のモデルさんの着用写真や、素材感が伝わるような動画を掲載するのも良いでしょう。

▼身長別　丈のイメージ画像

※参照：ファッション通販fifth

また雰囲気の違うコーディネートの写真も複数枚あると購入後のイメージが沸きやすく、購入率UPが見込めますよ。

◆口コミレビューが多いと安心感がUPする

また商品ページには、お客様の口コミレビューを掲載するのがおすすめです。

というのも口コミレビューは、購入前のお客様に安心感を与えますし、商品や店舗の信頼度が高まると言われているからです。

口コミレビューを集めるには、ポイント付与やプレゼントキャンペーンの実施が有効になります。購入率UPのためにも、実施してみてくださいね。

カートページではとにかく使い勝手の良いデザインを意識

ECサイトのカートページは、とにかく使い勝手の良いデザインを意識して構築しましょう。

そのためには、「入力フォームの煩わしさをなくす」「レコメンド機能・送料無料キャンペーンを導入する」といった工夫をするのがおすすめです。続いて詳しく解説していきます。

◆入力が煩わしくないフォームにする

カートページの入力フォームは、入力の手間をできるだけ抑えた内容を設定しましょう。

というのも、支払情報や配送情報などで入力の項目が多すぎると、ユーザーは入力作業が煩わしくなり、商品を購入せずにサイトを離脱してしまう可能性があるからです。

そのため、現在の入力フォームに不必要な入力項目はないかを見直してみるのがおすすめです。また入力フォームをできるだけ簡易にするために「ID決済」などを導入する企業も増えてきているので、自社サイトでも検討してみましょう。

◆レコメンド機能や送料無料キャンペーンで購入意欲をUPさせる

カートページでは、購入する商品とセットで別の商品をおすすめできるレコメンド機能を導入すると客単価をアップさせることが可能です。

またカートページに「あと〇〇円で送料無料」というキャンペーンを掲載すれば、お客様が商品をついで買いする可能性が上がり、それに伴い客単価をアップさせることができますよ。

特にスマホサイトで見やすいデザインを重視する

ここまで売れるECサイトのデザインについて解説してきましたが、これらのデザインはスマホサイトで見やすい構成を重視するのがおすすめです。

というのも、現在インターネットのスマホ利用率は全体の68.3％だから。もちろん、扱っている商材によっても異なりますが、BtoCで商品を販売しているECサイトであれば、お客様はスマホから購入する可能性の方が高いと言えるでしょう。

スマホはPCよりもはるかに文字が小さく、タップ操作などの閲覧方法がPCとは大きく異なります。そのため、ECサイトの構築が完成したら、使いにくいところはないか必ずスマホでチェックするようにしましょう。

売れるECサイトの作り方

ここでは売れるECサイトの作り方を解説していきます。

▼売れるECサイトの作り方
1.3C分析を行う
2.ECプラットフォームを選定する
3.ECサイトを構築する
4.集客を行う
5.サイトの分析→改善を行う

詳しくみていきましょう。

3C分析を行う

売れるECサイトをつくる前に、そもそも取り扱っている商品は売れる見込みがあるのものか”3C分析”を行いましょう。

3C分析とは、顧客、競合、自社の3社をそれぞれ分析し、戦略を考える手法のこと。これをしっかり行うことで、取り扱っている商品や自社のやり方でネットショップを始めてしっかり売り上げが立つのかを確認することができます。

それではここからどのように3C分析を行えばいいのか「市場・顧客分析」「競合分析」「自社分析」それぞれの分析方法を詳しく解説していきます。

◆市場・顧客分析

3C分析でまず行ってほしいのが市場と顧客の分析になります。

市場は、自社が取り扱っている商品の市場規模や動向、成長性、トレンドなどを調査しましょう。

市場規模を調べる時には、様々な消費者データを見ることができる「総務省統計局」などを使いましょう。これを使えば、自社で取り扱う商品ジャンルが「特定の地域」で「どの性別、どの年代」のユーザーに使われているかなどを確認することができます。

また、顧客については、自社で取り扱っている商品にニーズのある顧客はどのような人かということを徹底的に調査しましょう。

調査するときは、メインとなる顧客の性別・年齢・年齢ごとのニーズ・商品にどんなことを求めているのかといったことを調べるようにしてくださいね。

◆競合分析

市場や顧客分析が完了したら、続いて競合分析を行っていきましょう。

競合分析では、ライバルのECサイトを複数ピックアップし、

・商品の強み、弱み
・価格
・取扱商品数
・ECサイトの強み、弱み
・どんな販促を行っているのか

といった情報をリサーチしましょう。

なお競合分析を行う際は、「参入予定のジャンルで集客はできるのか」「取扱商品は問題ないか」「価格は今のままで大丈夫か」といったように競合調査を行う目的を決めてからリサーチするのがおすすめです。

◆自社分析

最後に自社の分析を行っていきます。

自社分析では、自社の強み・弱みを以下の項目ごとに分析していきましょう。

・用意できる予算について
・確保できるリソースについて
・取扱商品の強み、弱み（数、価格、品質など）

これらの項目を元に自社の強みと弱みを明確にすることで、今後自社で何を行っていくべきかを判断することができます。

ECプラットフォームを選定する

3C分析が完了したら、自社の商品をどのECプラットフォームで販売するかを選定しましょう。

ECプラットフォームは大きく分けて2つ「楽天市場やAmazonのようなECモールに出店する方法」と「自社独自のECサイトを制作する方法」があります。

それでは、どちらで運営すればいいのかそれぞれの特徴を見ていきましょう。

◆ECモール

まず楽天市場やAmazonなどのECモールに商品を出品する場合のメリットとデメリットを見ていきましょう。

ECモールは、そもそもユーザーからの知名度が高く利用者数も多いので、自ら集客を行わなくても、一定数のお客様に訪問してもらえるというメリットがあり、初心者でも始めやすいのが特徴です。

しかし一方で、出店に費用が掛かることや、ライバル店との価格競争が起きやすいといったデメリットも。またECモールに出店してもお店のブランディングをするのが難しく、お客さんがリピーターになりづらいという注意点があることも頭に入れておきましょう。

◆自社ECサイト

続いて自社ECサイトを制作する場合のメリット・デメリットを見ていきましょう。

自社ECサイトを制作する場合、ECモールと異なり出店費用や手数料などを支払う必要がなく、利益率が高いというメリットがあります。また自社専用のECサイトとなるので、お店のブランディングがしやすくお客様がリピーターになりやすいといった長所があることも頭に入れておきましょう。

一方デメリットをあげると、自社ECサイトは集客にWEBマーケティングの知見が必要で、成果が出るまでに時間がかかるということがあげられます。主体的にECサイトを運営していかないと商品が全く売れないということにもなりかねないので十分注意しましょう。

ECサイトを構築する

ECプラットフォームが決定したら、ECサイトを構築していきましょう。

ECモールから出店する場合は、それぞれのモールにて店舗ページ・商品ページを制作。自社ECサイトを制作する場合は売れるECサイトのデザインとは？を参考にサイト構築を行ってください。

※自分でECサイト構築するのが難しい場合は売れるECサイトの運営・制作会社おすすめ3選から依頼しましょう。

集客を行う

ECサイトの構築が完成したら、かならず集客の施策を実施しましょう。

ECサイトの集客は基本的に「SNS」「広告」「SEO対策」から行います。それぞれそのように施策を行うべきか詳しく見ていきましょう。

◆SNS

ECサイトの集客のために、欠かすことができないのがSNS運用と言えるでしょう。

SNSには「Instagram」「Twitter」「FACEBOOK」など様々なツールがあり、それぞれの特徴にあった対策を行うことで、多くのユーザーを集客することができますよ。

◆広告

ECサイトの集客のために広告を活用するのも一つの手と言えるでしょう。

広告にも「リスティング広告」「ディスプレイ広告」「SNS広告」「アフィリエイト広告」など様々な種類の広告があり、それぞれ特性が異なります。

それぞれの特性を理解したら、自社で扱う商品に一番マッチしている広告に出稿しましょう。

◆SEO対策

ECサイトの集客を行うためにSEO対策を実施するのも効果的です。

SEO対策とは、検索エンジンの検索結果において、特定のサイトが上位表示されるよう対策することをいいます。

サイトを上位表示させるために、サイト上の個々のページでは「検索ワードとの関連度が高いこと」「専門性が高いこと」「情報にオリジナリティがあること」「信憑性が高いこと」「更新頻度が高いこと」「情報のボリュームが多いこと」を重視したコンテンツをつくりましょう。

これらのポイントに注意をして、サイト上でブログ記事を更新すればサイトのSEO対策となります。是非チャレンジしてみてくださいね。

サイトの分析→改善を行う

ECサイトの集客施策まで完了したら、必ずサイトの分析と改善を行うようにしましょう。

ECサイトの売上は、基本的に以下の売上方程式で構成されています。分析の際にはそれぞれの数値を確認するようにしてください。

なお、上記の【アクセス数】は、グーグルアナリティクスで調べることができます。

また【購入率】は、「訪問者数➗購入回数」で算出しましょう。

売れるECサイトの事例5選

ここでは売れるECサイトの事例を5選紹介します。

・fifth
・SHEIN
・北欧、暮らしの道具店
・ダイアナ
・井上誠耕園

それぞれ見ていきましょう。

fifth

fifthは、”いくつになっても自由におしゃれを楽しみたい女性に向けたファストファッションブランド。”がコンセプトのアパレルECサイト。

ECサイトの商品ページでは、モデルの身長別画像や、モデルの着用動画までを掲載し、購入後のイメージがつきやすくなるようなデザイン設計になっています。

▼モデルの着用動画

またコーディネートの着用アイテムをすぐに確認できる「着用アイテムボタン」を設置し、商品のセット購入へつなげています。

▼着用アイテムボタンで他商品を訴求

SHEIN

SHEINは、ファッションの美しさをすべての人が利用できるようにすることを目的とした、グローバルなファッションとライフスタイルの電子小売業者です。

中国のアパレルECブランドですが、インフルエンサーマーケティングを行うことで、日本や海外でも爆発的な人気を集めました。

具体的には、KOC（フォロワー数は少ないがフォロワーとの関係がより親密で影響力が高いインフルエンサー）を大量に起用し、インスタやユーチューブSnapchat、TikTok、FacebookなどのSNSで商品紹介やコーディネートなどのコンテンツを投稿してもらうことで、消費者への認知度拡大に成功しました。

またSHEINは、アフィリエイト広告にもかなり力を入れることで、販売チャネルの拡大に成功したともいわれています。

北欧、暮らしの道具店

「北欧、暮らしの道具店」は、北欧雑貨や北欧食器を中心に販売を行っているECサイトです。

「北欧、暮らしの道具店」は、主にコラムでのコンテンツマーケティングや自社アプリからの購買に成功していて「雑誌の紹介ページでそのまま商品を購入できるようなECサイト」となっています。

具体的に言うと「北欧、暮らしの道具店」のコラム記事では、商品の利用イメージを文章や写真で伝え、記事の最後にこれまで紹介した商品のバナーを設置しています。そのため、雑誌に掲載された商品をそのまま購入できるような仕組みとなっているのです。

この仕組みがかなり人気を集めていて、2016年段階でのサイトの月間アクセス数は月1200万PV。数多くのファンを獲得しています。

ダイアナ

ダイアナは、エレガンスやカジュアルなレディースシューズを展開するブランドで、いち早くオムニチャネル化に成功したと言われています。

例えば、ユーザーの「ECサイトで靴を購入するとサイズ感がわかりづらい」という課題に対して、購入前に試着できるよう、ECサイトで選んだ商品が「実店舗で取り扱っているか・在庫はあるか」「店舗の詳細情報」をネットで簡単に確認できるように改良しました。

井上誠耕園

「井上誠耕園」は、食パン、スイーツ、栽培果実などの食品を販売しているECサイトです。

「井上誠耕園」では、生産者の写真と自己紹介が掲載されたスタッフ紹介ページを作成することで、消費者に安心感を与え購入率アップに成功しました。

また自社でYOUTUBEチャンネルを開設し、生産している食品の魅力や農業体験、食品のレシピなどのコンテンツを発信することで、お店のファンづくりを行っています。

売れるECサイトの運営・制作会社おすすめ3選

アートトレーディング株式会社

当社、アートトレーディングは、東京都池袋に本社を構えるECサイト制作・運営会社。

一番の強みは、ECサイトの構築から運営、その後のカスタマーサポートやフィルフルメントまでを一貫してサポートできるところです。

当社は、特に”売れる”ということに特化したEC会社なので、ECサイトで商品を販売するためのノウハウが豊富。専任のスタッフがお客様の商品を売るところまでを徹底的にサポートするので、初めてEC運営をするという事業者でも安心してお任せいただけます。

またアートトレーディングは、自社内にフルフィルメントセンターを保有しているので、在庫管理や物流業務の知見も豊富でサポート体制も手厚いです。そのため「商品が売れてから物流業務をおざなりになって顧客が離れてしまった」ということも起きることがなく、ECサイトの売上を安定的に上げていくことができますよ。

株式会社ECホールディングス

株式会社ECホールディングスは東京都港区に本社を持ち北海道にも拠点を置く14年以上の構築実績を保有する制作会社です。

EC運営代行だけでなく、自社EC事業やリアル店舗のスイーツ事業など多岐にわたり事業を展開しています。

食品や美容、雑貨系の実績が多く継続率90％以上であり安心して任せることができます。

サイト制作、更新、メルマガ配信、商品登録、広告運用、SEO対策、受注、CS代行、SNS運用までネットショップに関わる業務の殆どに対応可能となっています。

月商数億円クラスの事業だけでなく業務一つから代行可能であるため気軽に相談することができます。

インターネット・ビジネス・フロンティア株式会社

インターネット・ビジネス・フロンティア株式会社は東京都渋谷区の会社でWebマーケティング支援を15年以上にわたり手掛け新規立ち上げから事業フェーズの拡大などの課題解決策を提案する制作会社です。

IBF 2ndオピニオンという広告を第三者に診断・アドバイスする独自のサービスを提供していて、投資効果の高い施策に絞りABテストやPDCAを回しているため集客効果の最大化を実現しています。

15年にわたり蓄積されたノウハウを駆使し制作からマーケティングまでワンストップで対応可能となっています。

まとめ

ネットショップを売れるECサイトにするには、以下のデザインを考慮したページをつくることが重要です。

▼売れるECサイトのデザインとは？
・トップページでは店舗の強みを全て伝える
・カテゴリーページでは商品ページへの導線を工夫する
・商品ページは詳細がわかるような丁寧なデザインに
・カートページではとにかく使い勝手の良いデザインを意識
・特にスマホサイトで見やすいデザインを重視する

また売れるECサイトを作り上げるには、サイトのデザインだけではなく、集客施策を行うことや分析→改善を繰り返すことも重要といえるでしょう。

自分では難しいという場合は、売れるECサイトの制作や運営をサポートしてくれる会社もあるので、売れるECサイトの運営・制作会社おすすめ3選から依頼するようにしてくださいね。