見えてきたECサイトの人気レイアウト

ECサイトのレイアウトは、ユーザーに情報を的確に届ける上で重要な役割を果たす。サポタントの調査結果から、ECサイトでトレンドになっている検索窓の設置場所やサイト幅のピクセル数が分かった。

» 2010年08月03日 18時51分 公開
[藤村能光,ITmedia]

 Web・モバイル業界の人材事業を手掛けるサポタントは7月30日、EC(電子商取引)サイトのレイアウトのトレンドに関する調査結果を発表した。楽天市場(100サイト)、Yahoo!ショッピング(50サイト)に出展しているECサイトおよび企業が独自に運営するECサイト(100サイト)を7月に調査した。

70%がページ上部に「検索窓」を設置

 Webページの上部に検索窓を設置しているECサイトは全体の70%だった。増加する商品点数に対し、検索性を向上させる目的で検索窓を設置するECサイトが増えているという。

ページ上部に「検索窓」を設置しているサイト ページ上部に「検索窓」を設置しているサイト(出典:サポタント)

900ピクセル以上のサイト幅が主流

 サイト幅が900ピクセル以上のECサイトは全体の58%だった。900ピクセル以下にサイト幅を設定している企業は42%だった。サポタントは「2008年にYahoo!や楽天市場が950ピクセル幅にデザインを変更したことで、出店サイトも幅を広げている」と考察している。

サイト幅 サイト幅(出典:サポタント)
全体 楽天市場 Yahooショッピング 自社ECサイト
950ピクセル(15%) 800ピクセル(13%) 800ピクセル(10%) 950ピクセル(22%)
900ピクセル(10%) 900ピクセル(12%) 850ピクセル(10%) 960ピクセル(12%)
800ピクセル(10%) 950ピクセル(11%) 950ピクセル(10%) 900ピクセル (8%)

 全体では950ピクセル(15%)、900ピクセル(10%)など、900ピクセル以上のサイト幅を設定するECサイトが増えている。一方で、楽天市場に出店しているECサイトの13%が800ピクセル、Yahoo!ショッピングのECサイトの10%が800および850ピクセルだった。

フォントの大きさは12ピクセルが43%

 ECサイト全体では12ピクセルが43%でトップを占めた。楽天市場のECサイトでは12ピクセル以上(54%)、Yahoo!ショッピングでは12ピクセル未満(64%)、自社ECサイトでは12ピクセル(60%)が多く、各ECサイトによって採用するフォントの大きさは異なっている。

フォントの大きさ フォントの大きさ(出典:サポタント)

ヘッダの高さは200ピクセル以内に

 全体では150ピクセル未満が47%、150〜200ピクセルが33%だった。楽天市場、Yahoo!ショッピング、自社ECサイトのいずれにおいても、200ピクセル以内という回答が6割を超えている。サポタントは「より多くの情報を初見で伝えるために、ヘッダの高さはできるだけ抑えているサイトが多い」とコメントしている。

ヘッダの高さ ヘッダの高さ(出典:サポタント)

トップページは2カラムが主流

 全体では2カラムが55%、3カラムが42%となった。楽天市場、Yahoo!ショッピング、自社ECサイトのいずれにおいても、2カラムの採用が50%を超えている。

トップページのカラム数 トップページのカラム数(出典:サポタント)

 同調査では、「セール/特集/キャンペーン情報」「お勧め/ピックアップ商品」「会社概要/企業情報」「メールマガジン」「お問い合わせ」「QA/ヘルプ」「送料設定」の結果も公表している

関連ホワイトペーパー

eコマース | 検索 | Yahoo!(ヤフー)




Copyright © ITmedia, Inc. All Rights Reserved.