横好きサイト分析 ーAmazonー
はじめに
前回の記事で、フロントエンドっぽいことを書くということだったので書いてみる。
で、今回はWebサイト、特にEコマースサイトの分析をしてみようと思う。技術関連のことでなく若干デザイン寄りの面の話になる。
これをいくつか続けていって、色んなサイトの特徴が比較できればいいと思う。
とりあえずAmazonから
というわけで最初にECの大御所、AmazonのTOPページを見てみる。
最近はモバイルファーストなのでスマートフォン版を見ていくべきかもだが、今回はあえてPC版を先に見る。
色
ヘッダーが濃い青、背景が薄い灰色になっており全体的に暗めの印象。ただアクセントカラーとして黄色が使わており、その箇所が目立つようになっている（サインインボタンや検索ボタン）。
また、商品を表示する部分は「黒文字の題字に白背景、青いリンク」と非常にシンプルな構成になっている。これはおそらくだが、商品の写真を目立たせるためにあえて他の部分をシンプルにしているのだと思われる。そうやって見ると、サイトのアクセントカラーである黄色は商品部分には使用されていないことがわかる。徹底的に商品を目立たせるようにしているのだろう。
ページ構成
大きく分けて、ヘッダー・コンテンツ・フッターに分けられる。非常にシンプルな作りだ。
まずはヘッダーを見ていこう。ヘッダーの中もいくつかの箇所に分けられるだろう。個人的には大きく左、中央、右の3つに分けたいと思う。
・左
ここはロゴと、メニューが格納されているハンバーガーメニューが設置されている。よくある構造と言えるだろう。
個人的に注目したいのはその下に設置されている「お届け先」である。一見するとなぜこの位置なのかよくわからない。まぁ真意はAmazonのWebサイト担当に聞くしかないのだが、推測するに一番目に入るであろうページ左上にログイン情報と届け先の住所をのせる事によって、ユーザーに「今どのアカウントでログインしているのか」「注文したときの宛先はどこになるか」というのを一番最初に提示することで、ユーザーの購入への心理的ハードルを下げているのだろうと思われる。ユーザーは基本的にものを買おうとしてこのサイトに訪れるはずなので、それに最も関連するだろう情報を一番目につくところに出しているのだ。さすがAmazonである。
続きはまた明日。
書いていると、全然終わらんなこれ…。
ものすごい中途半端だが、今日は一旦ここまでとする。次回はヘッダーの中央から再開する。
今日の一言
冷房がガンガンにかかる仕事場、最高。
