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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

アクセスラボより:
2010 年 6 月 26 日 11:10 PM
この記事を読んで自社サイトのリンクの色をもう一度考えることになりました。

青って料理との相性は確かに良くないですねｗ　カビを連想させてしまうので。さすがクックパッドさん。
石川＠スリーウィンより:
2010 年 6 月 27 日 2:05 PM
> アクセスラボさん
コメントありがとうございます。
テキストリンクの色って、深く考える機会があまりありませんからね。何かのきっかけになれば、幸いです。
suke より:
2010 年 7 月 8 日 5:30 PM
暖色系であれば、新鮮な肉や熟した果実を連想させるけど
寒色系の色はカビの発生や腐敗した食材を連想させるから
食欲減衰すると聞いたことがあります
石川＠スリーウィンより:
2010 年 7 月 9 日 7:29 AM
> sukeさん
情報ありがとうございます。
Webサイト上でこういったことを考慮しながら、テキストの色を決定しているケースはあまり見かけたことがなかったので、とても新鮮に感じました。

ウェブ力学