【ブログ】文字色はどの黒(グレー)が良い?各黒色コードの比較まとめ

ブログの文字の色はどの黒がいい?

ブログのカスタマイズに日々時間を取られていく一方…。

そんなあなたが必ずたどり着くであろう、「文字の色は真っ黒じゃだめだよね?どれくらいの濃さが1番いいのかな?」という疑問。

(背景白と真っ黒の文字ではコントラストが強すぎてチカチカする)

僕も色々ためしてみました。(執筆時の文字色は#444)

大手サイトや自分で比較した内容を記載するので、参考にしていただければ。

色一つでずっと悩んでられる…!

文字に使われる黒色(グレー)の比較

一般的によく使われる黒~濃いグレーくらいの文字を比較してみました。

大手サイトの文字の色比較

まず、大手サイトはどんな色を使っているかを調べると、

サイト色コード
Googleの検索結果#545454
楽天#333333
Yahoo!JAPAN#333333
アメブロ#444444
日経経済新聞#333333

という感じ。

あたり前ですが、真っ黒を使っているサイトは一つもありません。

日本のサイトでは#333が多く使われているな。

ブログのテーマの文字色の比較

WordPressのテーマによっても、それぞれ文字色によって個性が出ています。

テーマ色コード
SANGO#252525
JIN#555555
COCOON#333333
ストーク#545B63
SONIC#333333

テーマによってもこれだけ違うのか。

黒色コードによる読みやすさの比較

黒の各コードとサイトとテーマで使われている文字色をまとめて表示してみます。

背景はほとんどのサイトとブログが白なのでそのままです。

黒色コードによる比較まとめ

  • 黒コード #000000:真っ黒

  • 黒コード #111111

  • 黒コード #222222

  • 黒コード #252525:SANGO

  • 黒コード #333333:楽天、Yahoo、COCOON、SONIC

  • 黒コード #444444:アメブロ

  • 黒コード #545B63:ストーク

  • 黒コード #545454:Google

  • 黒コード #555555:JIN

  • 黒コード #666666

  • 黒コード #777777

  • 黒コード #888888

こうして見てみると、文字の色一つを取っても、かなり違いがあるのが分かります。

どれが好き?

文字の色についての注意

文字の色での読みやすさは、文字の大きさや太さによっても、かなり印象が変わります。

自分のサイトやブログなどで実際に試して確認してみてください。

また、PCかスマホなど、ディスプレイによっても結構差を感じるので、最も大切にしたいユーザーにとって読みやすいものを選択するのがおすすめです。

まとめ

自分のブログの雰囲気や好みによって、好きな黒を設定しましょう。

グレーに近づくと優しいイメージ、黒に近づくとはっきりとしたイメージになります。

文字色を設定できたのであれば、真っ黒のままよりかは間違いなく読みやすくなっているはずです。

ブログの滞在時間も変わるとか言われてるしね。

コメントを残す