真っ黒はダメ?ブログに最適なテキストの色

ブログを書かれている方はWordPressやはてなブログを使用してブログを書いている方がほとんどだと思います。しかし実は今ここに書かれている文字の色っていわゆる真っ黒ではないんです。とういことで今回は、色々なサイト上に表示されている「色を調べる方法」や「ブログに最適なテキストの色」を紹介させていただきます。

文字の色は真っ黒ではダメ?

タイトルにも書かせていただきましたが、テキストの文字の色は真っ黒ではダメなのかということです。答えは『ダメ』です。なぜダメかというと、真っ黒のテキストでは、背景の白色とのコントラストが強すぎて目が疲れるのです。Webサイトというのはたくさんの文字が書いてありますので、それを読むユーザーの目が疲れないように様々な工夫がされています。文字の色を真っ黒にしないのもその一つです。私達が知らない間にそんなところまで気を使われているのは驚きですね。

このことから大手サイトなどでは文字の色は真っ黒ではなく、必ず少しグレーの色を採用しています。しかしサイトによってその色も少し違いますので、今回はそれを調べる方法や、ブログに最適なテキストの色をご紹介します。

色を調べるツール

それではまず最初にweb上に表示されている『色を調べる方法』をご紹介します。こちらの方法はまずGoogleの『Chrome』というwebブラウザを使用する必要があります。Windowsの方はInternet Explorerを使われている方が多いと思いますが、こちらのChromeの方が使い勝手がかなりよいので私はChromeをオススメします。

Chromeのダウンロードページはこちら

そして、Chromeのウェブストアにある『ColorPick Eyedropper』のページへジャンプします。ウェブストアという名前ですが、お金一切はかからないので安心してください。そして画面右手にある『Chromeに追加』というボタンを押します。

上に二択のポップアップ画面が出ますので、『拡張機能を追加』をクリックします。これでインストールは完了です。

画面右上のところに、カラフルなアイコンが現れていると思います。

実際にやってみる

それでは実際に使ってみます。使い方は簡単で、まず先程現れたアイコンをクリックします。するとマウスポインタが十字型のポインタに変わります。そしてそのポインタを自分が調べたい色のところに持っていき、クリックをすると色のコードが現れます。私のサイトで使用しているヘッダーテキストの色を確認します。

この色がいいと思う方是非使ってみてください。私は『#FF93B7』というピンク色を使っています。

大手のサイトのテキストの色は

それでは実際に大手サイトのテキストの色を調べて行きたいと思います。

Google

検索大手サイトの天下のGoogleです。検索結果のタイトルなどは青っぽい色で表示されますが、内容の部分は『#545454』で表示されます。

Googleの場合はサイトのタイトルの青字を読んでもらうために、あえて内容の文字の部分は薄くしているのではないかと思います。今回紹介するサイトでは一番薄い色を採用しています。

Yahoo Japan

日本ではGoogleに次ぐ検索サイトで、ニュースやヤフオクなどのサービスを提供する総合型Webサイトです。やはりYahooといえばYahooニュースが一番に思いつくという方が多いのでは無いでしょうか。Yahooニュースで採用されている色のコードは『#333333』でした。

Amazon

国内で一番売上が高い大手の通販サイトAmazonです。こちらで採用されている色は『#111111』です。

Amazonは通販サイトなので、そこまで文章を読み込む必要がないので、濃いめの色に設定しているのだと思います。これまでご紹介した中で一番濃い色です。

色を比較

ちなみに真っ黒は『#000000』です。今回ご紹介した色を並べてみました。色の違いがよくわかっていただけると思います。

真っ黒 Amazon Yahoo Google

色を変更

そして今回のテーマであるブログに最適な色についてですが、極論を言えば一番は運営者の『好みの色』ということになります。しかし私としては、本日ご紹介したサイトの『Yahoo ニュース』に採用されている『#333333』をオススメします。なぜならニュースサイトというのは、一度に多くの記事を読んでもらうために、そのサイトの運営の方が日夜研究をして、たどり着いた答えがそこにあるからです。

ブログというのは基本的にたくさんの文字を読んでもらうものです。私は自分の記事を多くの方に、「薄すぎて読みにくくないように」「濃すぎて目が疲れないように」読んでもらいたいという考えからYahooニュースと同じ色を使っています。

ストークでの変更方法

私が使用しているWordPressのテーマ『ストーク』では、デフォルトのテキスト色は『#3e3e3e』が採用されています。こちらのグレー色でもオッケーなのですが私は少し薄く感じてしまったので『#333333』に変えました。ストークでの変更方法はダッシュボードメニューの『外観』→『カスタマイズ』→『サイトカラー設定』→『メインテキスト』の順番で、とっても簡単に文字色を変えられます。

そして、ストークは他にも『吹き出し』や『ボタン』などのショートコードが簡単に使えてとっても便利で、ブログを書かれる方にはとってもオススメのテーマになっています。是非こちらからチェックしてみてください。


おわりに

私達が何気なく見ていたWebサイトにこれだけ工夫がされていたのは驚きでした。ぜひとも文字の色を変えて、読者の方の目を疲れさせないようにしましょう。最後までお読みくださりありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です