ネットショップで売れるデザインを決めるための５つのコツをご紹介します。
こんな方にオススメの記事
- 自分のお店に最適なテンプレートを知りたい方。
- 売れるレイアウトの基本的な事柄を知りたい方。
- WEBサイトの視線誘導について理解したい方。
デザインを語るその前に
売れる・売れないは商品画像で９割以上は決まる
ネット通販で売るために一番重要なのは「商品写真」です。
とくに、食品、ファッションなど見た目で購入が決まるようなものは９割以上は商品画像で決まると断言してもいいですね。
このあと売るためのデザインについて色々語るのですが、なによりも優先すべきは商品画像だという点を忘れないでください。
どこに”時間”と”お金”をかけるかという話です。
たとえば、予算が少ないなら、BASE、STORES、あたりを利用して、大部分の予算は写真撮影に費やします。売れるデザイン、レイアウトなんて売れる商品画像ありきの話だと考えてください。
超格安な制作代行サービス
売れるデザイン５つのコツ
レイアウトは商材と商品点数で決める
ネットショップのテンプレートやレイアウトは商材と商品点数で決めていきます。
言葉で説明してもわかりづらいので具体的にみていきましょう。
質問：一番売れるテンプレートはどれでしょう？
上記３つのテンプレートは、無料ネットショップ作成サービスの「STORES
」で選択できるテンプレートの一例です。
このなかで一番売れるのは、どのテンプレートだかわかりますか？
答えは、商材と商品点数で変わります。
では、そのテンプレートを選択する上で参考にしてほしいポイントについて解説していきます。
デザイン１を選んだ方がよい商材とは
これは、国内ファッション通販サイト、ZOZO、SHOPLIST、などが採用しているレイアウトとおおむね同じサイズ感です。
このデザインが最適なのは、ファッション通販サイトをはじめとする、商品一覧でデザインを選ぶ必要のある商材です。
とても汎用性の高いデザインです。
そんなことない！と思われる方もいるかもしれませんが、
これは、大手通販サイトが色々な形で分析して出したサイズ感なので、とても信頼性の高いサイズ感です。
デザイン２を選んだ方がよい商材とは
先程よりも商品点数が多いレイアウトです。商品画像が増えた結果、画像サイズは小さくなりデザインの細かな部分が若干みえづらくなりました。
事務用品を販売している「アスクル」などは、このデザインに近いですね。
なぜアスクルは、こちらのデザインを選ぶのでしょうか？
それは、商品一覧の１ページでたくさんの商品をみれたほうが「ユーザービリティ」が高くなるからです。
ユーザービリティとは、インターネットにおけるWEBページの使いやすさや使い勝手のことです。
アスクルの販売しているのは事務用品は、ZOZOのように一覧で細かなデザインが確認できなくても不便さはないというわけです。
だから、こちらのデザインが採用されているわけですね。
デザイン３を選んだ方がよい商材とは
このレイアウトが最適な商材を考えてみてください。
このデザインは、商品画像だけでは魅力が伝わらない商材でよく利用されます。
答えは、健康食品、化粧品、ダイエット器具などですね。
健康食品でよく知られる「やずや」の商品ページなどはこの形です。
縦一列にすることで、視線もそらすことなくで、まるで語りかけるようなコンテンツを作ることができます。サイドバーは無くてもいいかもしれません。
勘違いしてほしくないのですが、
このデザインが絶対にファッション通販に向いていないわけではありません。
説明が必要な商材であれば最適なデザインだと言えます。
深夜の通販番組でみかける本皮のバッグ、真珠のネックレスなどを思い出してみてください。この形がベストだとわかりますね。
重要なのは、商材と商品点数で最適なレイアウトは変わるということです。
ネットショップには王道のレイアウトが存在しますが、それが全ての店舗で同じように最適とは言い切れないというわけです。
自分のお店にあったレイアウトを選択しましょう。
」など、そのままテンプレートを使えるタイプがオススメです。無難にキレイなサイトが作れます。
購入者の属性に合わせたデザインをする
あなたのお店のお客さんをイメージしてみてください
- 年齢・・・文字サイズ
- 性別・・・色合い
- 趣味嗜好・・・デザイン
一番わかりやすいのは文字サイズですね。
たとえば上記でもあげた「ZOZO」と「やずや」で文字サイズを比べた場合、高齢者が多いやずやはZOZOよりも文字サイズは２倍近く大きいです。
重要なのは、属性に合わせて最適なデザインとレイアウトを提供することです。
性別や趣味嗜好なども属性に合わせなければ売れません。
大手はここまでしている
Hamee株式会社というスマホケースを販売している企業をご存知ですか？
楽天市場でさっと検索しても３サイト以上出店していました。
全てスマホケースのお店ですがなぜ３サイト以上も出店するのか・・・・。
すべては顧客に合わせた販売方法をするためです。
同じ商品でも「男性用」と「女性用」で商品画像を変えて出品しています
このように、顧客全員に同じサービスを提供するのではなく、属性に合わせて最適な販売方法を変更する手法を「パーソナライズ」と呼びます。
ハミーは、楽天市場ショップ・オブ・ザ・イヤーも何度か受賞、現在は東証一部（3134）の企業です。
ボタンの色は何色が売れるの？
たとえば「購入する」というボタンの色は何色が最適だと思いますか？
青がよいというサイトもあれば、緑がよいとか、赤がよいとか、答えはまちまちで正解をみつけることはできません。
どれでも構わないという考え方もできますが、そこもパーソナライズで属性に合わせて選択すると考えると正しい道に近づけるのではないでしょうか。
ちなみに、楽天市場は「赤」、Amazonは「オレンジ」、ZOZOは「グレー」です。じつは店舗のメインカラーとも同じです。
全てのページがトップページだと考える
ネットショップのアクセス解析をみると、トップページ以外にも商品ページから来店するユーザーが多いことがわかります。
つまり重要なのは、商品が購入に至らなかった場合に、ほかの商品に興味を持ってもらえるように商品ページの下部分を作り込むことが大切です。
とくに、楽天市場、Yahoo!ショッピングなど、ショッピングモール型のネットショップは、商品ページがトップページだと考えて時間を掛けて最適な配置を考えてください。
完成後も常に検証を続けましょう
よくデザインの導線を解説しているサイトを目にしますが、基本的にあれば後付けの理論であって、先に学ぶようなものではありません。
視線の動きは完成してから検証して改善していくものです。
具体的な方法としては、自分が買物をする気持ちになって自分の店舗をチェックしてみてください。自分ではちょっと・・という方は、知人やスタッフなど第三者に試してもらいましょう。
また、アクセス解析のヒートマップを活用してもいいですね。
上画像は当サイトのヒートマップ解析ツールの結果です。
少し調査日数が少ないのでわかりづらいかもしれませんが、上の４つのバナーでも一番左の「基本料金無料」よりも一番右の「資金0円の受注生産」の方がクリック数が少ないことを知ることができました。
-
-
無料ヒートマップ解析ツール User Heat : どこが読まれているか見えるアクセス解析
ヒートマップ解析ツール開発企業のユーザーローカルが提供する、無料ツール。アイトラッキングを疑似体験。
続きを見る
常に検証してデータに基づいてレイアウトを変えていきましょう。
顔写真は視線をあつめるのに有効
視線を誘導するテクニックとして、人物の顔写真を掲載するのは有効です。
楽天市場のカニを持っている子供、スマホケースを持っている女性など。商品写真に人物を入れた写真などもその効果を狙ってのものだと言えるでしょう。
商品が探しやすい環境を整えましょう
意識してほしいのは下記２つの位置です。
- 検索ボックス
- 問い合わせ先
検索ボックスは、ファーストビューでみえる位置に設置しましょう。
サイドバーに設置する場合には、最上段またはその付近で見つけやすい場所が最適です。電話での問い合わせでも案内がスムーズにできます。
お問合せ先は、多くの店舗が設置している最下部にはおいておきましょう。とくに多い質問内容は、よくある問い合わせなどをつくり掲載してもいいですね。
まとめ
ネットショップのデザインについて、５つのコツをご紹介しました。
もう一度まとめると
- レイアウトは商材と商品点数で決める
- 購入者の属性に合わせたデザインをする
- 全てのページがトップページだと考える
- 完成後も常に検証を続けましょう
- 商品が探しやすい環境を整える
全ての商材に対して万能な答えはありません。
もちろん、当サイトの情報が正しいとも限りません。笑
あなたのお店に最適なデザインを模索してみてください。
最後まで読んで頂きありがとうございました。
また新しい情報などあれば更新していきます。
