Webサイト作成での色、白は単色でも、黒は選ぼう

2021年10月23日

Webサイトの作成で、白と黒の使い方は考えるところです。

どちらも使いやすい色です。
ただ、白の場合は単色の#fffを多めに使い、黒の場合は、#000のような強めは避けるように使います。

黒はサイトの雰囲気に合わせて色味の強さを変更していくと、サイトの雰囲気が出せるようになります。

*黒でも単色の黒ではなく

白のバリエーション

白の場合は、一般的には白をそのまま使うことが多いです。

コードでいうと#fff。
こちらの四角の中が#fffです。

#fff

では、#FDFDFB辺りにして、ちょっと色をつけます。

#FDFDFB

ほとんど白ですよね。

＃FBFDFFとしても同様です。

#FBFDFF

もう少し色味をつけようとすると、別の色と認識されます。
例えば、F8F5E3くらいにしてみると、

#F8F5E3

これだと白からはかけ離れます。
経験則を他の方に聞いても、#fffがよく使われます。

黒の場合は、白とは異なり、バリエーションをよく使います。

単なる黒の場合の色は#000ですね。

#000

この色ははっきり見えますが、機械的です。
目にもきつめです。

#404040ですれば、黒ですが、もっと薄めです。

#404040

#0D0D0Dですれば、それがもっと黒くなります。

#0D0D0D

比べてみると#000はかなりどぎついです。
繰り返しですが、#000は機械的な雰囲気を漂わせます。

なんとなくのつもりで、#000を指定するとプログラミングとしては指定できても、いい色ではないなとよく感じます。

プレゼンなどで何をつくるときも同様です。
単純に一番黒い#000は使うべきではないでしょう。

よく使う色の白と黒。

白もたくさんありますが、#fffで使うことが多いです。
それで事足ります。

逆に黒は、ちゃんと指定をしていきましょう。
#000を使うとどぎついです。

文字色を指定するときも#000ではなく、一段回か二段階下げた色調を使う方がやわらかくなります。

黒の色指定をしているのに、なんとなく気に入らないときは、少し変えてみましょう
比較になったらうれしいです。

【編集後記】
年度末にさしかかると道路工事が増えます。
残念ながらひっかかってしまい、かなり通過に時間がかかりました。

【運動記録】
ストレッチ○　筋トレ○

【子育て日記(4歳・0歳)】
一緒にお買い物。
そろそろクリスマスのプレゼントになにがいいかの候補を考えたいなと。

ただ、早めに買うと2回買うことになるので、注意が必要ですが。。