WEB制作
絶対に使いたい!ECサイト向け!高品質アイコンセット7選!
こんにちは!集中すると気付いたら飲まず食わずになってのどがカラッカラになっているみっしぇるです。
ECサイトを運営していると、常に更新作業やサイト改善がつきもので、デザインをより良いものに使用と試行錯誤を重ねます。
その際に素材にお世話になることがよくあると思います。イラストや写真、背景画像、アイコンなど。
サイトの顔にもなるようなデザインは、使用する素材によって印象がガラリと変わったりするのでとても重要な部分です。
今回は、印象にも影響するECサイト向けの高品質アイコンセットを7選ご紹介します!
ちっこいアイコンで?
と思うかもしれませんが、ふとした時に目に付くアイコンが高品質でサイトイメージとマッチしていると、印象が自然と良くなるものですよ!
使用例としては、カートを見るやカートに入れるボタン・クレジットカード表記・商品写真を拡大する際の虫眼鏡など…。
他にもたくさん使用できる箇所はあります!
文字だけよりもアイコンがそえてあるだけでも親しみやすく感じることもあるかもしれませんね!
ではその高品質の7つのアイコンセットをさっそく見ていきましょう。
36 Free Shopping icons
36 Free Shopping Icons
カラフルに見せているのでPOPに感じますが、使い方によってはシンプルなサイトでも全然使えます!
シルエット調のアイコンは万能じゃないかなと個人的には思います。
ただかわいらしさも感じるので、エレガント系のサイトだったら不向きかもしれませんね。
70 Ecommerce and Shopping Icons
70 Ecommerce and Shopping Icons
こちらもシルエット調になっていて、なんと70種類のアイコンがセットになっていてもちろん無料です!
クレジットカードアイコンも入っているので便利ですね!画像のように色付けてカラフルにしてみるのもいいかも。
Free 45 E-Commerce...
WEB制作
新米デザイナー必見!集客率を上げるWebデザインのポイントまとめ!
こんにちは、風邪をひいたと思っても熱を計ったら負けだと思っている相馬です。
Webサイトをオープンするに当たっては、様々な目的があると思います。
お問い合わせを増やしたい、商品の売上を伸ばしたい、新規顧客を増やしたい、ブランドを認知させたい・・・。
Webサイトで何をしたいかを明確にして、その目的達成のためにどうすれば良いかを考えるのが、Webデザインと言う仕事です。
今回は、集客率をアップさせるために意識するべき、Webデザインのポイントをまとめました。
上で挙げたような様々な目的に繋げるためには、キッチリを理解しておきたい基本的なことばかりです。
特にWebデザイナーの方は、改めて初心に返って、これらのポイントを忘れないようにしましょう。
Webデザインで集客率は変わる?
その前に、Webデザインが何故集客率に影響があるかを理解しておきましょう。
ひとつ目は競合との差別化。
何にでも言えることですが、差別化にあたって見た目はとても大切。
美しいデザインやクリエイティブなデザインは、人の目を惹きつけます。
そしてもうひとつは使いやすさ。
人は"使いやすいもの"を選びます。Webデザインはサイトの使いやすさに大きな影響を与えます。
この2つは、人を集める要素となり、人の心を捉えて離さない要素でもあります。
それでは、集客のできるデザインのためのポイントを見ていきましょう。
集客率のアップのためにおさえておくべきWebデザインのポイント
魅力的な写真を使用する
人に情報を伝えるために一番手っ取り早い表現は「実写」です。
Webサイトには、魅力的な写真を使用しましょう。
使用する写真はできる限り高画質で、商品やサービス、企業のイメージを表現したものがベスト。
できればプロのカメラマンが撮影したものが望ましいです。
特にブランディングにおける写真の役割はとても大きくなります。
思い切って大胆に、大きく写真をレイアウトすれば、ブランドイメージを向上させることができるでしょう。
色の役割を理解する
色は、人間に対して心理的効果を与えます。
サイトに対してどんな色をイメージするかで、見る人の印象は変わります。
逆に言えば、どんな色を使うかで、見る人に対する印象を操作することもできるわけです。
どんな色にどんな役割があるかを意識して、適切な色を配置してデザインしましょう。
参照:【EC運営者必見!】色で差つける?ECサイトと色の深い関係性とは?
フォントや文章もデザインである
フォントにも多くの種類があり、それぞれの文章内容との相性があります。
落ち着いた雰囲気のテキストと、派手で勢いのあるキャッチコピーでは、使用するフォントは変わります。伝えたい内容に適切なフォントを選択しましょう。
迷わないサイト設計
これは冒頭の「使いやすさ」に繋がるポイント。
サイトを訪れた人が、どこに何があるかが分かるWebサイトを作りましょう。ユーザーには目的があり、その目的を達成できることを期待してサイトを訪れたわけです。
あとは、解決できる情報をユーザーに提供してあげるだけです。ただ、その情報がどこにあるかが分からなければ意味はありませんよね。
サイトが迷路のようになっていてはいけません。
「トップページ」「コンセプト」「お客様の声」などのページのラベリングも注意する必要があれば、ユーザーが今どのページにいるか分かるような配慮も必要です。
Webサイトを作成する前に、まずはサイト全体を設計し、それを見なおしてみましょう。
ターゲットとなるユーザーの行動が、設計したサイトでイメージできるでしょうか?
ちょっとでも不安があれば、サイト設計を少し見なおす必要があるかもしれません。
ターゲットを明確に絞り込む
集客力のあるサイト制作のためのすべては、ここからはじまると言っても過言ではありません。
人によって惹きつけられるものは違いますよね?
年齢や性別はもちろん、その人の境遇や趣味趣向など、提供する商品やサービスを、どんな人に訴えたいか、またはどんな人がぴったりかを明確に決めてからデザインをしていきましょう。
ターゲットが無いと、色やレイアウト、フォントの種類は決められません。
これまでのポイントは全て、ターゲットによってちょっとずつ変えていかなければなりません。
ターゲットを絞り込むことは、Webデザインにおいて大前提になります。
まとめ:Webデザインは、ユーザーを知るところから始まる
ここに挙げたポイントは、本当に基本的なことばかりです。さらに、Webサイトの目的や目標、そしてターゲットによって、何を優先するべきかは変わってきます。
例えば年齢の高い層向けのサービスのWebサイトを作る場合、いくらクオリティの高いデザインができても、フォントのサイズが小さすぎたり、視認性が確保できていなければ、そのデザインも台無しです。
良いWebデザインの条件とは、ユーザーのことをいかに理解しているかではないでしょうか。
まずはターゲット層を調べることが、集客率がアップするWebデザインのスタートです。
WEB制作
ネットショップのデザインに使える!Webデザイン素材集7選!
昼間過ごしやすくても夜になるとやはりまだ冷えますね。
時折寒さで背筋がひやぁっとするのですが、何かいるんじゃないかと勝手に恐怖を感じてるみっしぇるです。こんにちは!
お仕事をしていると、うっかり長引いちゃって、後々もっと早く作業しなきゃな…と反省することってありませんか?
ネットショップなんかを運営していると、常に更新していかなければならないので、その都度必要な写真や素材・文章を用意して制作しなければなりません。
時間短縮のために簡単にできないかと考えるも、楽をしようとしたらその分だけ雑になっていってしまうのも事実です。
そんな時には、予め使える素材サイトをお気に入りなんかに入れておくと、デザインする度に素材探しの旅に出なくて済むのでとても便利です!
有料サイトもありますが、今回は無料で簡単に素材が手に入れられるサイトをご紹介したいと思います。
ネットショップ向け素材サイト
まずはネットショップ向けの素材ばかりを取り扱った素材サイトをご紹介します。
このサイトさえ知っておけばネットショップの基本的な部分はデザインできちゃうかも?
EC Design
EC Design
セールやNEWといった素材はもちろん、季節もののイラストやモチーフがたくさんあって、クオリティも高めなので使いやすそうです。
ちなみにこちらの素材サイトを管理されているTopeconHeroesさんは、この他にもアイコン・シルエット・矢印・吹き出しなど、それぞれを専門に扱った素材サイトを運営されているので、そちらの方もぜひ利用してみてください!
ページ上部から各サイトにアクセス可能です。私も常連です!
無料で取り放題.com
無料で取り放題.com
ネットショップの細かい部分でも使えそうなアイコンなどの素材がたくさんあります。
楽天市場のサイトなんかでよく見る、配達時間帯のイラストがあってここのだったんだ!とちょっとテンション上がりました。
その他にも決済方法や在庫切れのアイコンなど、ちょっとしたポイントに良さそうなものがたくさんです。
イラスト専門素材サイト
お次はイラストを取り扱った素材サイトをまとめました。
デザインするならいろんな場面でイラストは活躍するので知っておくと非常に便利です。
いらすとや
いらすとや
手書きタッチでほんわかしたこちらのイラスト、見たことある人もいらっしゃるかもしれませんね!
様々なシチュエーションに合わせたイラストがたくさん用意されていて、やさしい雰囲気や子供向けのサイトにもってこいです。クオリティ高いので安心して使えます。
イラストAC
イラストAC
素材の量ならきっとどこにも負けません。
とにかく種類も豊富で数も多いので、イメージが漠然としていてまだしっかり定まっていない時でもとりあえず検索してみれば良いものが見るかもしれませんね!
文字だけのイラストだったり、フレーム素材もあったりするので、あらゆる場面で重宝します。
使用する前に無料登録を忘れずに!
写真素材サイト
バナーや特集ページなどにちょっとした写真を載せたいことってありますよね。
自分で撮れればいいけど、時には素材で済ませたい時だったあります。
そんな時は写真素材サイトで!
写真AC
写真AC
イラストACさんと同じACworksさんが運営する写真専門の素材サイトです。
イラストと同様、種類や数が多いので何かと使いやすいです。モデルさんも良い表情だったり子供からお年寄りまで豊富なので、人物写真もおすすめです!
Pixaday
Pixaday
こちらの写真素材サイトは海外の写真が中心です。
風景や物などを被写体とした写真が多く、人物はほぼ外国人の方がモデルです。
独特な写真からプロが撮った様なクオリティの高いおしゃれな写真まで幅広くありますので、一度検索してみてもいいかもしれません。
私はブログ画像をよくここから入手します!
タダピク
タダピク
色んなサイトの写真をいっぺんに見たい…!という方におすすめです。
なんと検索すると、29の写真素材サイトから該当する写真が検索結果に表示されるのです。
基本商用利用OKでクレジット表示などが不要の無料サイトを利用しているので、著作権などの心配はいりません。
まとめ
以上!ネットショップで使えそうな素材を7選ご紹介しましたが、いかがでしたか?
ネットショップを運営していく上で、素材は必要不可欠なものです。
技術者であれば、自分で作ったり撮ったりすることもあるでしょうけど、時と場合に合わせて素材サイトのお世話になるのも大切です!
今回ご紹介したサイトをぜひ利用して頂いて、更に良いバナーや挿絵などを効率よく作っていってもらえたらなと思います!
WEB制作
ECサイトデザインの参考になる!Webデザインが学べる7つの優良サイト!
こんにちは、引っ越しするにあたって荷物をまとめているんですが、あまりの無駄な物の多さに引っ越し自体嫌になってる相馬です。物が多いのでなかなか整理できずに、常に部屋が散らかってます。
さて、ECサイトのWeb担当者さんなら、ちょっとしたサイトの調整や修正などが出来たらなあ、と思った事はあるはずです。
アクセス解析の結果や商品の売れ行き傾向を見て調整をしたくても、Webデザインの知識がなければ手に負えませんよね。
もともとWebサイトを制作できる知識を持っていれば問題ないんですが、全てのWeb担当者さんがそうとは言えないはず。これから勉強を始める場合や、勉強しながら運営している、というパターンもあると思います。
今回はそんな悩めるWeb担当者さんを救う、初心者でも分かりやすく、楽しく無料でWebデザインの勉強ができるサイトをご紹介します。
僕がデザイナーを目指し始めた頃からお世話になっているものや、現在プロのデザイナーでもとっても勉強になるサイトばかり。
Web運営者とはいえ、Webデザインの知識はあればあるほど役立ちます。これらのサイトを参考に、常にWebデザインの知識を取り入れていきましょう。
ECサイトに役立つWebデザインについて学べるサイト
Webクリエイターボックス
Webクリエイターボックス
Webデザインを学ぶなら、一度は訪れるサイトでしょう。
Webデザインの基礎的なものから、つっこんだ技術まで、とてもわかり易く丁寧に解説しています。サイト自体も見やすくてシンプル。デザイナー駆け出しの頃、とてもお世話になりました。
イチオシ記事
・新規顧客を逃さないECサイトデザイン
株式会社LIG
株式会社LIG
制作会社のサイトですが、ブログメディアとして大成功したサイト。
こちらもWebに携わる日本人ならほぼ100%見たことがある会社でしょうね。
会社の広告や事業に関わるおもしろ記事だけでなく、ハイレベルな技術力を活かした記事も豊富です。
勉強のためであれば、最近の記事よりも過去の記事からキーワードで検索した方が、とても参考になる記事がたくさん見つかるはずです。
イチオシ記事
・初心者でもプロのクオリティーで撮れる!屋外のポートレート撮影テクニック
コリス
コリス
こちらも言わずと知れた、Webデザイナー御用達のサイト。
海外の優良な情報記事を分かりやすく翻訳した記事をアップ。更新頻度も魅力で、常に最新のWebデザインの動向がチェックできます。
こちらは技術というよりも、Webデザインの「今」や「これから」という意識でチェックしておきたいサイトだと思います。やっぱり、Webデザインにおいてはまだまだ海外の方が先を行ってますからね。
ECサイト運営においても優良な記事が多数あります。時間を忘れて読みふけりましょう。
イチオシ記事
・Eコマースサイトを成功に導くための18のアドバイス
NxWorld
NxWorld
ECサイト運営にあたって、触ることの多いCMS「WordPress」に関する記事が充実しています。
画像とともに解説があり、初心者でも分かりやすい記事でとてもオススメ。
WordPressで構築されたECサイトをお持ちなら是非。
イチオシ記事
・ECサイト向けアイコンセット 30
LYKAONエンジニアブログ
LYKAONエンジニアブログ
こちらはWebデザインというよりも、SEOに関する知識や施策などに特化した記事が豊富です。サイトの運営にあたって様々なトラブルや悩みを解決してくれそうな記事が集まっています。
ECサイトに限らず、サイトを運営していれば様々なトラブルにぶち当たると思います。そんな時に覗いてみると、解決方法が見つかるかもしれません。
イチオシ記事
・【もっと売れるためのECサイト/ネットショップ講座】第1回 カテゴリ編
Webデザインレシピ
Webデザインレシピ
担当になったけど、Webデザインについてほとんど分からない・・・。
そんな方はここを見ましょう。
ああしたい、こうしたいという、Webデザインの技術に関することならほぼここを見れば解決するはず。
とても分かりやすく、初心者が楽しくWebデザインを学ぶことができるサイトです。
イチオシ記事
・これからWebサイトの制作をしたいけど、何から勉強したらいいの?っていう人のためのガイド
Photoshop VIP
Photoshop VIP
ところどころにとてもグラフィカルな仕掛けが施されたブログサイト。
主にPhotoshopを中心とした画像加工チュートリアルや高品質な素材を紹介しているサイトです。
特に写真の加工チュートリアルや、テキストエフェクトなどはレベルの高い技術を分かりやすく解説されていて、読んでいるだけで試してみたくなります。
ECサイト運営者にとって画像加工に関する技術はあまり必要ないかもしれませんが、知っておくと得する技術や知識が満載のサイトです。ブックマークしておいて損はないですよ。いつの間にか、クオリティの高いバナーぐらいなら作れるようになっているかも。
イチオシ記事
・基本だけど大事、デザインに欠かせない7つのポイントまとめ
まとめ:Webデザインを知れば、ECサイトの基礎も分かる
以上、7つのサイトをご紹介しました。
ECサイトに限定した話ではありませんが、Webデザインというのは世界中の人が知識を共有しあって急激に発展してきたものです。
誰かが新しい試みを成功させれば、それ見た沢山の他の誰かがアレンジして使い、それが定番化して広まっていく。その繰り返しで、ものすごい速さで技術はどんどん上がっていきます。
ECサイトを運営するうえでの悩みの解決方法や、もっと良くしたいという希望を実現する方法は、上に挙げた7つのサイトをはじめ、Web上のところどころに落っこちています。それらをひとつひとつ集めて、丁寧にクリアしていけば、Webデザインの基本的な技術は身についていきます。
Webデザインの技術をECサイトの運営に役立てていけば、改善のスピードは上がり、より集客のできるサイトへと成長していくはずです。
以上、相馬でした。
WEB制作
ECサイトはフォントが重要!気軽に使えるWebフォントとおすすめのフォント5選!
突然ですが、Webフォントをご存じですか?Webフォントは最近話題のWeb技術です。
ページのデザインを統一したり、場合によってはページの表示速度を改善することだってできてしまいます。本稿では、ECサイトにWebフォントが向いている理由と、おすすめのWebフォントサービスについてまとめました。
※利用時にはライセンスの確認を忘れずに行ってくださいね。
WebフォントはECサイトと相性バッチリ!
Webフォントとは?
ECサイトでは、あらゆるページに文章(テキスト)が表示してありますよね。そういった文章の見た目を決めているのが、フォントです。フォントを指定することでデザインを統一することができるのですが、フォントには一つ大きな弱点があります。
それは、サイトを表示しているスマホやパソコンに指定したフォントがなければ、意図しないフォントで表示されてしまうこと。これではデザインが崩れてしまうので、困ってしまいますよね。この問題を防ぐために、これまでは画像にテキストを載せる方法がとられてきました。しかし画像を使うと、運用管理が大変になりますし、ページの表示速度も遅くなります。
そこで脚光を浴びているのが、Webフォントです。
これまでは、ユーザーが使っているスマホやパソコンにあるフォントファイルを使っていました。Webフォントでは、サーバー上にあるフォントファイルを読み込むのです。ユーザーの端末に依存しないので、ネット環境さえあれば、いつでも正しいフォントで文章が表示できるようになります。加えて、画像を使わないことでSEOにも効果がありますし、画像の読み込みによる表示速度の遅延を軽減することも期待できるのです。
ECサイトでWebフォントを使うべき理由
ウェブ運用でとても役に立ってくれるWebフォントですが、ECサイトとの相性が特に良いことで知られています。ECサイトでは、商品の説明文を頻繁に更新する必要がありますよね。その他にも、サービス紹介やレビューなど、至るところに文章があります。
ECサイトでWebフォントを利用すると、文章の運用管理もし易くなり、サイト全体としてもデザインの統一ができます。ECサイトを使っているのなら、ぜひともWebフォントの利用を検討したいものです。
おすすめのWebフォント5選
日本語のフォントを中心に、おすすめのWebフォントを5つご紹介します。
Google Noto Sans Japanese
Google Noto Sans Japanese
検索エンジンの最大手、Googleが提供しているWebフォントサービス「Google Fonts」。700を超えるWebフォントが提供されているのですが、日本語のフォントも提供されています。
「Noto Sans Japanese」と呼ばれるこのフォントは、もともとはAdobeとGoogleによって開発されたフォントをWebフォントにしたものです。見た目もキレイで、視認性も高いことがわかります。
フォントプラス
フォントプラス
ソフトバンク・テクノロジーが提供しているWebフォントサービスです。日本語のWebフォントを使うと、ページの表示に時間がかかってしまうことがあります。
「フォントプラス」は日本の会社が提供しているだけあって、その辺りの対応がとてもしっかりしています。「モリサワ」や「FONTWORKS」、「大日本印刷」などの大手フォントを含む、700以上の書体を利用することができます。
なお、提供されているフォントはほとんどが有料です。高品質なWebフォントが多い分、ライセンスごとに料金を支払う形式になっているです。無料のトライアルフォントも用意されているので、気になる方はまずそちらから試してみるといいでしょう。
M+ OUTLINE FONTS
M+ OUTLINE FONTS
「M+ OUTLINE FONTS」は、無料のWebフォントです。商業利用はもちろん、改変や再配布も可能です。
シンプルなデザインのフォントで、漢字の視認性もなかなかいいですね。フラットデザインに向いていると言われますが、ジャンルを問わず使っていくことができるでしょう。
TypeSquare
TypeSquare
モリサワが提供しているWebフォントサービスです。明朝体やゴシック体だけでなく、デザイン書体や装飾書体などさまざまなWebフォントが提供されています。
利用できる書体が1つの無料プラン(月1万PVまで)もありますが、それ以上の場合は月額もしくは年契約での有料プランとなります。
AXIS Font...
WEB制作
ECサイトのUIを改善して集客率をガンガン上げる7つの方法!
カフェインを摂取しすぎて、最近常にハイテンションの相馬です!
海外のエナジードリンクってなんかデザインがイケてますよね!
Red Bullもオシャレだし、モンスターエナジーもシンプルでクールです。
それに比べて日本のそれ系って皆茶色い瓶に黄色と赤の配色。なんとかならんもんでしょうか!
話変わってECサイト。
ECサイトのユーザーって実はネットサーフィン初心者が多いんですよね。
「買いものするときはネットで」という理由もあって、年配の方が見る割合が高いのです。扱う商品にもよるので一概には言えませんけども。
そこで重要なのがユーザビリティ。
特にネット初心者にも優しいUIを考慮すると、いわゆる「Webでの常識」が通用しない場合もあります。
今回は、ECサイトを運営する上で注意したい、集客して離脱させないUIのポイントをご紹介。
こういった細かい配慮が、大きな違いを産みます。
ではいってみましょう!
集客のできるECサイトで重要なUIのポイント
商品画像は大きく分かりやすく
もうポイントとか注意すべきとかではなく、ECサイトを運営するなら当たり前のレベルです。
直接手に取ることの出来ないECサイトでは、商品の善し悪しは、写真と文章で判断するしかありません。
ではどちらを見てユーザーは初めて興味が湧くのか。言うまでもなく写真ですよね。
商品を実物以上に魅力的に見せるために、写真選びには気をつけましょう。
支払い方法や送料、到着日数は明確に
ユーザーはお金を払う立場です。
いくら商品が欲しくても、信頼出来ないお店からは買いませんよね?
商品代だけでなく、「全部でいくらかかり、商品はいつ手に入るのか」が明確に分からないと、購入ボタンは押しにくいはずです。
購入ボタンのあるページ。つまり商品ページに、送料と発送日が明確にわかる様にしておきましょう。
カテゴリを明確に分かりやすく
ユーザーが探しやすいように、最適なカテゴリ分けを意識しましょう。
きちんとカテゴリが最適化できていれば、ユーザーにとってとても使いやすいサイトとなります。集客できるECサイトの条件に、リピーターは不可欠です。
リピーターを増やすためには、「使いやすさ」がとても重要になります。
あなたも、できれば「ほしい商品がすぐ見つかる」お店に通いたいですよね。
丁寧な表記を
冒頭に挙げたように、ECサイトにはネットに不慣れなユーザー層も訪れます。
そのため、通常のサイト以上に文言には気を使いましょう。
例えば「詳しくはこちら」ではなく「商品の詳細はこちら」など、具体的にユーザーを導いてあげることを意識しましょう。
購入ボタンから購入完了までの流れを明らかに
ECサイトにとって最悪なパターンがいわゆる「カゴ落ち」。
つまり、購入ボタンは押されてるのに、実際に購入まで至っていない状況です。
カゴ落ちしているユーザーは大体、「どこまでいけば購入完了なのかが分からない」という心理状況です。とってももったいないですよね。
実際の店舗なら声をかけて足止めできますが、ECサイトではウインドウを閉じて終わりです。
こんな事にならないように、購入ボタンを押してからどこまでいけば購入完了なのかを、ステップごとに明記しておきましょう。
Q&Aページを用意する
ユーザーにとって疑問になりそうなものは、あらかじめ「よくある質問」として回答を用意して、専用のページを作成しましょう。
「海外発送は?」
「大量購入は?」
「返品は?」
「キャンセルは?」
これらの質問は、大体のECサイトにはつきまといます。疑問をすぐに解決することによって、サイトからの離脱を防ぐのです。
ユーザーにとっては、問い合わせるよりウインドウを閉じて他のお店を探す方が簡単です。
よくある質問ページを作成して、どのページからも行けるように分かりやすくリンクボタンを設置しましょう。
シンプルな構造を心がける
ECサイトだからこそ、シンプルでわかりやすいページ構成を意識するべきです。
ゴテゴテの装飾は避けて、ページの読み込みも早くなるよう、パーツは極力控えめに。
どんなサイトにも言えることですが、ページの読み込みが遅いほど、離脱率は高くなります。
色々な商品を探しているユーザーは、読み込みが遅いサイトを容赦なく切り捨てていきます。
ユーザーが一番見たいものは商品であって、サイトのデザインではありません。
まとめ:ECサイトの集客のためには、丁寧に分かりやすく、信用第一。
ECサイトは、ユーザーにとってはお店と一緒です。お金を支払って商品を買うわけですから、信用出来ないところでは買い物はしません。
いくら掛かるのか、商品は見つけやすいかなどはもちろん、デザインも信頼感のあるデザインを心がけるべきです。
そういった意味では、デザインもUIのひとつです。
誰だって、信用できないお店では買いたくありませんよね? デザインコンセプトは商品と噛み合ったものでなくてはなりませんが、お店である以上、信用のおける文言や表記を心がけて、商品の探しやすいUIを目指しましょう。集客のできるECサイトへの道は、そこから始まります。
ではでは、相馬でした!
WEB制作
【EC運営者必見!】色で差つける?ECサイトと色の深い関係性とは?
寒すぎてUNIQLOでヒートテックを七枚大人買いした相馬です!
これで一週間まるっとヒートテックを着ることが出来ます。
さて、せっかくECサイトをオープンするのであれば、当然商品が売れて欲しいですよね?
ユーザーが商品を買うためには、当たり前ですが購入ボタンをクリックしなければなりません。購入ボタンをクリックするには、商品ページに誘導する必要があります。
ごくごく当たり前のことですが、それを考えるのがデザインです。そして、欠かせない要素が色。
必ず、押してもらえるボタンの色は存在しませんが、ある程度のデザイン知識を持っておくことで、普通よりもちょっとだけそれに近づけることが出来ます。
今回は、ECサイトと色が持つ関係性についてご紹介します。
色の持つ力や、色とECサイトがどのような関係があるかを知っておくことで、ECサイトの集客に役立つことがあるかもしれません。
人間は無意識に色に対するイメージを持っている
色はWebデザインだけでなく、紙や看板などデザイン全体においてとても需要な要素です。
すべての色に意味があり、それぞれの色が人間に与える印象は違います。さらに性別によっても色の好みは別れます。
女性であれば原色を好み、男性は紫、オレンジ、ブラウンなどを割ける傾向にあるようです。
男女ともに好むのはブルーみたいです。
(参照:Increase Delivery Rates With Active Bounce Management)
Webサイトにおいても、サイトの配色によってコンバージョンが変わるケースはたくさんあります。購買意欲をそそられたり、ブランドや商品の印象も、色によって変わります。
商品自体も、カラーによって人気・不人気があります。これは好みだけの問題ではなく、実店舗とECサイトでの人気のカラーは違う、なんてことはよくあることです。
色には、それだけの力と可能性があります。集客力のあるECサイトを作るには、疎かにしてはいけない大事なポイントです。
ブランディングと色の関係
上のイメージは、あるお店を思い浮かべて、僕が適当に色を選んで、1分程度でささっと作ったものです。僕は何の企業をイメージしたでしょうか?
正解はマクドナルド。とても簡単なクイズですよね。
同じように、好きなブランドを思い浮かべた時、特定の色をイメージしませんか?
例えばルイ・ヴィトン。殆どの人は茶色を思い浮かべたんじゃないでしょうか?
このように、色とブランディングは密接な関係があります。ブランディングには、メインカラーの設定が不可欠です。
ECサイトでは、設定したメインカラーを重要なポイントに配置し、「このお店と言えばこの色だ」というイメージをユーザーに染み込ませなければいけません。それはブランドの認知度、つまり集客に直接影響します。
ユーザーのアクションに影響する色
Webの世界では長い間、CTA、つまりコール・トゥ・アクション(Call to Action)には、明るい色が定番と言われています。これはやっぱり今も変わっていないように感じます。
つまり、購入ボタンやお問い合わせボタンには、グリーン、赤、オレンジといったカラーを選ぶのが効果的だということです。
それを踏まえて、ECサイト全体の配色を、購入ボタンを中心に選んでいくのも良いかもしれません。
例えば、グリーンがメインカラーのサイトの中に、グリーンの購入ボタンを置いても、効果はあまり期待できませんよね。だからと言って、購入ボタンを赤にすれば、デザインの難易度はぐっと上がります。最悪の場合、クリスマスのイメージがつきまとったECサイトになってしまう可能性があります・・・。
集客できるECサイトにするために、適切な色を選択する
適切な色といっても難しいかもしれませんが、これが間違っていると、集客どころか、サイトを訪れたユーザーが「間違ったサイトに来てしまった」と勘違いして、離脱してしまうサイトになってしまいます。
例えば、子供向けのおもちゃのECサイトのメインカラーに紺色に近いブルーを選んだ場合、ユーザーの印象はどうでしょう?しっかりとブランドのカラーが確立されていないかぎり、「おもちゃが買えるサイト」という第一印象は持ってもらえないはずです。
ユーザーはサイトを3秒で判断して、滞在するか離脱するかを判断しています。第一印象でどんなイメージを植え付けるかは、集客に直接影響するのです。
まとめ:色はECサイト集客力の決め手にもなる!
人にはさまざまな「好み」がありますが、色に対するイメージは、人間の潜在意識に訴えるものです。
いわゆる「パッと見」と言われる一瞬の印象操作に、色が持つ力を使わない手はありません。
最後に、基本的な色が持つ人間の潜在イメージをご紹介します。
黄色
若々しさ・活発・子供向けの商品
赤
注意をひく・緊急性・セール表記
青
信頼・安全・企業やサービス提供
緑
リラックス・自然・家具や自然食品
オレンジ
安心・目を引く・行動力・購入ボタンや食品
ピンク
女性的・メルヘン・女性や子供服
黒
力強さ・高級・アクセサリーなど高価な商品
紫
落ち着き・やわらかさ・年配向けのサービスや商品
これだけが正解ではありませんが、ぜひぜひ有効に活用して、集客に繋がるECサイト作りに役立ててください!
ではでは。
WEB制作
ECサイトにも応用可能!良いデザインと悪いデザインとは?
こんにちは、インフルエンザ流行が今年(2016年)がなかなか来ないと思っていたら、周りがバタバタと倒れだしました。いつ襲ってくるか恐怖に怯える今日このごろの相馬です。
ぶっ倒れたら仕事も何も無いですからね・・・職業柄作業も長時間、夜遅くなりがちですが、いちデザイナーとして健康にも気を使わなければいけませんね。
さて、デザイナーとして常にテーマとしてあるのが「良いデザイン・悪いデザイン」は何かということ。
全世界のデザイナーにとって永遠のテーマでもあると思います。何が良いデザインで、何が悪いデザインなのかを考えることは、何もデザイナーだけの仕事ではありません。
ECサイトを運営している担当者さんも、売上アップのため、アクセスを集めるために常日頃考えていく必要があります。
今回は、何がデザインにおいての良し悪しを考えるとともに、ECサイトにどう活かしていくかを考えてみたいと思います。
これを理解していれば、サイトをもっと充実させ、売上やアクセスアップに繋がり、より大きなビジネスチャンスを作ることが出来ます。
Webサイトは、そんな大きな可能性を秘めたものなのです。
デザインの良し悪しを理解して、ECサイトに落とし込もう
まず結論から言うと、
目的を達成しているサイトは結果的に良いデザイン。
目的を達成していないサイトのデザインは改善の余地があるということです。
お問い合わせを増やすことが目的だったり、ランディングページであれば商品を直接売ることが目的であったり、サイトに寄って目的は様々です。ただ、目的を達成しきっているサイトなんて、この世の中でも一握りだと思います。
目的を達成させるために、サイトの現状を把握し、改善を繰り返していくことが、「良いデザイン」に近づくための方法であることを理解しましょう。
エンドユーザーのためのものであることを忘れない
まず知っておくべきこと。それはサイトは運営側のものでなく、エンドユーザーのためのものであるということです。つまり、「サイトを訪れる人」の心境を考えてデザインをしていかなければなりません。
例えば、サイトに画像や何かしらのアイコンを設置しようと思った時、その画像やアイコンは、見る人にとって、そして目的達成に対して本当に意味のあるものでしょうか?もし不必要なものであれば、それはただ単にノイズになるだけです。
作り手側としては、どうしても見栄えが気になるものですが、あまりにも見栄えばかり気にしてしまうと、いつの間にかサイトがノイズだらけ・・・ということになりかねません。
良いデザインとはサイトの目的とユーザー視点でデザインされており、余計なオブジェクトや画像が無い。悪いデザインとは見栄えを重視しすぎており、装飾が多すぎてゴールまでの道筋が分かりにくい。大切なのは、「デザイン」と「見た目」は全く別の意味ということです。
ECサイトの場合
ECサイトの目的は商品を売ることです。
そのための絶対不可欠な要素、
魅力的な商品写真
分かりやすく押しやすい購入ボタン
が最重要パーツです。
この2つを最大限活かすためのデザインをしていくことが、ECサイトにとっての「良いデザイン」ではないでしょうか。
ユーザーに商品の魅力を最大限伝えるために、商品写真をどう見せていくかを考えることも大切です。
では、具体的にどのようなデザインを意識していけば目的達成に近づき、ユーザーが使いやすいサイトになるのか。細かく見ていきましょう。
情報の配置
サイトには、メインコンテンツを求めてアクセスするユーザーがほとんどです。ECサイトであれば「商品を探しに来る」ユーザーということですね。
ユーザーそれぞれが目的の情報を見つけやすくするのが、良いデザインの本質です。
良いデザイン
情報が整理して配置してあり、それぞれの情報への導線(ページ遷移)が分かりやすく、ユーザーが一瞬でどこに何があるかが判断できる。
悪いデザイン
ひとつのページに情報がつめ込まれていて、情報過多によりそれぞれのユーザーが目的の情報を見分けにくい。
ターゲットの設定
万人の心に刺さるサイトは不可能です。
逆に言えば、こちらが提供する情報を求めている層というのは必ず存在しています。
ECサイトではもっと分かりやすくなります。商品では、ターゲットがより明確になることが多いはずです。
サイトをデザインするときは、ターゲット層をはっきりと明確にして、それに応じたテイストで設計していかなければなりません。ターゲットによってフィットするデザイン、細かく言えば文字の大きさや色は、全く異なるからです。
良いデザイン
ターゲットをきちんと設定して、提供するコンテンツと狙ったターゲットがマッチしており、さらにターゲット層に合わせた見た目になっている。
悪いデザイン
ターゲット層が決まっておらず、デザインのコンセプトが定まっていない。または、狙ったターゲットに回せたデザインになっていない。
ブランディング
この記事の冒頭で「見た目を重視するべきではない」ということを散々書きましたが、だからと言って何も装飾がないのもいけません。
「見た目」は特にブランディングに大きな影響を及ぼします。
ブランディングは商品や企業の価値を高めるもの。特にECサイトでは、購買意欲にも関わる重要なポイントです。ECサイトにおけるブランディングは、「商品をどのように見せるか」。つまり商品写真が大きな役割を果たします。
意識しなければいけないのは、商品をより良く見せるために、できることは全てするということ。
商品写真はキレイなものを撮影することはもちろん、商品説明やコンセプトを作って、それに合わせたデザインをすることが大切です。
画像の多さはページの表示速度に影響しますが、商品の画像は適度に多い方がユーザーに分かりやすいですよね。また、商品の説明文も明確で分かりやすい文章を丁寧に作ってユーザーにアピールしましょう。
良いデザイン
商品の写真の画質が高く、商品の大きさや重さなどが明記してあり、実際に手にとったイメージができる。サイト全体が商品のコンセプトや雰囲気にあっている。
悪いデザイン
商品写真の画質が荒く、枚数も少ないため、実際の商品がイメージしにくい。
商品とサイト全体のデザインコンセプトが合っていない。
まとめ:どうすればユーザーが分かりやすいか
単に良い「見た目」にするための技術やテクニックはたくさんあり、いわゆる「定番」の形というものが存在します。
ただ、ユーザーを促し、サイトの目的を達成する「デザイン」には、決まった方法などありません。
時代やニーズは日々移り変わり、ユーザーが求めるものはユーザー自身無意識のうちに移り変わっていくものだからです。単純な「見た目」と「デザイン」には、そんな大きな違いがあるのです。
ECサイト売上アップには、良いデザインであるかないかが大きな要素であることは間違いありません。サイトへのアクセスを分析して、対策と改良を続けていくことが、良いデザインになり、その先にある売上につながっていくでしょう。
ではでは。
Want to stay up to date with the latest news?
We would love to hear from you! Please fill in your details and we will stay in touch. It's that simple!