投稿日時:

前回のWeb系ブログコラムでは「既存サイトに新規バナーを追加する」際に検討すべき要素として「色の視認性」ついてお話ししました。今回はシリーズの第2回目として「色の誘目性」について説明したいと思います。

色の誘目性とは、簡単に言うと「人目の引きやすさ」の事です。
色には目立ちやすい色があります。例えば赤、オレンジや鮮やかな青などは注目を集めやすい色です。一方で濃い灰色や鈍い緑などはあまり目立たない色になります。イメージとしては、鮮やかな原色は色の彩度が高いと考えるとわかりやすいと思います。このような誘目性の高い色をバナーに使用することで、容易に人目を引くことが可能です。

それでは、目立たせたいバナーに誘目性の高い、言い換えれば彩度の高い色を使用するだけで良いかと言うと、そう単純ではありません。バナーに使用する色の組み合わせによっては、第1回でお話した視認性の高さを確保できなくなる可能性もあるので、使用する際には注意が必要です。確認になりますが、色の視認性とは、字やモノの認識しやすさの度合いのことでした。
例えば、誘目性の高い真っ赤な背景色の上に赤いりんごの画像を配置しても画像は目立ちません。逆に何の画像が配置されているかを読み手に判別させるというストレスを与える可能性もあります。その場合は、真っ赤な背景色を修正して、具体的には誘目性を確保するための赤は細い枠線のみで使用するにとどめ、背景色には白かそれに準じた明度の高い色を使用する、といったバナー自体の視認性の高さをしっかりと保つ工夫が大切になります。

別のパターンとして、Webサイトのテーマカラーに誘目性の高い赤などを多く使用するデザインがあります。この場合単純に赤色を使用しても、周りに同じ色が並ぶため、期待する誘目性を実現することは難しいです。その場合は「補色」の性質を利用すること、解決することがあります。補色とは、下の色相環の図で対立する色同士は互いを最も引き立てあう関係にある色のことです。黄色と組み合わせて最も目立つ色は紫ですね。この性質を利用すると、例えば緑をバナーに使用することで、元々誘目性の高い赤が多く使用されているWebページであっても、特定のバナーに誘目性の高さを追加することが可能になります。

鮮やかな色の原色をそのまま使う場合、色の効果をストレートに伝達するにはとても良い方法ですが、デザインとの兼ね合いで少し浮いてしまう場合もあります。その場合は彩度や明度を少し増減させることで全体のまとまりが良くなる場合があるので、試行錯誤を行うことで期待する色を実現できることが多いと思います。

今回は、誘目性の高い色を使用することで人目を引きやすくなるが、視認性を損なわないための工夫の有無も考えながら使用することが大切である、というお話をしました。今後にお役立ていただけましたら幸いです。

(担当:斉藤 万幾子