テキストリンクのhover効果についてのお話

正しいテキストリンク

ホームページの中に必ずあるテキストリンク。
そのテキストリンクにマウスを重ねると、色が変わったり、下線が出たり消えたりするのを知っていると思います。

ではコレに最適のものはあるのでしょうか？
どんなテキストリンクがもっとも使いやすいのでしょうか？

とりあえず有名なサイトを見てみましょう。

その1：Amazonの場合

通常時は青色の文字です。
マウスを乗せるとオレンジ色に変わり、下線が表示されます。
テキストリンク以外の文字の色はほとんど黒です。

その2：mixiの場合

通常時は青色の文字です。 マウスを乗せるとオレンジ色に変わり、下線が表示されます。
テキストリンク以外の文字の色はほとんど黒です。

その3：Twitterの場合

通常時は緑色です。(黄緑色？)
マウスを乗せると、下線が表示されます。 テキストリンク以外の文字の色はほとんど黒です。

その4：YahooJAPANの場合

通常時は青です。 マウスを乗せると下線が表示されます。
テキストリンク以外の文字の色はほとんど黒です。

その5：Youtubeの場合

通常時は青です。 マウスを乗せると下線が表示されます。
テキストリンク以外の文字の色はほとんど黒です。

結果発表

もっとたくさんのデータを記載したかったのですが、5つで勘弁して下さいww

• テキストリンクは他のテキストと区別が着くように色をつけていることが多い。
  
• オンマウス時は下線がでたり色が変わったりする。
  
• テキストリンクは通常時、寒色系が多く、赤、オレンジなどの暖色系は使われていない。 オンマウスになったときは暖色系が多い。
  
• テキストリンクは通常時、下線が出ていることはない。

有名なサイトのテキストリンクの効果の傾向は以上のようになっています。
多くのユーザーが見ているサイトのテキストリンクは、ある程度、ユーザーの記憶に刷り込まれていることが考えられます。

是非、参考にして見てください。

では。

ウェブが成熟するにしたがって、ウェブサイトに共通点が増え、
ユーザー側もそれが当たり前と受け止めるようになっている。
ヤコブ・ニールセン博士