サイトのデザインをする時にページの上から行うのでなく、どこに何を置くかを考えてから配色します。
レイアウトを先にする理由
これまでは色彩設計を説明するため、便宜上いろいろなサンプルをお見せしてきましたが、皆さんが作っているウェブサイトとはアピールしたいこともメニューの数も違うはずです。
しかしこんな感じにしたいというレイアウトや他のウェブサイトを見て気に入ったデザインなどもあるはずです。またシンプルでものすごくわかりやすいブログのような文章を読ませることを中心としたデザインもあります。
カラーのイメージを中心にアピールするのであれば、それぞれの色を大きな面積に用いることになるでしょうし、テキストを重視するのであれば全体の面積を減らして、白い背景色を中心とした配色になるでしょう。
まずは表示する情報を手書きでもよいので、大雑把に決めてみましょう。重要なことはレイアウトしながら配色していくのではなく、レイアウトをしてから配色すると言うことです。言うまでもないことですが、レイアウトが決まらなければ面積比を考えようがないからです。
重要な部分や見せたい部分を考える
あとは読ませたい部分が読みやすいか、自分の伝えたいイメージが伝えられているかを考えながら配色していきます。行き詰まってしまった時は引き算を上手にしてやれば、混乱することもないでしょう。
Webプロフェッショナルのための黄金則 Web配色デザインのセオリー
効果的に伝えるWeb配色標準デザインガイド―ユーザビリティ/アクセシビリティ/マーケティングを考慮したサイトの色彩設計から配色の実際まで