wanichan's web tips

Expression Web ユーザー向けにサイト制作のコツと問題解決のヒントを取り上げていきます。

Webサイトのテーマカラーを決める

Webデザインに配慮しないといけないものの一つに配色があります。カラフルな配色とは色数の多さで決められるものではありません。あまり多くの色を使うと雰囲気的に落ち着かなくなってしまいます。

色を構成する要素

まず、色を構成する要素は以下の3つです。

色相
「赤」「青」「黄」などの、一般的に色を区別する色合い
彩度
色の鮮やかさの度合い
(原色の赤・黄・青は彩度が高く、逆にクリーム色、肌色などは彩度が低くなります)
明度
色の明るさの度合い
(最も明るい色は白で、最も暗い色は黒となります。ワインレッドや群青色などは明度の低い色になり、空色やピンク色は明度の高い色となります)

また、色や暖色と寒色、淡い色と鮮やかな色、暗い色と明るい色といった具合にグループがありますよね。

暖色系
f:id:wanichan:20170122124208p:plain
暖かい、優しい
寒色系
f:id:wanichan:20170122124218p:plain
冷たい、クール、理知的
鮮やかな色
f:id:wanichan:20170122124236p:plain
硬質、アクティブ
淡い色
f:id:wanichan:20170122124248p:plain
柔らか、優しい、軽やか
明るい色
f:id:wanichan:20170122124301p:plain
軽やか、ポップなイメージ
暗い色
f:id:wanichan:20170122124314p:plain
重厚、地味、落ち着き

以上をふまえて、発信したい情報にあったカラーテーマを選択します。

基本カラーは3色にとどめる

できるだけ基本カラーは3色にとどめるようにします。3色では少なすぎる、という場合は同系色でまとめるとOKです。ほかの要素を邪魔しない色をベース色にするとよいでしょう。

とりわけ、鮮やかな赤や黄などのビビットカラーはあくまで部分的にアクセント色として使うと効果的です。

とにかく、閲覧者にとっていかにコンテンツを読みやすいものにするか配慮をしていくことが大切です。

参考サイト

最後に、カラーテーマや配色の決定において参考になるサイトを紹介します。