サイトの色を解析してくれる Web Colour Data

ホームページの色を決めるのって難しいんですよね。
見た感じでイメージがつきますし、正解の色というのもないですし….
業界トップのホームページはどんな色使いなんでしょう？

そんなときは（笑）！
ホームページで使われている色を解析してくれるサイトWeb Colour Dataを使ってみてください。
我々のようなデザイン系の仕事をしていると重宝するツールなんですが、先ほどのように自社サイトと他社サイトをそれぞれ色分析して、色の違い、そして色からくるイメージの違いを発見できるかもですよ！

Web Colour Data

ホームページの色を調べてくれるWeb Colour Dataはこんなサイトです。

web colour data
http://webcolourdata.com

使い方

すごく簡単です！
「http://　」となっている部分に調べたいホームページのアドレスを入力（コピペ）し、紫色の「GET COLOURS」のボタンをクリックするだけです。

このブログの色を調べた結果です。

Macで表示させたから？かもしれませんが、ホームページの画像がズレてますね。
それは良しとて、調査結果はいくつかの項目にわけて結果が表示されます。

・Breakdown　→　どの色が何%使われているか
・Hue Distribution　→　色合いの分布図
・Colour Wheel　→　類似色、補色などを位置で見せてくれる色相環
・Websites with Similiar Colours　→　色が似通っているホームページ

です。
このブログは青系、オレンジ系が多いんだなあ。
ほとんどが写真の色だと思いますが…

まとめ

使われている色が良いか悪いかということではなく、同業他社はどんな色使いをしているのか、自社はどうなのか、その色使いは提供しているサービスのイメージ通りかなどを検証するの使うのが良いと思います。
また、あっちもこっちも目立たせたいと思い、むやみに多色使いになっていないかなどもチェックできますよね。

このサイトのトップページにあるPopular Sitesでは、有名サイトの色の調査結果が表示されていますが、どのサイトもほぼ何かの色系統に統一されています。

Pinterestは赤系統、Dropboxはブルー系統、Facebookは濃紺系で統一されています。
Popular Sitesに上がっているホームページはいろんな色をたくさん使ってはいないですよね。多色使いするとブランドカラーやイメージがつきにくくなりますし…、さらにほかにもいろいろあるんでしょうね。
しっかりと研究・検証されているんだなあと感じます。
勉強なります！

実際に、色からくるイメージって大きいんです。
ホームページに訪れたユーザーが理由もなく、なんとなく行動することにプラスに働くのにも、色の力があるかもしれません。現に、お問合せボタン、購入ボタンは緑色が一番クリックされるとかって言われています。

お時間があれば、自社サイト・業界大手サイトを含めて、色の検証などもされてはいかがでしょうか？
貴社ホームページを強化するなんらかヒントが見えてくるかもしれませんよ〜！