けんだま流

アメリカ、サンフランシスコの留学生の生活

ブログの文字色が黒だと読者にやさしくない!

f:id:kendamaaa:20190112154704p:plain

ブログを始めて少ししたら、誰しもブログのカスタマイズに興味がわくと思います。

僕もそうでした。この時に見つけた読者は気付かないであろうが、読者にやさしいカスタマイズを紹介します。

超細かいことなので、コードも短いですが一応コピペ用ってことで載せておきます。

 

 

多くのブログの背景は白ですよね。そして、文字は黒。

 

ソレダメ!

 

1.背景が白で文字色が黒だと、色のコントラストが強すぎで見ているうちに自然と目が疲れてきます。

 2.背景が白で文字色が黒だと、色のコントラストが強すぎで見ているうちに自然と目が疲れてきます。

 

 なので、真っ黒ではなく、ほんの少しだけ明るくします。とはいっても、ほぼ分らない笑。 

ちなみに、真っ黒はコードで書くと#000000です。 

上の分の1か2のどちらかが真っ黒で、どちらかが少しだけ薄い黒です。凝視すればわかるわ。

色の違いが区別できないのなら、わざわざ文字色変更しなくてもいいやん。ってなると思いますが、これを知ったら「あ、じゃあ変えたほうが良さそうやな。」ってなるはずです。

 

それは、私たちが知っているウェブサービス達は真っ黒の文字なんか使ってない!

 

例を挙げてみます。

このブログを読むために何を使いましたか?Google? Yahoo?

 

Googleの検索結果の色はこの文の色です。って言ってもわからんか。

 コードで表すと、#222です。

 

Yahooの文字色は、#333333です。

 

このブログの親元のはてなブログは、どうでしょうか。

はてなブログは、#242527です。

 

ニュース記事はどうなのか。例として、朝日新聞デジタル・NHKを挙げます。

朝日新聞デジタルは、#0A0A03です。

 

NHKは、#333です。

 

これだけ挙げれば十分だろう。

ご覧の通り、真っ黒である#000000を使っているところはありません。

 

このことによって、あんまり気付かないけど大切だということが分かります。

やっぱり、真っ黒だと無意識のうちにつかれるのだろうか。

 

 

ということで最後に文字色の変更のCSSのコードを書いておこうと思います。

 

body {color:#222;}
 
これだけです。好きな色を #〇〇〇〇〇 って感じで変更して使ってください。
 
これをブログサイトのCSSを書くところに貼り付けたら完成。
 
 
はてなブログだと、デザインのところのココ!に書き込みます。

f:id:kendamaaa:20190112163940j:plain

 
終わり。