ここではECサイトの「キーカラー」を決める時に意識したいポイントを紹介します。
色の特性を理解してサイトをデザインすることは、ネットショップの売り上げアップにもつながる重要な工程です。
扱っている商品としっかりマッチする色を使うことが大切。意味のある色使いをしましょう！
ネットショップのキーカラーの重要性
サイトには必ず「キーカラー」が存在します。要するにイメージカラーですね。
ネットショップ（ECサイト）の場合は、特にこの色決めが重要なポイントとなります。
というのも、サイトのキーカラーによって売り上げが大きく変化したというデータがあるんです。
例えば「CTAボタン（購入ボタン）」の色。
ネットショップ界隈では有名な話なんですが、CTAボタンをオレンジ色にするだけでクリック率が上がることが分かっています。
ちなみに有名なところでいうと「Amazon」や「Yahoo!ショッピング」のCTAボタンがオレンジ色ですよね。あれはちゃんと理由があってオレンジ色を使ってるんです。
ちなみにこれは色が持つ心理的効果による影響なんですが、今回紹介するのはまさにこの部分です。
色の持つ心理的効果をマーケティングに活かす話。
ポイントは「色が持つ心理的効果」「配色のルール」「トーン」の３つです。順番に見ていきましょう！
色が持つ心理的効果について
まずは、web配色の基礎となる「色が持つ心理的効果」について。
人間は色から様々なイメージを感じ取ります。
例えば、青色からは冷静で知的なイメージ、赤色からは情熱的な生命力を感じる人が多いと思います。
この通り、人は無意識に色から何かしらのイメージを感じ取ってしまいます。
ネットショップの場合は、この心理的効果が商品のイメージにまで大きく影響するんです。
商品と色がマッチしていないサイトでは、せっかく来たお客さんも違和感を感じて去ってしまいます。
ネットショップを利用するお客さんにとっては「信頼できるサイトかどうか（安心感）」がとても重要で、パッと見たサイトの印象次第では速攻ブラウザバックも十分にあり得ます。
お店なんて他にいくらでも探せますからね…。
これではマーケティングに活かす以前の問題です。
ショッピングしやすい居心地の良いサイトを作るためには、最低限色が持つ心理的効果を理解しておく必要があります。
あわせて読みたい
配色のルールをもとにネットショップの色を決めよう
色が持つ心理的効果がだいたい理解できたら、次は「配色のルール」を勉強しましょう。
商品に合う心理的効果を持つ色をやみくもに使うと、当然デザイン的にまとまりのないサイトになってしましますからね。
まずはこちらをご覧ください。
色相環
「色相環」といって色の関係性を表した図なんですが、これを頭に入れておくことで配色の基本パターンを想像してみてください。
隣り合う色は「類似色相配色」と呼ばれる近しい色で、一番通り向かい側の色は「対照色相配色」なんて呼ばれます。
例えば類似色相配色のみのサイトは、統一感のある綺麗なデザインに見えますが、メリハリのない単調な印象を受けます。
お客さんからすると、どこに注目すれば良いのか分からず疲れてしまう…。
そんな時は、一見合わないように見える対照色相配色を取り入れることで、重要な箇所を目立たせる必要もあるでしょう。
これによってサイトに締まりが出ます。
こんな感じで、色の関係性に沿った配色を使うことが大切です。
色相環を取り入れることで、デザインが苦手でも違和感のない色使いができるようになるはずです。
色の「トーン」を使いこなそう
色が持つ心理的効果や色相環はイメージしやすいと思いますが、これだけ知っていてもサイトのキーカラーを決めるにはまだ不十分。あと一歩足りません。
実際に色を決める際は、さらに「トーン」と呼ばれる要素も重要。
色には３つの属性があります
色は３つの属性によって構成されています。
- 色相・・・赤、青、緑などの「色み」
- 明度・・・色の「明るさ」
- 彩度・・・色の「鮮やかさ」
属性なんて難しい言葉を使ってますが、ご覧の通り意味は単純なことです。
Photoshopなど写真を編集するソフトを使ってると、この３つの言葉がよく出てきますよね。
「色相」は色そのもののことですが、ここで押さえておきたいのは「明度」と「彩度」です。
明度と彩度を合わせたものをずばり「トーン（色調）」と呼ぶんですが、このトーンからも人は心理的な影響を受けているんです。
例えば赤色１つをとっても、「灰色がかった赤」や「鮮やかな赤」「薄い赤」など様々なトーンがありますよね。
当然感じる印象は変わってきますし、赤の持つ心理的効果に本来なかったイメージを感じる人もいるでしょう。
これら３つの要素を上手く組み合わせると、パッと見でお客さんを引き込む魅力的なサイトになると思います。
