ECサイトの顔とも言えるファーストビューは、高さをはじめとするサイズ、色、構成など、複雑な要素で構成されています。しかし一方で、サイト来訪者が判断するのは一瞬です。滞在するか離脱するかは、そのECサイトのファーストビューの差にかかっていると言っても、過言ではありません。
ピックアップした８選は、筆者が国内・海外ECサイトをチェックする中で、特にファーストビューが秀逸だと感じたECサイトです。（2015年５月時点）どれもぱっと見の印象だけではなく機能性も高いものばかりです。
Contents
国内ECサイト
1. Ropé Picnic ロペピクニック
▼参考になるポイント
ブランドイメージに添った配色
遊び心満載のアニメーション
まずはロペピクニックさん。ファーストビューは、白と黄色を貴重とした元気ハツラツで可愛い印象です。一番良いと思った部分は、スクロールしてすぐに出てくる、モデルさんのアニメーション。
遊び心満載のアニメーションが、顧客の心を掴んでいます。見ているだけで楽しいので、おそらくサイトの回遊率は高いのでは？マウスオーバーすると画像が動いたりと、様々な仕掛けがあるので、いろいろと試してみると面白い発見があります。
2. girrafe
▼参考になるポイント
グレーベースの落ち着いた配色
白い背景を上手に使った商品画像配置
つづいて、お洒落なネクタイやネクタイピンで有名なgirrafeさん。
ファーストビューに限らず、サイト全体に余計な色を使わないことで、グレー基調で落ち着いた印象に仕上げています。ヘッダー部分の赤青白の印象的なラインが、GOOD。ブランドイメージに沿うようなシンプル&ハイセンスなデザインが素敵です。
白い背景を上手に使っているので、商品がすっと目に入ってくるといった点で購入率にも好影響を与えています。
3. Oh My Glasses
▼参考になるポイント
ファーストビュー下部に、顧客からのレビューを表示
そして次は、眼鏡のオンラインショップという画期的なECを展開している、Oh My Glassesさん。
一見、よくあるサイトの構成ですが細かな工夫がされています。注目すべきは、目に付くセンターに顧客からのレビューを表示させている点。（ファーストビューには入りませんが、スクロールすると目に入ります。）
眼鏡をオンラインで購入することは、ECに慣れていない消費者心理としては（ほんとうに大丈夫？）と不安に思うもの。その不安に対して、商品数よりもレビュー表示を優先することで、安心感を訴求しています。
これはオンラインで買うことをイメージしにくい商品を売る場合、特に参考になりますね。
4. FRED PERRY
▼参考になるポイント
大胆にスライドするファーストビュー
つづいてご紹介するのは、ファッションブランドの老舗、FRED PERRYさん。
このサイトは、何と言っても大胆に左右にスライドするファーストビューが特徴です。一般的にECサイトの直帰率は40〜50%程度と言われています。そしてその直帰率を下げる肝となるのが、ファーストビューなのです。
もしTOPページの直帰率が高くて悩んでいるようでしたら、FRED PERRYさんを参考に大胆なマイナーチェンジを計ることをオススメします。すぐに効果が出ないとしても、ABテストを続けることで必ず効果改善が見込めます。
5. HIGASHIYA
▼参考になるポイント
顧客のユーザービリティを考えたカテゴリ表示
国内ECサイトの最後を飾るのは、HIGASHIYAさん。趣向を凝らした上品な和菓子が、男女問わず絶大なる人気を誇っています。
ECサイトは、その上品なテイストがサイト全体から伝わってくる好印象なデザイン。そして何より上部の可愛らしいカテゴリ表示にご注目。サイト内にどんな商品があるのかが、一目瞭然です。
今のECサイトは、ファーストビューに大きな写真を持ってくるデザインが主流です。ただ、HIGASHIYAさんのように、顧客のことを考えたカテゴリ表示は、非常に親切心を感じます。おそらくご年配の方も和菓子を購入するため、こうした細かい工夫を凝らすことでわかりやすさを心がけているのでしょう。
海外ECサイト
ここまで国内サイトをご紹介してきましたが、ここからは3つほど海外ECサイトもご紹介します。
6. Nice Laundry
参考になるポイント
ユーモアを含んだファーストビュー
まずは靴下のECサイト、Nice Laundryです。
ちょっと日常を彩るようなECに、私は個人的にぐっときます。ファーストビューは大きな写真で、脚がお目見えしていますが、本当に見て欲しいのはジーンズでも靴でもなく、靴下。すごく積極的に主張しているようで、控えめなようで…笑 見方によってですが、ちょっとしたユーモアを感じます。
気づいた方がいるかもしれませんが、しばらくサイトに滞在するとニュースレターの申込ポップアップが表示されますね。こうした施策があまり煩わしく感じないのは、デザイン性の高さがフォローしているからです。改めて、デザインの大切さに気づきます。
7. Club W
参考になるポイント
情報を凝縮した動画のファーストビュー
つづいてご紹介するのはワインのECサイト、Club Wです。
キャプチャでは分かりませんが、ファーストビューで大胆に動画を使用しています。静止画では伝わらない情報も、動画にすることで一瞬に凝縮して伝えることができます。Club Wの場合は、ブドウの生産地から製造工程、そして消費者の元に届くまでが短時間で伝わる動画になっています。
数ある選択肢の中で、動画のファーストビューはちゃ、秀逸な手法です。
8. MixedMade
参考になるポイント
提案するファーストビューのスライド画像
最後にご紹介するECサイトは、商品が非常にユニークです。なんと売っているのはなんと、ハチミツなんです。しかも、甘いハチミツではなく"辛い"ハチミツ。（商品については、こちらに詳しい。ここではECサイトのデザインに注目します。）
実際にファーストビューのスライドで流れる画像を見てください。ハチミツをチキンに垂らしてみたり、ウィスキーと並べてみたり…。ハチミツという誰でも知っている商品のイメージを再定義するために、様々な利用シーンを提案する内容になっています。
Oh My Glassesさんの事例では"顧客のレビュー"を取り上げましたが、このようにファーストビューで顧客に使用イメージの訴求を行うのは、参考になる事例の一つです。
まとめ
ご覧の通り、ECサイトはファーストビュー1つでブランドや商品の印象を決めます。どのサイトもデザイン性の高さはもちろんのこと、サイズや構成にも工夫が見られました。
皆様のECサイトも、ほんの少しの工夫で差がつき、商品の購入率が変わります。ぜひ、今回ご紹介したサイトを参考に、ファーストビューをはじめ、デザインをいろいろと検討してみてください。
ご一読、ありがとうございました。
CONTACT
コンテンツ制作やSNS運用代行、miteco広告掲載のお問い合わせは以下のコンタクトよりご連絡ください。
また、ライター・編集者の採用募集等も以下フォームからお問い合わせいただけます。