レイアウトをしてから配色

坂本邦夫 — Thu, 28 Jan 2010 00:58:59 +0000

サイトのデザインをする時にページの上から行うのでなく、どこに何を置くかを考えてから配色します。

これまでは色彩設計を説明するため、便宜上いろいろなサンプルをお見せしてきましたが、皆さんが作っているウェブサイトとはアピールしたいこともメニューの数も違うはずです。

しかしこんな感じにしたいというレイアウトや他のウェブサイトを見て気に入ったデザインなどもあるはずです。またシンプルでものすごくわかりやすいブログのような文章を読ませることを中心としたデザインもあります。

カラーのイメージを中心にアピールするのであれば、それぞれの色を大きな面積に用いることになるでしょうし、テキストを重視するのであれば全体の面積を減らして、白い背景色を中心とした配色になるでしょう。

まずは表示する情報を手書きでもよいので、大雑把に決めてみましょう。重要なことはレイアウトしながら配色していくのではなく、レイアウトをしてから配色すると言うことです。言うまでもないことですが、レイアウトが決まらなければ面積比を考えようがないからです。

あとは読ませたい部分が読みやすいか、自分の伝えたいイメージが伝えられているかを考えながら配色していきます。行き詰まってしまった時は引き算を上手にしてやれば、混乱することもないでしょう。

関連記事：

坂本邦夫の「基礎からわかるホームページの配色」» ワイヤーフレーム