サイトの「配色」を見直そう【感覚マーケティング】

サイトの「配色」を見直そう【感覚マーケティング】

感覚マーケティングとは

現在コロナの影響により、ネットショップに新規参入する会社が増え、競合が加速しています。
たくさんのネットショップの中から顧客に選ばれるための努力が必要になります。

販売戦略のひとつとして「感覚マーケティング」がありますが、これは消費者の「五感(視覚・聴覚・味覚・嗅覚・触覚)」に訴えかけて購買意欲などを促進する戦略になります。

ネットショップでは味覚・嗅覚・触覚は取り入れ困難であり、聴覚は動画コンテンツ等の利用が必要となり導入の手間が大きくなります。
ネットショップでは「視覚」情報による効果が非常に高いと言われています。

今回は「視覚」でのマーケティングについて解説します。


サイトの配色を見直そう

配色の基本

配色は一般的に、ベースカラー・サブカラー(メインカラー)・アクセントカラーの3つで構成しましょう。
この3つの色を「70:25:5」の比率で使用するとまとまりのある安定した配色となると言われています。

ベースカラー

サイトで一番大きな面積で使用される色。サイト全体の背景や余白として使用します。
なお基本的には白やグレーなどの薄い色や無彩色を選ぶと文字が見えやすいのでおすすめです。
ただしサイトイメージや商材などによっては、黒などの濃い色を使用することでインパクトのあるサイトを表現することができます。

サブカラー(メインカラー)

2番目に使用比率が高い、サイトのメイン色。ブランドカラーを採用するケースが多いです。
なお、ベースカラーと近い色だと落ち着きがでるサイトに、真逆の色だとメリハリが出ます。

アクセントカラー

サブカラーの引き立て役で強調したい部分に使うことで引き締まった配色となります。
比率は全体の5%と少ないため、一番目立つ色を設定するのがおすすめです。


もちろんサイト上ではこの3色以外も使用することになりますが、3色を決めておくことで、それ以外に使用する色も調和のとれるものを選択しやすくなり、配色をイメージ通りに進めることができるでしょう。
たくさん色を使い過ぎないように!

各カラーを決めるときは、色の相性も大事です。
補色の原色同士は毒々しくなりやすく、逆に同系色すぎると地味に。
ただし彩度や明度を調整することで、かえって綺麗な組み合わせになることもあります。
色の組み合わせは一概には言えないので、最初にサブカラー(メインカラー)を決めてから考えると良いでしょう。

また、背景色と文字色の明度差が小さいと、視認性が下がるため顧客に優しくないサイトになってしまうので注意が必要です。

色の心理的効果の活用

サイト全体のイメージやターゲット層に合わせた配色にすることが大前提ですが、各色ごとに視覚的に与える印象というものが存在します。
それをうまく利用して、各ボタンの配色や、注目してほしい部分などに取り入れていきましょう。

例えば赤やオレンジなどは暖かみを感じ、青や紫は冷たさを感じるなど、色で「温度」を感じるように、人は視覚情報で印象が左右されやすいです。
色による心理的な効果については、実際にウェブサイトで試した統計や、心理学の論文などでも取り上げられるくらい認知されてきています。

色が与える印象の具体例

情熱・力強さ・パワー・重要性・強調・火・危険

存在感が強い色のため、目立たせたい部分に使ったり注意書きの文字色に使われることが多い。
また、赤は購買意欲を高める効果があると言われているので、カートに入れるボタンなどに使用している大手ECサイトも多い。ただし、ブランドカラーが赤の場合はボタンの色を敢えて変えているケースも。

幸福・明るさ・希望・光・笑顔・フレッシュ・注意

こちらも刺激色。背景色に使う時は文字色との組み合わせを考慮しないと、視認性が低下するので注意。
また、赤と組み合わせることで、購買意欲のさらに高める効果が期待できる。

信頼・清潔感・落ち着き・静けさ・水・クール

コーポレートカラーやクレジットのような信頼性を強調したいサイトに多く使われる傾向がある。
飲食類をメインに取り扱うサイトには、食欲を衰退させる色のため注意が必要。
信頼感を主張したい文章やアイコンの色などにおすすめ。

癒し・安心感・優しさ・平和・エコ・自然・リラックス

幅広い業種のサイトで使いやすい色。優しい配色にしたい場合や、安全性や自然のイメージを強調したいときにおすすめ。注意喚起したいときの色には向かない。

オレンジ

陽気・元気・エネルギー・楽しさ・食欲・アクティブ

飲食系のネットショップで使われやすい色。また、元気なイメージから企業のロゴや企業カラーとしても人気が高い。
カートに入れるボタンで赤が多いと先述したが、赤よりキツイ色ではないが目立たせる色+ポジティブな印象の色からこちらもおすすめ。

高級感・大人っぽさ・重み・無機的・闇・シック・不安

化粧品やバーなどの業種に人気の色。暗さや闇という不安効果を持ち合わせているが、写真との組み合わせや余白などで、夜の雰囲気やシックで高級感あるイメージを作り上げることができる。
ベースカラーに用いる場合、文字色やアイコンなども細かく配慮が必要となるため、作り手の腕が他の配色より求められる。

清潔・透明感・上品・純粋・光・静か・シンプル

ベースカラーで取り入れやすい色。近年では特に余白を活かして空間の広がりを大事にするウェブサイトが多い。
シンプルになり過ぎる傾向があるため、鮮やかな写真を盛り込んでいくと調和がとれて良い。
また、清潔感を強調したい場合も白がおすすめ。


色が持っているイメージをうまく利用してサイトの配色を見直してみましょう。

サイト全体の配色はショップイメージを大事にし、購入者のフロー上にあるもの(各種リンクボタンや、セール告知など)は、購買意欲を刺激する色合いを取り入れてみてはいかがでしょうか。

ネットショップ作成カテゴリの最新記事