最適なテキストリンクの色は?

このエントリーをはてなブックマークに追加

サイト内のテキストリンクの色は何色にしているでしょうか?デフォルト色の(#0000ff)にしている人が多いのではないかと思います。

ただ、実際に大手サイトをのぞいて見ると、意外にデフォルト色を使用しているケースは少ないことがわかります。

テキストリンクの色は、そのリンクのクリック率に影響を及ぼす侮れない存在です。Bingが検索結果ページのリンクの色を変更したところ、年間売上高が8000万ドル増加した、という話もあります

そこで、この記事では多くのユーザーが訪れるような大手サイトにおいてどんな色が使われているのか、テキストリンクの色をまとめてみました。



検索エンジン

主要検索エンジンの検索結果画面で使用されているテキストリンクの色です。

google #1111cc  
yahoo! #0000de  
bing #0033cc  
naver #0036d3  
baidu #0000cc  
livedoor #0000ff  
nifty #0022cc  
so-net #0000cc  
excite #0000ff  
goo #0033cc  
biglobe #0000de  
youtube #0033cc  
にこにこ動画 #1111cc  

ここで挙げた検索エンジンは全て青系の色を使用していましたが、デフォルト色を使用しているサイトは少数派でした。

Yahoo!のようにデフォルト色よりも青の要素を減らしたものや、bingのように青の要素を減らして緑の要素を付加したものが一般的なようです。

また、Googleとyoutubeのテキストリンクの色が異なること、Googleとにこにこ動画の色が一緒だったことが印象的でした。

検索エンジン以外

次に、検索エンジン以外で有名なサイトを、いくつか取り上げてみました。

Yahoo!トップ #1d3994  
wikipedia #0645ad  
OKWave #1111cc  
はてな #1841ce  
ぐるなび #07519a  
at home #245fbb  
楽天 #0000ff  
リクナビ #0000ff  
ビービット #000099  

青系統の色が使われていることに変わりはありませんが、検索エンジン以上にバラつきが見られます。特に、Yahoo!の場合は、各ジャンルごとのページでも微妙にテキストリンクの色が変わっていました。それぞれのサイトデザインの特徴に合わせて変化させているのだろうと思います。

楽天のようにデフォルト色を使用しているサイトもありましたが、全体からすると少数派のようです。

Q&Aサイトの最大手OKWaveはGoogleと同一でした。また、ユーザビリティといえばビービットさん、ということで調べてみましたが、やや暗めの青を使用していました。ビービットさんのことなので何か意味があるのかもしれません。

クックパッド

クックパッドは、日本最大級のレシピ検索のサイトです。ユーザービリティには細心の注意を払っていて、ユーザー一人当たりの平均PVが高いことでも知られています。

そんなクックパッドですが、サイトをのぞいてみると青系のリンク色がまったく使用されていないことがわかります。これは、青という色が料理というテーマに合わないために、あえて青系の色を外しているためかもしれません。

まとめ

テキストリンクの色についてまとめてみると、

  • 青系統の色が主流
  • デフォルト色を使用しているケースは少ない
  • #1111cc#0033ccといった色が人気

といった傾向を挙げることが出来そうです。

クックパッドの例にみられるように、サイトのテーマによっても変わってきますが、基本的にテキストリンクの色は、#111ccや#0033ccといった青系の色を使用したほうがクリック率は若干でも上がるかもしれません。

このブログについて

「ウェブ力学」は株式会社スリーウィンが運営しています。スリーウィンでは、SEOやホームページ制作を中心としたWebコンサルティングおよびメディア(アルバイト求人)サイトの運営を行っています。すぐに稼ぎたい人におすすめなのが「日払いバイト.jp」です。給与形態が日払いのお仕事を掲載しています。また、家庭教師募集の専門サイト「家庭教師登録センター」では家庭教師の求人情報の他、様々なお役立ち情報を配信中です。

記事の内容はいかがでしたか?よろしければ下記のボタンから共有してみて下さい。
このエントリーをはてなブックマークに追加

2010 年 6 月 21 日 |

カテゴリー:LPO

このページの先頭へ