気になるブログの色やフォントを調べる簡単な方法

ネコロス（@youyakuya）です。

他の人のブログを見て、「うわぁ、スゴイ見やすい！」と思うことってありますよね。

使っているテーマが違えば当然見た目も変わってはくるものの、「色使い｜フォントサイズ｜フォントの種類」をリサーチすると、あなたのブログに手をいれるときの参考になりますよ。

今回は、オススメのリサーチ方法をご紹介します。

色使いを調べる！ColorPick Eyedropper

最初にご紹介するのは「ColorPick Eyedropper」。

GoogleChromeのプラグイン（拡張機能）で、色を調べることができるんです。

使い方は簡単です。

インストールしたら右上にアイコンが出てきますので、そこをクリックして起動。

あとは、気になる色の上にかぶせると、色番号を表示してくれます。

クリックするとその色番号をコピーすることも出来て大変便利。

ただし、画像の色を調べる場合は、一見同じ色に見えても場所によって色番号が異なってきます。

おそらく圧縮をかけたりした時にピクセル単位で色が変わってしまうことが原因と考えられます。

というわけで画像の色は参考程度になってしまいますが、ブログで使っている見出しの色や縁取りの色などを調べるときに便利ですよ。

フォントの大きさや種類を調べる！WhatFont

次にご紹介するのもGoogle chromeのプラグインです。

「WhatFont」があれば、気になるフォントやサイズの色を調べることができますよ。

基本的にGoogleの推奨サイズ「フォントサイズ16px、行間1.2em」にしておけば問題はないと思いますが、「このブログ読みやすいなぁ・・・なんでだろう」と思った時に使えます。

こちらも使い方は簡単です。

インストールしたら起動して、気になるところをドラッグするだけで、どんなフォントなのかとかフォントサイズや色までわかってしまいます。

ちなみに、はてなブログで常に上位の人気テーマ「Minimalism」などは、基本のフォントサイズが15px。

Googleのモバイルフレンドリーの定義が16pxなので、そのままだと「No mobilefriendly！」とマイナス評価になるかもしれません。気になる方は、是非16px以上にしておくといいと思います。

まとめ

この２つのプラグインは、一度使ってしまうとそんなに使う頻度はないかもしれません。

ですが、「こういうものがある」と知っておくと大変便利です。

私は色彩検定の２級をもっているのですが、「色と心理」というのは密接なつながりをもっています。

赤系は「意欲的・挑発的」、青系だと「信頼感」、緑系だと「ナチュラル」という風に、相手に与える印象がまるで変わってきます。

これは、リンクボタンのクリック率をあげる上でのヒントにもなります。

また、同じ赤でも、「濃い赤」と「やわらかい赤」では与える印象が異なってきますので、なかなか奥深いものがあります。

有名なブログや大手企業のポータルサイトがどんな色を使っているのか調べるのみ参考になりますので、ぜひ使ってみてくださいね。