ホーム » リンクの色 » リンクの基本1(テキストリンク)

リンクの基本1(テキストリンク)

リンクの色の基本であるテキストリンクの色について学びます。サイトの使いやすさにおいて、最も重要な要素になりますので、しっかりと基本を身につけておきましょう。

テキストによるリンク

文字によるリンクをテキストリンクと言いますが、スタイルシートなどでリンク色を指定しなければ、未訪問のリンクが青、訪問済みのリンクが紫となります。

これは単にデザインの都合によるものではなく、黒や灰色で書かれたリンクされていない文章とリンクを区別するために変えられています。リンクがきちんとリンクであるとわからなければ、見てほしい肝心のページに誘導できない可能性が高まりますので、通常のテキストとテキストリンクをきっちりと分けて表現することが大事です。

リンクにおける下線の役割リンクであるとわかりやすく区別する方法は、主に「下線を付けること」と「色を変えること」となります。下線を外すだけでも、リンクであるとわかりにくくなります。左の図では、「スペクトル色のおける食欲訴求色」という部分のみがリンクとなっており、赤色の文字は強調を示しているのですが、リンクの下線がないため、強調とリンクの差が一目で見てわかりにくくなっています。

デザインや配色に自信がなければ、リンクの下線は取らないようにしてください。

訪問済みのリンクと未訪問のリンク

Googleの検索結果の例Googleなどで検索してもらうとわかりやすいのですが、訪問済みのリンクが紫に変わることで、「このページは既に見たから他のページを見よう」というように使われているのではないでしょうか。

これを自分のサイト内に置き換えてみると、「まだこの商品やページは見ていないので、見てみよう」という風になります。多くの商品が並べられているショップでは、リンクの色を使い分けることで、まだ見られていないページにユーザーを誘導することも可能です。

未訪問のリンクと訪問済みのリンクの色が、同じ色に揃えられていた場合には、前にどのページを見たかわからなくなり、同じページをぐるぐると巡ってしまうことも考えられます。

もちろん同じページを何度も見られるのは悪いことではないのですが、本来見たい商品が使い勝手の悪さによって見られないのは、閲覧者のストレスになります。未訪問と訪問済みの色を分けることによるデメリットは特にありませんので、違う色を指定しておくのが無難でしょう。

どこを押せるのかわからない例また未訪問は青、訪問済みは紫であるという認識が一般的となっています。まったく違う色のリンクはユーザーを混乱させることになるので、青・紫の範囲内でリンク色を選ぶようにしましょう。

関連記事

何かコメントがあればどうぞ

▲このページの先頭に戻る