Webふぉれすと
Web制作、Webデザインのスキルアップに役立つ情報をお届けします!
みんなが癒され、元気になるWebを目指します。
サイトマップはこちら
PI-chicc,PA-chicc
うぇぶ実験室
ふぉれすとCafe
NANAKORO*BEANS
くりっくりんく
イベント・セミナーを探せ!
ふぉれすとかわらばん
がしがし通信
今日のスタッフ
スタッフプロフィール
ご意見ご感想フォーム
トップページにもどる
Webふぉれすとトップ > うぇぶ実験室

元気なイメージの配色を考えてみよう

犬の画像を利用して、ページを作成してみる。枠などの配色を変えて、どのように印象が変わるかを見る。
※実験ページはCSSを利用しているので、Netscape Navigator4.Xでは表示がうまくいっていない部分があります。


【実験1】暖色系の色と寒色系の色で試してみる。
暖色系:(#FF0000)と寒色系:(#21ABCD)で試してみる。
リンクの色・犬の足跡の画像ともに「#FF0000」を指定。マウスがリンクのところに来たときの色は「#F98300」を指定(環境によっては再現されない場合あり)。
実際のページ

リンクの色・犬の足跡の画像ともに「#21ABCD」を指定。マウスがリンクのところに来たときの色は「#92D6E6」を指定(環境によっては再現されない場合あり)。
実際のページ

▼暖色系:(#FF0000)を指定すると、元気というより、刺激が強いという印象になってしまった。でも、素材やデザインの仕方によってはこちらの色も有効に使えるかもしれないと思った。
寒色系:ためしに、(#21ABCD)にしてみると、元気そうというよりはさっぱりした感じになってしまった。青系の色は静的なイメージがあるので、元気なイメージとは結びつきにくいようだ。

【実験2】配色を黄色系にしてみる。
リンクの色・犬の足跡の画像ともに「#F4D400」を指定。マウスがリンクのところに来たときの色は「#F98300」を指定(環境によっては再現されない場合あり)。
実際のページ

▼元気なイメージということで、太陽などを連想させるようなの黄色系の色を使ってみた。
(#FBFD01)でもよかったのだが、写真の背景とのバランスを考えて、(#F4D400)を指定してみた。
個人的な好みや写真との相性にも影響されるのかもしれないが、この場合は(#F4D400)の方がいいように思った。
前のページへ
うぇぶ実験室トップ
続きを読む

Copyright(c)2002-2004 Step-First All rights reserved. [About WebForest]
E-Mail:webforest@step-first.com