![APPAREY[アパレイ]](https://apparey.jp/wp-content/uploads/2018/04/logo.png){kind=logo}
Web技術は日々進化をしており、ブラウザ上で表現できる技術も広がりつつあります。また、アパレル業界と同様に、WEBデザインにもトレンドとなるデザインが存在するため、常にトレンドを追い求めてサイト作りをするというのは大変なことでしょう。日々進化し続けるWebデザインでできることが増えている一方で、ECサイトを作成するにあたって取り入れてはいけないデザインやテクニックをご紹介します。また、売れているECサイトにおけるデザインの特徴についても見ていきましょう。
現在のWeb技術でできること
魅力あるECサイトの作成には、なによりも見やすくわかりやすいデザインであることが大切であり、待たずにサイトを表示させるスピードがなくてはいけません。そのためにも、サイトのデザインもシンプルであることが、売れるECサイト作りの必須条件です。そこで、2019年現在の売れるECサイトを作っているWebデザインのトレンドをご紹介します。
・フラットデザイン2.0
フラットデザインとは、もともと立体感のない平面でシンプルなデザインのことをいいます。例を挙げると、一番わかりやすいのがiPhoneのホーム画面です。そしてフラットデザイン2.0とは、フラットデザインのシンプルで平面的なデザインの良さを残しつつ、ドロップシャドウやグラデーションの要素を導入し、奥行きや立体感を取り入れて、より見やすくわかりやすいように進化させたデザインです。
・モバイルファーストデザイン
モバイルファーストデザインは、スマートフォンなどのモバイルの小さな画面でもわかりやすく、操作しやすいようにしたデザインのことです。現代では、スマートフォンを使用する割合がPCよりも増えているため、トレンドのひとつとして話題になっています。
取り入れるべきではないデザインやテクニックは？
ECサイトでは、人の目を奪うような奇抜なアイデアや、見た目のインパクトを売りにすれば、目立って集客できると思いますよね。だからといって、Webデザインのすべてを取り入れていいというわけではありません。ECサイトに取り入れるべきではないデザインやテクニックをご紹介します。
・スクロールハイジャック
アニメーションなどの表示により、ページを自動的にスクロールするWebサイトのことです。しかし、ユーザーにとっては、スクロールバーがあるにも関わらず、スクロールバーが使えない状況はストレスとなります。商品購入を目的としているユーザー向けのECサイトにはかえって逆効果となるでしょう。
・Webフォント
Webフォントはデザインのアクセントとして使えば、サイトに個性が生まれるのでいいと思うかもしれません。しかし、フォントの使い過ぎはサイトの統一感を失ってしまうため、同一サイト上では、いろいろなフォントを濫用しないように注意しましょう。また、漢字を多く含む日本語のフォントを何種類も使用すると、サイトの読み込みが遅くなってしまいます。
・ポップアップ
サイト閲覧中に唐突に現れ、ユーザーの注意をそいでしまうポップアップ表示。ポップアップは注意を引くには効果はある一方で、目障りだと捉える人も多く、サイトから離脱してしまう可能性もあります。ポップアップ表示を使用する際は、タイミングが重要です。
レスポンシブがECサイトに適していない理由とは？
レスポンシブとは、PCやスマホ、タブレットの画面のサイズに合わせて自動的にデザインの切り替えができる設定のことです。一見、便利な設定に思えますが、実はレスポンシブはECサイトには適していないと言われています。
ECサイトは、基本的にPCサイトをベースにしたデザインで作られますが、PCのコンテンツの階層をそのままモバイル対応のデザインに変えてしまうと、階層が深くなりやすくなりがちです。そのような状況になると、スマホでのタップ数が増えてしまうため、離脱率が高くなってしまいます。
また、PCサイトはSEO重視の観点からある程度のテキスト量が必要になるのですが、スマホサイトでは直感的に見せたいことが多いので、ボリュームのあるテキスト量は邪魔になるケースが多いのです。スマホを意識するのであれば、最小限のテキスト量にとどめ、画像などを活用したほうが効果はあるでしょう。
つまり、PCとスマホではそもそも画面のサイズが違うので、レスポンシブデザインで画面を共通にするということは難しいということになります。
売れているサイトのデザインは意外とシンプル！
売れているECサイトはどのようなものなのか、ECサイト作りに困ったときは、売れているサイトを参考にしてみるといいでしょう。
・ユニクロ
ユニクロのオンラインショップは、サイト自体が白を基調にした作りになっているので、シンプルで視覚的にもユーザーにわかりやすいでしょう。また、値下げされている商品の価格は、赤色表示となっているので、目につきやすいのも特徴です。
・IDEE
ロンドンからの輸入した家具や照明、雑貨などを取り扱うオンラインショップです。サイトのテキスト量は商品名と価格の最低限にまとめられ、商品の写真を全面に出した作りとなっています。また、商品を実際に部屋に置いたときをイメージした写真も掲載されているので、購入時のイメージがつきやすいのが特徴です。
・tokyobike
とにかく見やすさ、シンプルさにこだわった作りなのが、tokyobikeのサイトです。メニューにフォーカスすると、英語表記から日本語表記へと変わるシステムを導入しています。おしゃれなデザインでありながら、シンプルな作りはユーザーが知りたい情報を的確に提示してくれるでしょう。
まとめ
ECサイトをデザインすることから始めるのであれば、ユーザーにとって見やすくわかりやすいわサイトにした上で、買い物ができるようにしなくてはいけません。ユーザーは表示に関する待ち時間を非常に嫌う傾向にあります。そのため、技術の粋は画面表示などのスピードアップに努めるべきであり、なおかつ、シンプルで見やすいデザインにすることが大切です。写真など必要な情報の表示がスピーディーで、ユーザーが商品を使っている場面を具体的に楽しくイメージできるようなサイトであれば、途中の離脱を防ぎ、購入率のアップにつながっていくのではないでしょうか。
