ネットショップのデザインで意識するべき10個のポイント
ネットショップにおけるデザインについて、どれだけの時間を使って考えられているでしょうか。
商品制作や集客活動に対しては多くの時間を割けている一方、店舗のデザインに関しては後回しとなっているネットショップ運営者の方も多いのではないでしょうか。
ネットショップのデザインやレイアウトは、苦労をして集客したお客様がショップの印象を決定する重要なポイントです。
色合いやレイアウト構成を変えるだけで売上が大きく変わることも珍しくはありません。
なかなか売上があがらないネットショップはデザインを単なる見た目と考えている傾向がありますが、そうではなく、デザインとは問題解決のための手段です。
ネットショップにあてはめた場合、デザインとは*「お客様が迷わずお買い物を楽しめるための方法」*と言えるでしょう。
よりよくショップを見せたい!という考えを中心に見た目ばかりを意識したデザインを行なってしまうとお買い物しづらいショップとなってしまいます。
今回は、お客様がお買い物を楽しめるためのデザインのポイントをご紹介します。
ネットショップのデザインで意識するべき10個のポイント
1.商品写真は何よりも大切
ネットショップで成果をあげるための大前提とも言えるのが商品写真です。
お客様はネットショップに商品を見にくるわけですから、その写真がぼけていたり、暗かったり、少なかったりとわかりづらいものであれば購入まで至ることはないでしょう。
中途半端な写真では、お客様からの信頼を得られることもありません。
可能であればプロのカメラマンに、自分で撮るとしても一眼レフのカメラを使って綺麗な商品写真を撮ることを心がけましょう。
全体写真、ディテール、利用イメージがわかる写真を用意することがポイントです。
2.商品写真の背景は白がオススメ
あらゆるデータを踏まえて購入体験を改善し続けているAmazonを見てもわかる通り、ネットショップにおいて商品が最も際立つ背景色は白と言われています。(Amazonは背景を白く撮影するための特許までもっているほどです。)
余計な演出なく商品に注目してもらいやすいというのと、清潔感、信頼感を得ることができるというのが白背景を推奨されている理由でしょう。
3.人の顔写真は視線誘導に効果的
イチオシの商品や売上を上げていきたい商品への誘導バナーには、人の顔を使うのが効果的です。
なぜなら人は無意識のうちに、人の顔に視線が誘導されると言われており高い確率で注目してもらうことができます。
広告バナーなどで女性の顔がよく使われているのはそのためです。
ネットショップの世界観にもよりますが、オススメの商品がある場合、モデルを用意して誘導バナーを設けてみましょう。
4.文字サイズや配色などに特に気を配る
商品写真の訴求を意識して見た目を重視するあまり、薄い文字や小さな文字を多様すればお客様にとってストレスです。
パソコンではもちろん、スマホでも読みやすい文字サイズや色合いを心がけましょう。
そのほか、配色も重要となりますので、商品を引き立てるネットショップのキーカラーを中心に、全体で3色程度の配色にまとめます。
注意点として、全体を目立たせることだけを目的にデザインしていると、逆に必要なところが目立たなくなりますので、コントラストを意識しましょう。
購入率を高めるということは、ネットショップをカラフルに美しく見せるということと同義ではないのです。
5.その商品(ブランド)の世界観を崩さないこと
あくまでもネットショップの主役は商品です。
ロゴ、レイアウト、配色などにこだわるあまり商品やあなたのブランドがもつ世界観を壊してしまわないように注意しましょう。
衝動買いに効果をもたらす色はオレンジと黒、購入率の高さと相関関係があるのはブルーやグリーン、信頼感を持たせるにはブルーなど、色には少なからず人の行動と相関関係がありますが、まずは自身のブランドの世界観を最もよりよく見せる色合いを中心に考えてみましょう。
6.キャッチコピーの魅せ方
デザインする際には商品、写真、キャッチコピーなどの構成を考える必要がありますが、ネットショップにおいてはキャッチコピーがとても重要な要素です。
「○○大学の○○教授が監修」、「今話題の大人気商品!」、「在庫わずか!ご注文はお早めに」などのキャッチコピーは誰しもがみたことがあるかと思いますが、そのような文言は購入率を高めるために強い力を発揮します。
お客様に納得感をもってお買い物をしてもらうためにも、キャッチコピーを適切に活用していきましょう。
一方、キャッチコピーばかり羅列すると安っぽい印象になってしまいますので注意が必要です。
7.ファーストビューを意識しよう
ネットショップの顔となるTOPページファーストビューには徹底的にこだわりましょう。
パソコン、スマホの両方で伝えるべき情報をお客様が、ネットショップに訪れた時に伝えることができているかしっかり確認を行なうことが大切です。
ロゴ、店舗名、メイン画像、キャンペーン情報などあなたのショップのベネフィットを伝えられるキャッチコピーはファーストビューに盛り込むべき情報です。
様々な組み合わせを試していきながら、購入率を上げていくための要素を見つけましょう。
8.回遊性をあげる工夫をしよう
お客様の回遊率を上げるのに最も有効な方法が商品説明ページの下部に関連商品やオススメ商品のリンクバナーの設置です。
TOPページに比べて、商品詳細ページがお客様の入り口になると直帰率が高くなる傾向があるため、そのような工夫をして他の商品を見てもらう導線を設けることが大切です。
「人気のカテゴリ」、「この商品を買った人はこちらも買っています」、「合わせて買うべき商品」など、様々な切り口がありますので、回遊させるのに効果的な訴求方法を見つけましょう。
9.人の気配を出して信頼感を掴もう
冒頭にも伝えた通り、よりよくデザインされたネットショップとは単に見た目が整えられたサイトではありません。
お客様が安心して楽しくお買い物ができるショップこそ、よりよいデザインといえます。
その観点から考えるとそのショップに人の気配を出す演出は信頼感を掴むための効果的なデザインと言えるでしょう。
セールやキャンペーンの告知、新商品の追加、またはイベントへの出展やブログの運用など、中の人の顔を出すのも効果的ですが、それほかにも様々な方法で人の気配を生み出すことができます。
また、お問い合わせの電話番号を載せるのも信頼を得るのに効果的です。
10.モバイルファーストで考えよう
今やパソコンよりもスマホを持っている人のほうが多い時代、パソコンに最適化したショップデザインでは多くのスマホユーザーを取りこぼしてしまいます。
特にアパレル系のネットショップではモバイル比率が伸びており、8割を超える企業も出てきていると言います。
参考
https://ferret-plus.com/1724
今後、ショップのデザインを考える際には、スマホでの購入体験に最適化した構成を考えるべきでしょう。
スマホに最適化したデザインこそが、今後ネットショップで成功をしていくための重要なポイントです。
まとめ
以上、デザインというものをお客様に安心して楽しく買い物をしてもらうための方法と定義した上で、対応すべきネットショップのポイントをご紹介しました。
ターゲットとなるお客様とネットショップのコンセプトを前提としながら、どのようなデザインがお客様の購入体験を最大化させるのかを考えていくことが大切です。
見た目だけを考えるのではなく、「なぜ」そのようなデザインになっているのか説明ができる状態まで、それぞれの要素についてこだわりもつことこそ、本当のデザインといえるでしょう。
一方的に伝えたい情報ばかりにこだわるのではなく、ぜひお客様の目線に立ち改めてデザインについて考えていきましょう。
このニュースを読んだあなたにおすすめ
リピート顧客を生む!ネットショップでお客様にもう一度来てもらうための、明日から行うべき7つの施策
あなたはどう活用する?Instagram(インスタグラム)を活用した5つの国内キャンペーン事例とその特徴
価格競争を回避する!ネットショップの成功に必須な「コンセプト」の作り方3つのステップ
Web戦略に関するカリキュラム
Web戦略に関するカリキュラムを体系立てて学びましょう。
- レイアウト
- レイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。
- レイアウト
- レイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。
- バナー
- バナーとは、ホームページ上で他のホームページを紹介する役割を持つ画像ファイルです。画像にリンクを貼り、クリックするとジャンプできるような仕組みになっています。画像サイズの規定はありませんが、88×31ピクセルや234×60ピクセルが一般的です。また、静止画像だけでなく、アニメーションを用いたバナーもあります。
- 広告
- 広告とは販売のための告知活動を指します。ただし、広告を掲載するための媒体、メッセージがあること、広告を出している広告主が明示されているなどの3要素を含む場合を指すことが多いようです。
- バナー
- バナーとは、ホームページ上で他のホームページを紹介する役割を持つ画像ファイルです。画像にリンクを貼り、クリックするとジャンプできるような仕組みになっています。画像サイズの規定はありませんが、88×31ピクセルや234×60ピクセルが一般的です。また、静止画像だけでなく、アニメーションを用いたバナーもあります。
- バナー
- バナーとは、ホームページ上で他のホームページを紹介する役割を持つ画像ファイルです。画像にリンクを貼り、クリックするとジャンプできるような仕組みになっています。画像サイズの規定はありませんが、88×31ピクセルや234×60ピクセルが一般的です。また、静止画像だけでなく、アニメーションを用いたバナーもあります。
- レイアウト
- レイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。
- キャッチコピー
- キャッチコピーとは、商品などの宣伝の際に使用される文章のことです。 宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。 キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。
- キャッチコピー
- キャッチコピーとは、商品などの宣伝の際に使用される文章のことです。 宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。 キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。
- キャッチコピー
- キャッチコピーとは、商品などの宣伝の際に使用される文章のことです。 宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。 キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。
- キャッチコピー
- キャッチコピーとは、商品などの宣伝の際に使用される文章のことです。 宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。 キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- ファーストビュー
- ファーストビューとは、ユーザーがホームページを訪問した際、スクロールせずに表示される範囲のことです。ディスプレイのサイズや解像度によって、ファーストビューは異なります。
- キャンペーン
- キャンペーンとは、インターネット上のサイトにおいて、ファン数を増やし、購買行動を促すためにおこなう懸賞キャンペーンなどのマーケティング活動のことです。キャンペーンにはファン数を増やすだけでなく、ファン獲得以上のリアル店舗の来店者数を増やす、資料請求者を増やす、実際の購買を増やすなどの目的があります。
- ベネフィット
- ベネフィットとは、「利益」「恩恵」「便益」などの意味で、マーケティングにおいては、「顧客が商品から得られる良い効果」のことをいいます。 人は、商品やサービスを購入する際、商品そのものではなく「その商品を使用することによってもたらされるもの」を購入しています。例えば、ドリルを購入する人は、ドリル本体ではなく、そのドリルで開けられる穴を購入しているといえます。
- キャッチコピー
- キャッチコピーとは、商品などの宣伝の際に使用される文章のことです。 宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。 キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。
- ファーストビュー
- ファーストビューとは、ユーザーがホームページを訪問した際、スクロールせずに表示される範囲のことです。ディスプレイのサイズや解像度によって、ファーストビューは異なります。
- 回遊率
- 回遊率とは、1人のユーザーがホームページ内のページをどれだけ閲覧したのかを表す指標です。回遊率は、1訪問あたりのページビュー数(1訪問/PV)で表します。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- リンク
- リンクとは、インターネット上では、あるページの中に記された、他のページの所在を表す情報のことを「ハイパーリンク」と呼び、これを略した言葉です。リンクのある場所をクリックすると、他のページにジャンプするようになっています。
- バナー
- バナーとは、ホームページ上で他のホームページを紹介する役割を持つ画像ファイルです。画像にリンクを貼り、クリックするとジャンプできるような仕組みになっています。画像サイズの規定はありませんが、88×31ピクセルや234×60ピクセルが一般的です。また、静止画像だけでなく、アニメーションを用いたバナーもあります。
- ページ
- 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。
- 導線
- 導線とは、買い物客が店内を見てまわる道順のことです。ホームページにおいては、ページ内での利用者の動きを指します。 ホームページの制作にあたっては、人間行動科学や心理学の視点を取り入れ、顧客のページ内での動きを把握した上でサイト設計を行い、レイアウトや演出等を決めることが重要になります。
- キャンペーン
- キャンペーンとは、インターネット上のサイトにおいて、ファン数を増やし、購買行動を促すためにおこなう懸賞キャンペーンなどのマーケティング活動のことです。キャンペーンにはファン数を増やすだけでなく、ファン獲得以上のリアル店舗の来店者数を増やす、資料請求者を増やす、実際の購買を増やすなどの目的があります。
- ブログ
- ブログとは、ホームページの一種です。運営者はブログシステムに登録し、利用開始をすることで、ホームページ制作のプログラム技術を修得する必要なく、本文のみを投稿しつづければ、公開・表示はおろかページの整理や分類なども効率的に行えるシステムを言います。
- スマホユーザー
- スマートフォンを保有、利用している人をスマホユーザーと呼びます。 スマホユーザーは年々増加傾向にあります。IT専門調査会社 IDC Japan 株式会社の発表によると、2014年のスマホ加入者数は6,277万人、2017年のスマホ加入者数は7,401万人と予測しています。(2013年10月発表)
- コンセプト
- コンセプトとは、作品やサービスなどに一貫して貫かれている考え方をいいます。デザインと機能がバラバラだったり、使い勝手がちぐはぐだったりすると「コンセプトが一貫してないね」などと酷評されてしまいます。
おすすめ記事
関連ツール・サービス
おすすめエントリー
同じカテゴリから記事を探す
カテゴリから記事をさがす
●Webマーケティング手法
- SEO(検索エンジン最適化)
- Web広告・広告効果測定
- SNSマーケティング
- 動画マーケティング
- メールマーケティング
- コンテンツマーケティング
- BtoBマーケティング
- リサーチ・市場調査
- 広報・PR
- アフィリエイト広告・ASP
●ステップ
●ツール・素材
- CMS・サイト制作
- フォーム作成
- LP制作・LPO
- ABテスト・EFO・CRO
- Web接客・チャットボット
- 動画・映像制作
- アクセス解析
- マーケティングオートメーション(MA)
- メールマーケティング
- データ分析・BI
- CRM(顧客管理)
- SFA(商談管理)
- Web会議
- 営業支援
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング
- フォント
- 素材サイト
●目的・施策
- Google広告
- Facebook広告
- Twitter広告
- Instagram広告
- LINE運用
- LINE広告
- YouTube運用
- YouTube広告
- TikTok広告
- テレビCM
- サイト制作・サイトリニューアル
- LP制作・LPO
- UI
- UX
- オウンドメディア運営
- 記事制作・ライティング
- コピーライティング
- ホワイトペーパー制作
- デザイン
- セミナー・展示会
- 動画・映像制作
- データ分析・BI
- EC・通販・ネットショップ
- 口コミ分析・ソーシャルリスニング