㉖ページのデザイン・レイアウトはわかりやすさを重視しよう | マンガで納得! インターネット販売 売れるネットショップ開業・運営 | ネットショップ担当者フォーラム | ネットショップ担当者フォーラム

ネットショップ担当者フォーラム - 2014年11月5日(水) 07:00
このページは、外部サイト ネットショップ担当者フォーラム の情報をRSSフィード経由で取得して表示しているため、記事の一部分しか表示されていなかったり、画像などが正しく表示されなかったり、オリジナル記事が意図したデザインと異なっていたりする場合があります。
完全な状態のオリジナル記事は 「㉖ページのデザイン・レイアウトはわかりやすさを重視しよう | マンガで納得! インターネット販売 売れるネットショップ開業・運営 | ネットショップ担当者フォーラム」 からご覧ください。
コツ26:ページのデザイン・レイアウトはわかりやすさを重視しよう

登場キャラクター

さいとうさん

さいとうさん お味噌専門の通販サイトを運営している。

ゆめのさん

ゆめのさん WEB制作会社のスタッフ。

さいとうさん「レイアウトとか見たことないくらい変わったやつにしたいなぁ」
ゆめのさん「ちょ、ちょっと待ってください。人気店を参考にしながらお話ししましょう!! 例えばこのサイト、意外とフツーじゃん!とお思いになるかもしれませんが、情報がきちんと整理されててユーザーからすると使いやすくていいサイトなんですよ」
さいとうさん「確かにユーザー視点は大切だね。かっこつけてMISOとかって表示しようかと思っていたけど、読みにくいだろうからやめておこう。このレイアウトデザインの候補もやめます」
ゆめのさん「すごいセンスだな……」
トップページは「玄関」ではない

「ネットショップを作る」というと、まずトップページを凝った作りにしたいという人も多く、デザインを外注しても、トップページに気合の入った提案をされることも少なくありません。しかし、ネットショップでは、トップページ以外から来店するケースの方が多いです。実店舗に例えると、「正面入口以外に、たくさんの入口がある店」。接客のために正面ばかりを掃除していたら、実際はほとんどの来店客は通用口を使っており、そこはゴミ捨て場状態だった……という事態がよく起こっています。

特にショッピングモールでは、検索やメルマガ、広告を経由して、ユーザーはいきなり商品ページに入ってきます。購入するかどうかも、その商品ページ内の情報だけで決めてしまうので、「トップページをまったく見ないまま購入完了」するケースも珍しくありません。

だからトップページを「わざわざ」見にくる場合は、何か別の理由があってのこと。ここでは、ユーザーの行動を踏まえて、トップページに求められる「3つの役割」を紹介します。

ほかにどんな商品があるか把握するため
ユーザーは、目当ての商品を買い物かごに入れ、「ついで買いできる商品を探す」場合にトップページに来る。だから、店舗の「目次」としての機能を持たせ、「もう1品」を探しやすい構成にしたい。
まともな店かどうか確認するため
商品ページだけでは安心感を得られず、トップページを見に来るユーザーもいる。店舗紹介ページ(コツ23)の内容を抜粋し、トップページに転載するといいだろう。マスコミ掲載やランキング入賞実績も、安心感の演出に有効。
SEOで重要な「店舗内リンク」のリンク元として
店舗内の各ページでリンクを張り合うのは、SEOの定番手法。特にトップページから各ページへのリンクは、非常に重要。詳しくはコツ27を参照。
トップページに求められる役割
レイアウトは「普通」が一番

思い入れのある自分のネットショップだから、独創的なレイアウトを追求したくなるかもしれません。でも、ユーザーにとっては、一番慣れている「定番」なレイアウトが一番使い勝手がいいものです。変にひねらずに、業界内の主要店舗などを見て「周りに合わせる」くらいの気持ちでデザインに臨みましょう。

よく言われている通り、Flashを使った複雑な演出などは、ナビゲーションなどがわかりにくくなることが多いので、ショップ運営に慣れるまでは控えた方が賢明です。

見栄えのいいページにしようとしてレイアウトに悩む人も多いですが、写真を使えば簡単です。サイズの大きい「アップの商品写真」をトップページの中心や商品ページの上部などに置くだけでイメージが変わります。

さいとうさん「レイアウトとか見たことないくらい変わったやつにしたいなぁ」
お客さんがどこをクリックしていいかわからないようなデザインになってしまっては本末転倒だ。
ナビゲーションは日本語表記が基本

バナーやボタン、リンクのテキストは、日本語表記が基本です。「店舗紹介」や「こんなお店です」と書くべきところを「information」「about us」などと書いてしまうと、来店客は何のことか気付かずに素通りしてしまいます。おしゃれにしたくてついつい英字にしてしまう気持ちはわかりますが、何のためにナビゲーションがあるのか、を先に考えれば、どっちがいいかはおのずとわかるはずです。

海外のブランド名など、どうしても日本語にできない場合も、カタカナにするか、アルファベットとカタカナを併記するようにしましょう。複雑な英単語は視認性が低い(ぱっと見てすぐわからない)ものです。一方、漢字の羅列も同じようにわかりにくいもの。ひらがなを混ぜるなど、わかりやすさを心がけましょう。

さいとうさん「レイアウトとか見たことないくらい変わったやつにしたいなぁ」
お客さんがどこをクリックしていいかわからないようなデザインになってしまっては本末転倒だ。

 

看板画像 ・キャッチフレーズを載せる(コツ24参照) ・商品に関連する写真やイラストを載せることで直感的に何を売っているかわかりやすい 上部ナビゲーション ・基本情報 注文方法、決済/配送、買い物かご、よくあるお問い合わせ、店舗紹介(コツ23参照) ・主要カテゴリ 来店客の属性(メンズ、レディース、キッズ)で分けるなど大きな分類 ・おすすめの商品や特集ページ ページ左のナビゲーション(レフトナビ) ・検索ボックス ・ユーザーの「購入動機別」のリンク(コツ27参照) ・細かい商品カテゴリ ・商品が少ない店ならなくても可 ページ下部(フッター) ・決済配送と店舗情報の要約 エンタメゴルフショップ ENJOYGOLF http://www.rakuten.co.jp/henkaq/
基本的なページレイアウト

※このコンテンツはWebサイト「ネットショップ担当者フォーラム」で公開されている記事のフィードに含まれているものです。
オリジナル記事:㉖ページのデザイン・レイアウトはわかりやすさを重視しよう | マンガで納得! インターネット販売 売れるネットショップ開業・運営 | ネットショップ担当者フォーラム
Copyright (C) IMPRESS CORPORATION, an Impress Group company. All rights reserved.

マンガで納得! インターネット販売 売れるネットショップ開業・運営
記事カテゴリー: 
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

今日の用語

ワイヤーサービス
プレスリリースを、メディアに配信し、さらにサービス事業者のWebサイトや提携メデ ...→用語集へ

インフォメーション

RSSフィード


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