東京都新宿区のWeb制作会社 - ウェブラボ株式会社

スタッフブログ

リンクテキストの色はどうして青?

2023.01.05 Posted by

Webサイトのリンクテキストには青が使われている場合が多いですが、なぜ他の色ではなく青なのでしょうか?実はリンクテキストが青色なのには、いくつか明確な理由があります。

 

今回は、なぜリンクテキストが青色なのか大きな3つの理由について解説していきます。

リンクテキストの色で売上が変わる?!

Googleが2012年に行った実験で、リンクテキストの色の違いによってクリック率が異なることが判明しました。
その実験は、検索結果の表示画面に50種類以上もの青いリンクテキストを使用し、そのすべてにおいてクリック率を計算するというものです。結果、もっともクリック率が高かった青が現在のGoogle検索のリンクテキストカラーになっています。

 

Bingでも同様の実験を行い、結果に基づいてリンクテキストの色を変更したところ、年間売上が8,000万ドルも上昇しました。売り上げが増加した理由としては、クリック率の上昇があります。つまり、同じ青でも微妙な色の違いによってアクセシビリティが変わってくるということです。

 

次に、なぜ青色が多くのWebサイトで採用されるようになったのか、ひとつずつその理由について考えていきましょう。

【理由1】見慣れているから

Webサイトのリンクテキストが青い理由は、すでに見慣れているというのが大きな理由のひとつです。青色のテキストリンクは、検索結果の画面や、Yahoo!ニュースなど大手ポータルサイトでも使用されていて「リンクテキスト=青」と無意識でも理解できます。

 

つまり、多くの人は青色の文字をクリックすれば、他のページへとアクセスできると直感的に理解できます。逆に、青以外の色の場合、それがクリックできるものであると伝わらない可能性が高くなります。

 

そのため、青色を利用しているからこそ文字装飾ではなくリンクテキストであると自然と伝えられるということです。

【理由2】識別できる人が多い色だから

カラーユニバーサルデザインの観点でも、青色のリンクテキストはユーザーに識別されやすい色であるといえます。カラーユニバーサルデザインとは、色覚が異なる人でも、正しく情報が伝わるように配慮されたデザインのことをいい、カラーバリアフリーと呼ぶこともあります。

 

例えば赤系の色や緑系の色を見分け辛いP型色覚やD型色覚のユーザーでも青色は識別することができます。一説では色覚異常は男性の20人に一人の割合で存在するというデータがあり、決して少数のユーザーの問題ではありません。そのため、Webサイトをデザインする場合は、カラーユニバーサルデザインの観点から色を慎重に選ぶ必要があります。

 

もし、カラーユニバーサルデザインについて今以上に知ってみたいという場合は、弊社Webサイトのカラーユニバーサルデザインの記事を参考にしてみてください。

 

Webサイトにおけるカラーユニバーサルデザイン
https://www.weblab.co.jp/blog/creator/7372.html

 

色覚異常の種類について知ることで、青色が多くのユーザーにおいて共通色となる理由がわかるかと思います。青色は、アクセシビリティという観点からも他の色と比べて優位性がある色といえます。

【理由3】落ち着く・集中しやすい色だから

青は心理学的には人間に落ち着きをもたらす、または集中しやすい色といわれています。色と人の心は、非常に密接に関係しています。たとえば、東京大学の青色電灯に関するデータによれば、青色という色は、自殺者を減らすことがわかっています。

 

実際に青色電灯にしたところ、自殺者は84%減り、人間が色の影響を受けていることがわかります。下記は、東京大学で公開されている青色電灯に関するデータです。

 

青色灯設置により、列車への飛び込み自殺が減少
https://www.u-tokyo.ac.jp/focus/ja/press/p01_241009_01.html

 

また、青色は人間の独創性を高め、リラックス効果を生むため、仕事では青色のペンを使うと良いといわれています。そういった点からも青色は、人の心になじむ色として親しまれており、アクセシビリティを高めることにつながっています。

まとめ

Webサイトのリンクテキストは、昔から青色を使っているからなんとなく青色になっているというわけではありません。現状、Googleの研究や心理学などの要素から青色はリンクテキストにおいて、もっともベストな色と考えられています。

 

このほかにも、人間と色は、さまざまな点で密接に関連しているため、もし気になったことがあれば、どのような関連性があってこのような色になっているのだろうかと関心を寄せてみると面白いかもしれません。

オリエンシートダウンロード

採用サイト 絶対に外せない5つのチェックポイント

オリエンシートダウンロード

PAGETOP

お問い合わせContact

まずはお気軽にご相談ください。

Web制作・コンサルティング・システム開発に関するお問い合わせ・お見積もり依頼は、
電話・問い合わせフォームより受け付けております。(受付時間:平日9:30〜18:30)

〒160-0004 東京都新宿区四谷4丁目33-2
マーキュリースクエア4F

TEL:03-5366-3277 FAX:03-5366-3278