クリック率の高いテキストリンクの色は?【2013年版】
2010年6月に「最適なテキストリンクの色は?」という記事を書きました。有名サイトのテキストリンクはどんな色が使われているのかを調査した内容だったのですが、あれから約2年半が経過して各サイトのリンクの色にも変化が出てきているようなので、改めて調査してみました。
検索エンジン
主要検索エンジンの検索結果画面で使用されているテキストリンクの色です。
2010年6月 | 2013年1月 | |||
#1111cc | #1122cc | |||
Yahoo! | #0000de | #0e1bbb | ||
Bing | #0033cc | #0044cc | ||
NAVER | #0036d3 | #1546c3 | ||
Baidu | #0000cc | #0000cc | ||
livedoor | #0000ff | #1546c3 | ||
nifty | #0022cc | #0e1bbb | ||
So-net | #0000cc | #0000cc | ||
Excite | #0000ff | #1122cc | ||
goo | #0033cc | #0033cc | ||
BIGLOBE | #0000de | #0000de | ||
YouTube | #0033cc | #438bc5 | ||
にこにこ動画 | #1111cc | #596979 |
検索エンジン以外
次に、検索エンジン以外で有名なサイトを、いくつか取り上げてみました。
2010年6月 | 2013年1月 | |||
Yahoo!トップ | #1d3994 | #1d3994 | ||
wikipedia | #0645ad | #0645ad | ||
OKWave | #1111cc | #1111cc | ||
はてブ | #1841ce | #303030 | ||
ぐるなび | #07519a | #07519a | ||
at home | #245fbb | #005ead | ||
楽天 | #0000ff | #1d54a7 | ||
ビービット | #000099 | #223355 | ||
アットコスメ | #068681 | |||
クックパッド | #889b00 |
前回との比較
前回の調査から2年半が経過している訳ですが、今回調べた中でリンクのデフォルト色を使っているサイトはありませんでした。リンクの色はデフォルト色より、やや弱い青色にするというのが浸透してきたように感じます。
NAVERとlivedoorのリンク色が同じになっていたのは経営統合の影響でしょうか。
また、「はてブ」や「にこにこ動画」のように青系でない色を使っているサイトもありました。はてブはリニューアルによって大きく変わったのですが、リンクの色を黒色ベースにしていたんですね。調べるまで気づきませんでした。
最適なリンクの色は?
「リンクは青色」という認識は多くのユーザーに浸透しているので、一般的には青色をベースにするのが無難と言えます。具体的にはデフォルト色だと少し青が強すぎるので、やや”青”を弱くした色がいいでしょう。
但し、サイトのジャンルによっては青色を避けるというのも一つの選択肢です。前回の調査のときも取り上げましたが、クックパッドのテキストリンクの色は緑系のものが使われています。食欲を抑制すると言われる青色を避けているためだと思われます。
ただそうは言っても、リンクの色に青系以外を使う場合にはユーザーがきちんとリンクであることを認識出来るように十分な配慮が必要となるでしょう。どんなにデザインが綺麗になったとしてもユーザーを迷わせてしまっては意味がありませんから。
このブログについて
「ウェブ力学」は株式会社スリーウィンが運営しています。スリーウィンでは、アルバイト求人情報サイトの運営を行っています。「家庭教師バイト登録センター」では家庭教師の一括登録が可能。家庭教師は大学生はもちろん、既卒者や主婦もOKの高収入アルバイトです。まずは登録だけしておいても構いません。
記事の内容はいかがでしたか?よろしければ下記のボタンから共有してみて下さい。
Tweet
2013 年 1 月 28 日 |
カテゴリー:LPO