大阪のホームページ制作会社 株式会社TREVO
                   
スタッフブログ

ホームページ制作(ウェブ制作)で考える青色の効果と意味

2021.03.16.

デザイン

twitter Facebook Pocket LINE はてブ

株式会社TREVOの月額制ホームページ制作サービス
PR

20150110ウェブデザインをする時にはメインのカラーを軸に考えて制作をします。
前回は、黄色について書いたので今回は、冷たさ、涼しさ、信頼するポジティブイメージや逆に、悲しみ、寂しさといったを連想させる青色について書いていきます。
この記事は【2015年1月10日】の記事をリライトしています。

h2>青色とはどんな色?

・カラーコード → 青色(原色)
RGB | R0 G0 B255
HTML COLOR(HEX) | #0000FF

RGB「光」としての青は知覚できても、CMYK「色」としての青は今も昔も非常に珍しいものです。昔は特に、直に触れられるとなると大変貴重なものでした。
実際、芸術家が絵画に使用した青色の絵の具は金よりも入手困難な希少価値の高い物でした。「海を越えた色」という名を持つ「ウルトラマリン」の原料は、宝石であるラピスラズリです。
17世紀のヨーロッパ、ラピスラズリをアフガニスタンからの輸入でしか手に入れることができなかったところから、その名前がきています。有名な絵画では、フェルメールの『真珠の耳飾りの少女』ですね。真珠の耳飾りというタイトルとは裏腹に、青色のターバンがとても印象的な作品です。

青色が使われているもの

実際に使用されているものを「人工物」と「自然物」に分けてみてみましょう。

人工物

  • スーツや制服
  • 国連の旗
  • 信号機(安全)
  • 中世ヨーロッパの絵画

青色は冷たさ以外に信頼や誠実といった清潔感を連想させるためスーツや制服等に使われます。また、冷たい印象があり涼しさを連想するため、暑い季節に、涼しさを表現したいときには効果的です。

自然物

  • 地球
  • 鳥類
  • 昆虫類
  • 両生類
  • 果物(ブルーベリー)

自然界には青の食べ物が希少なため、飲食のサイトではあまり利用されません。
ただ、さっぱりした爽快感のあるため清涼飲料水や冷たい食べ物などを扱う場合には青色は効果的です。

青色がもつ一般的な印象

  • 信頼
  • 清潔
  • 誠実
  • 平和
  • 寂しさ
  • 涼しさ
  • 冷たい
  • 幸福
  • 勤勉
  • 誠実

青色は平和や安全を象徴する色で国連の旗や信号機の青色などに使われています。
感情を理性的に抑え心が落ち着く効果があります。

誠実さや平和、勤勉などポジティブな印象も多いですが、青色には孤独や寂しさといった類のネガティブさが印象付けられているようです。
例えば、日本語にも落ち込んでいることをブルーな気分と表現するように、英語でも「feel blue」と「青色」=「悲しみ・落ち込み」と表現しますよね。

ウェブサイトで青色を使う利点

そんな青色でも、ウェブの世界に関していうと抜群に好かれる色であることは間違いありません。アプリやソフトのアイコンにも、青色が使用されているものが沢山ありますよね。その中でも青色を使用する利点を二つ上げてみました。

色覚に異常のあるの人でも認識しやすい

もっとも一般的な色盲のタイプは赤から緑までの範囲を見分けることが困難なため、青色は最も認識しやすい色とされています。東京と福祉保健局の資料「東京都 カラーユニバーサルデザイン ガイドライン」によると、緑を使う時は青みが強い色を使用するなどのガイドラインが設定されています。色覚異常に関しては色相も大きく関係するため、色味だけで見えやすさが変化するわけではありません。しかし、どのような環境化でもユーザーがストレスフルに使用できるデザイン“UIデザイン”が注目される今日では、青色が使用される重要な理由の一つと言えるでしょう。

一般的に好かれている

日本リサーチセンターの行ったサイバーパネルレポートによると、1万人超の参加者が選んだ最も好きな色は青色でした。「赤、緑、青、黄、茶、橙、紫の7色の中で、一番好きな色はどれか?(選ぶ色は一つだけ)」という質問に対し約4割が青色を選びました。
参加者の年齢層が比較的高めであったことなども要因の一つですが、この結果から企業のコーポレートサイトに青色が多く使用されることも納得がいきますね。

まとめ

ウェブサイトで使用する際には、幾ら安心感をあたえたいからとはいえ、青色ばかり使用しすぎると単調で印象が薄いサイトになっていまいます。どの色にも言えることですが、過ぎたるは及ばざるがごとしという事で、何事もバランスが重要となるでしょう。
青色をメインカラーに選んだ際は、アクセントカラーとしてオレンジなどの暖色系をボタンや目立たせたい箇所に使用してみましょう。きっと、ユーザーの印象に残るウェブサイトを作成できるに違いありません。
トーンについては「ウェブサイトでの色遣いについて」を参考にしてください
黄色についての記事はこちら

自然物には貴重な色でも、光の世界では物体に最も反射しやすい色、青…。自然から色としての青を手にすることは難しいとしながらも、ガガーリン言葉にもあるように我々の住む地球は青色に光り輝いているという、なんとも神秘的な話です。
こういったことからも、青には「広大さ」「包まれるような安心感」などの印象を得られるのかもしれませんね。
色と心理を掘り下げると沢山の面白い発見に出会えそうです。

経歴: 3DCG制作の専門学校を卒業後、デザイン会社に就職。デザイン会社では主にWEB制作を担当し、旅館の予約システムや商店街にWEBカメラを設置したプロモーション等を展開し、4年後に転職。 株式会社TREVOでデザイン、コーディング、ディレクション、システム開発を担当

twitter Facebook Pocket LINE はてブ
                   

関連の記事