自宅(在宅)でバイトしませんか?ネット環境さえあれば誰でも出来るお得なバイトでお小遣稼ぎができちゃうんです\(*T▽T*)/

 勝手気ままな体験談レポート  HP運営

 ホームページの色彩学 その2

ネットでバイト作戦!

学費をネットで稼ぐ!

 HomeHPの色彩学 その2 

 サイトマップ

 HPはただ作れば良いというものではありません。その後の運営方法が大きな要因をしめます。そこで、この項目では管理人運営している「ネットでバイト作戦」の運営日記を記録していこうと思います。

 また、このレポートを通して、皆様がHP制作に興味を持っていただけたり、ここでの内容が皆様のHP運営に反映し、役に立てれば幸いです。

 

HP運営 メニュー

 たいした根拠も無いので軽く流して読んでやってください。何かの役に立てれば幸いです
 
1 色相環 3 補色
2 近似色(類似色)と暖色、寒色 4 色彩学を用いた制作テクニック
 

 前回のレポートで「色」についての基本的なことについて説明しましたが、今回はもう少し深い内容についてレポートしていきたいと思います。

 色の三属性の項目で説明した「色相」ですが、実際は下に示す「色相環」によって表現されます。

 

図1 色相環

 

赤→橙→黄→黄緑→緑→青緑→青→青紫→紫→赤紫という流れがぐるりと一周しているものです。これにより、それぞれどの色がどの色相に属しているかを知る事が出来ます。

 

 

 色相環はその名の通り、環(円)ですので、各色の両隣には必ず別の色があります。この隣り合わせになる色を近似色(類似色)と言い、互いに色の調和を深めるものです。

 図2と3は赤系(暖色系)の近似色と青系(寒色系)の近似色を強調したものです。

図2 暖色 図3 寒色

 

このように強調してみると、互いの色がより鮮明になるのがわかります。この考えをホームページ上のデザインとして取り入れるとどうなるでしょう?図4と5は同じ図形を使っていますが、色をそれぞれ暖色系と寒色系で分けてみました。

図4 暖色 図5 寒色

 

 暖色で塗られた図形は暖かく、情熱的なイメージになっているのに対し、寒色で塗られた図形は冷たく、クールなイメージとなっています。また、近似色を使うことにより、色の調和が取れて、よりそれぞれのイメージが強くなっているのが見て取れると思います。

 このように近似色を用いて配色することで、簡単にイメージを強くする事やページ全体に統一感を与える事が出来ると思います。

 

 

 補色とは色相環上で対向位置にある色同士のことを指します。(図6参照)

図6 補色 図7 補色

 

このような関係にある2つの色は、並べると互いに影響し合い、彩度が高くなり、より鮮やかに見えるという特徴があります。そこで両者の色を並べて物が図7です。これで両者がより鮮やかとなり、強調されました。が、もう少し強調させるために下のような操作を施してみます。

図8 青対黄 図9 黄対青

 

同じ面積だった図7に対して、比較する色の面積に差を持たせてみました。すると小さい面積の色がより強調されてきます。しかし、これでもデザイン的には単調すぎます。そこで両者の色に濃淡を付けてみます。

図10 濃淡つき青対黄 図11 濃淡つき黄対青

 

背景色となる色を淡くしてみました。そうすることにより、より鮮やかさがました印象を受けます。また、同配色で文章を載せてみました。図10は文字が青なので見やすく、はっきりした感じになり、逆に図11では黄色の文字が浮き上がった感じとなっていますが長時間読んだり、長い文章であったりすると目が疲れてしまいそうです。

 

 

 以上、いろいろと検証してきましたが、実際にホームページ制作上に使えるテクニックについて考えていこうと思います。

 まず、近似色の点から

ホームページの趣旨やイメージとマッチするメインのカラーを決め、その色の近似色でページ全体を彩ることにより、ページの色味がハッキリとし統一したイメージを得る事が出来る。

 次に、補色の点から

補色を用いて強調したい色はピンポイントで少ない面積で用いたほうが効果的である。

背景が淡く、文字が濃いとより強調した配色となる。また、長い文章を書く際には文字の色を重たい色としたほうが目が疲れず読みやすいイメージとなり、項目など要所で用いる文字は明るい色で浮き上がらせるとよりインパクトを与える事が出来る。

以上の点と、前回のレポートの「ハイパーリンク」と「読ませるホームページ」の項目を合わせて考慮した配色が理想だと思います。

 重たい色はどうしても見ていて不快に感じたり、疲れるものです。ですが、軽い色ばかりで構成してしまうとインパクトが無くなり、どこが重要なのかぼやけてしまいます。ホームページにとって最も大切なのは情報の提供です。これを上手に伝えるためにもメリハリのある配色が理想だと思います。

 
 あとがき …のようなもの 

 前回に引き続き、色に関してのレポートでした。まぁ、前回よりは突っ込んだ内容になっています。

 前回、今回といろいろ調べながらレポートを書いたのですが、「あぁ〜、そういえば昔、美術の時間に習ったなぁ〜」って事がたくさん出てきました。ですから、みなさんもどっかで聞いたことのある内容だったのではないでしょうか?

 そんなわけで、勝手なレポートも7作目となりました。やはり私にはこういった感じで体験談をいくつも載せていくほうが性に合っているような気がします。ネットでのバイトを紹介するだけですと、他のサイトさんと比べて劣る点が多々ありますし(ーー;) 「ネットでバイト作戦」ならではのカタチを取っていかないといけないような気がしてるんですわ!

 次回以降はもう少しカテゴリー別に分けての体験談や感想を掲載してくつもりですので、今後ともよろしくお願いいたします<(_ _)>

2004.8.5

 

 

 
SEO [PR]  ローン比較 再就職支援 バレンタイン 無料レンタルサーバー SEO