見出し画像

【未経験からデザイナーになるために】色を効果的に使いこなそう(白・黒・グレー編)

こんにちは、むぎです。
最近はねこのかぎしっぽでの業務でLPやwebサイト制作に追われています~~。
追われているといっても、作るのが楽しいので毎日わくわくしながら業務しています。笑
制作するものは今後も尽きそうにないので、いいデザインとは何かを考えながら形にする方法を模索していきたいと思います。
webサイト等完成したらお伝えしますので、是非見てみてくださいね。
特に猫の飼い主様は必見です!!

さて、先週から色の印象についてお話してきました。
( まだ見てない方はぜひこちらの記事をご覧くださいね
色を効果的に使いこなそう(赤・青・黄色編) )
先日twitterでも「黒は#000000では使わない!!」みたいな話題が上がっていました。白黒はwebサイトを作る上で欠かせない色でありベースカラーフォントカラーとして使われることが非常に多いです。
今日はそんな白黒、そしてグレーの与える印象についてお話していきます。

(1)白

◎純粋、清潔、神聖、正義
△空虚、無

webサイトのベースカラー(もっとも面積の多い色、背景に当たる部分)に非常によく使われます。高級感や清潔感を伝えたいときに余白を増やせと言われるのは、ゆったりとした視線の動きを持たせるためという理由のほかに、背景色の面積を増やすことも理由の一つかもしれませんね。
また、清潔感が大切な医療関係の会社のサイトを見てみるとおそらくほとんどのサイトのベースカラーが白だと思います。よかったら確認してみてくださいね。
逆に言うと、白以外にしているwebサイトはその色をベースカラーにすることでどんな印象を与えることを狙っているのか、考えてみるのも勉強になると思いますよ。

(2)黒

◎高級感、重厚感、威厳
△恐怖、絶望、不吉、悪、死

こちらも白よりは少ないですがwebサイトのベースカラーに選ばれることがある色ですね。
高級感を伝えたい会社は確かに黒を使っているところが多いと思います。
黒字に白の文字を置くことで締まった印象が与えられますね。
黒は明るい色とセットで使われることがほとんどだと思います。黒・金や黒・オレンジという組み合わせも割と見かける印象です。
黒・黄色は危険色(踏切でも使われてますね)なので、目立ちますが使っているサイトがあるのか、少し気になります。使われてる場合は黒と黄色の配色のバランス等も見てみると面白そうですね。
黒は明るめの色と合うので、黒ベースに作っているサイトを探してみるのも面白いと思います。

(3)グレー

◎落ち着き、大人、真面目
△抑うつ、迷い、不信

グレーもwebサイトでは非常によく使われる色です。
メインカラーとして、ベースの次に多い割合で使われることも少なくありません。
落ち着きという印象を利用して、高級感のあるサイトを作るときにはよく使われる色です。
また、footerなどコンテンツよりは目立たせたくない場所に使われることもあります。
グレーにも色々なグレーがあります。明度の違いだったり、別の色を少しだけ混ぜてみたり…。webサイトで使うグレーは、色をサイトになじみやすくするために、使用される他の色を混ぜたグレーであることも多々あります。
気になる方は、webサイトを見てみるときに使われている色を拡張機能などで調べてみてくださいね。

さて、ここまでお付き合いいただきありがとうございました。
気になる色は拡張機能を使って調べてみると、どんどん色の知識が付くと思います!
私は「ColorPick Eyedropper」を使っています。よかったら探してみてくださいね。
他の色に関してはまた次回以降にお伝えしていこうと思います。

今日もみなさんにとって素敵な一日になりますように!!
わたしもねこのかぎしっぽでサイト制作を頑張ります!
それではまた来週~~。

この記事が気に入ったらサポートをしてみませんか?