ホームページ制作（ウェブ制作）で考える赤色の効果と意味

赤色は情熱の赤などと言われるように、エネルギッシュで活発なアクティブなイメージが浮かびます。
赤色はいろんな色の中でも、最も目が引きやすく視覚に訴える力がありインパクトを与えることが出来ます。
ホームページ制作をする場合に赤色はどのような効果があるかまとめてみました。

赤色とはどんな色？

カラーコード → 赤色（原色）
RGB | R255 G0 B0
HTML COLOR(HEX) | #FF0000

赤色が使われているもの

人工物

・信号の赤
・消防車
・ブレーキランプ
・パトランプ
・ヘルプマーク
・赤十字マーク
・日本の国旗（日の丸）

自然物

・花
・毒を持つ生物（爬虫類など）
・辛いもの（唐辛子、タバスコ等）
・熟したもの（トマトやリンゴ等）
・太陽（日本特有/ヨーロッパなどは黄色で表現することが多い）

赤色がもつ一般的な印象

・積極的
・行動的
・力強さ
・怒り
・刺激
・生命力
・注意や危険
・爆発
・派手
・残酷
・緊張
・愛
・愛情
・革命
・活気

企業のロゴは赤色が使われる事が多い

赤色は非常に目につきやすく視覚に訴える力が強い色で自然と注目してしまいます。
そのため企業ロゴに使わることが多く特に食欲を促進する色でもあるので飲食店、ファーストフード店のロゴに使われることが多いです。
日本の企業が採用するロゴの色は赤が一番多いとも言われています。

赤は戦い、闘志を高める

赤色には緊張と興奮を高める作用がありアドレナリンの分泌を促進させます。
スポーツの世界では赤いユニフォームを着用したチームの勝率が高くなるとの検証結果もあります。
また、人に無意識に「恐怖心」「危険」を与える色とも言われています。
選手が興奮してアドレナリンが分泌し強くなるのか。それとも相手チームの選手が「恐怖心」「危険」を感じるかしれませんがスポーツのユニフォームで赤色を採用するチームが多いです。

危険、緊張を与える

赤は光の波長が長く目につきやすい色です。注意して欲しい場合や緊急、危険を知らせる場合に使われる事が多いので、信号や緊急車両の赤色灯、消化器、消防車、非常ボタンや標識なら「止まれ」「一時停止」その他、禁止関連の標識に使われます。
車を運転する方ならパトカーの赤色灯を見るとドキッとして緊張感がでて注意をして慎重に運転をすると思います。停止・禁止・危険」に使われことが多く無意識のうちに警戒するよになります。
それだけ赤色は危険察知に直結する色とも言えます。

時間を早く感じさせる

赤い色の暖色系の部屋の中にいる場合と青色の寒色系の部屋の中にいる場合では、体内時計に与える影響が変わります。
赤い色の暖色系の部屋の中にいると時間の経過が早く感じてしまいます。
実際40分しか経過していないのに1時間以上たっていると感じると感じてしまいます。
赤い部屋や空間で待ち合わせをすると時間の経過が早く感じるので相手は長い時間待たせれたと感じてしまうので遅刻をしないようにする注意が必要です。
また、店の回転率を高めたい場合は空間を赤色にすることによって時間を早く感じさせることが出来て、赤色によって活気のある雰囲気を演出することが出来ます。
逆に落ち着いて話などをする場合は寒色系の空間がいいです。

購買意欲を高める色

赤色は価格表記によく使われます。
赤色には「元気」「情熱」「活力」などポジティブなイメージがあり、また、「積極性」や「緊急性」などの購買意欲を高める効果がある色です。
そのため、バーゲンセーや特価価格などのポップやチラシやポスターデザインに使われたりショッピングサイトの購入ボタン色に使われることが多いです。
赤色は人を前向に行動する効果があり、商品のパッケージを赤色に変更しただけで売上げが上がるといった話もあるよに、赤色は人を刺激することによって購買意欲を高めることができる色です。

食品としての赤色

唐辛子、ハバネロ、タバスコといった辛さを表し、茹でたエビ、カニ、トマトパスタなど食欲をそそる食べ物、フルーツの場合はリンゴ、イチゴ、さくらんぼうなど赤は熟した色になり食べごろの色と言えます。
赤色などの暖色系の色は脳の空腹中枢を刺激して食欲を増進する効果がありファーストフード店の店内に採用される場合が多いです。
よく秋は食欲の秋と言われますが紅葉で山々が赤くなりこの時期に収穫する植物は赤色のものが多く食欲を刺激するので、本能で人は赤い食べ物を見ると食欲をそそるようになっていると思います。
逆にダイエットをしたい場合は、青・紫といった寒色系の食材を使うことによって食欲を減退することが出来ます。
自然界に青色の食べ物が少ないため人は青色の食べ物にあまり魅力をかんじることが出来ないと言われています。

生命力の赤

赤色と言って思い浮かべるものは人それぞれだと思いますが、「命」と関連付けて脳裏によぎるものといえば「赤十字マーク」ではないでしょうか。
赤十字のマークは白字に赤色十字が使用されていますが、これは他に誰も使用することのできない特別なマークです。というのもこの赤色十字は「戦地や紛争地で活動する救護員やその施設を攻撃から守るためのマーク」という定義がなされています。一般的には、「病院や医療」などを連想させるものですが、実は違ったのです。
ただし、「命」に関連していることには変わりなく、大変重要なマークであるため、日本でも、赤十字社など定められた組織以外がこのマークを使うことを、「赤十字の標章及び名称等の使用の制限に関する法律」で禁止しています。（白っぽい背景に赤っぽい十字でも違反になります）このように赤は、潜在的に強く直感的な印象を与えることが出来る色なのです。

赤色のマイナスイメージ

活発、生命力、情熱など積極的なプラスのイメージが赤色ですが、反対のマイナスイメージもあります。
短気、攻撃的、目立ちたがりなど積極的なイメージが行き過ぎると負の作用の割合が大きくなってしまいます。
デザインでは高級感がだしづらく、赤を使いすぎると安っぽく軽い感じになりがちになりやすいです。

赤色十字について

赤色と言って思い浮かべるものは人それぞれだと思いますが、「命」と関連付けて脳裏によぎるものといえば「赤十字マーク」ではないでしょうか。
赤十字のマークは白字に赤色十字が使用されていますが、これは他に誰も使用することのできない特別なマークです。というのもこの赤色十字は「戦地や紛争地で活動する救護員やその施設を攻撃から守るためのマーク」という定義がなされています。一般的には、「病院や医療」などを連想させるものですが、実は違ったのです。
ただし、「命」に関連していることには変わりなく、大変重要なマークであるため、日本でも、赤十字社など定められた組織以外がこのマークを使うことを、「赤十字の標章及び名称等の使用の制限に関する法律」で禁止しています。（白っぽい背景に赤っぽい十字でも違反になります）
このように赤は、潜在的に強く直感的な印象を与えることが出来る色なのです。

ウェブサイトにおける赤色の使いどころ

さて、そんな赤色ですが、インパクトがある色であるからこそ使い方に困ってしますなんていうことも起こりますよね。使い方を間違えると作り手が考えている以上に「メッセージ」や「印象」が誇張されてしまったり、「下品」な印象に受け取られる場合があります。
そんな時は次にあげる3つ使いどころをおさせてみてください。

強いメッセージを与えたい時

赤色はイメージを「直感的に」伝える事ができるので、ユーザーは書かれている言葉だけでなく全体に込められたメッセージをダイレクトに受け取りやすくなると言えます。
特に伝えたいメッセージが「強い」ものであれば、赤色はより効率的に効果を発揮するでしょう。
何より目立ちますし、視覚誘導の認識がしやすくユーザーの記憶に残りやすい色です。
気を付けるべき点は、禁止、危険などの注意を促す時にも多用されていることです。「言葉」と「印象」に誤差があると、赤色を使うことにより「誤差」を強調してしまう場合が考えられます。
高級食材の前に≪品質のよさが取り柄です≫という赤色の「テキスト（文字・言葉）」でメッセージ書かれています。

作り手が伝えたいことはテキストの通り【質の良い商品なので、是非お買い上げください】黒い文字よりも確かに目につきます。では、ユーザーに確実に「品の良さ」を伝えられているでしょうか？赤色そのものの印象が「質の良さ ＜ インパクト」というであるため、テキスト（言葉）と印象に誤差を感じ、かえって「下品さ」や「質の悪さ」を感じてしまうユーザーも少なくないでしょう。
赤色は、直感的なメッセージを与えられる強い色であるがゆえに、付随するテキスト（文字・言葉）の内容を見極めて使用することが重要であると言えます。

購買意欲を刺激したい時

本能を刺激する特性を活かしましょう。イベント、セール・特売時などに、ユーザー（消費者）に行動を起こさせたい場面で使用すると効果的です。
また、刺激の強さに加えて、暖色系の色は空腹中枢が刺激されることから、食欲を増進させる色と言われています。赤色も同様に、強く食欲を刺激する色であることから、飲食・食品サイトなどでよく見かける色ですよね。一般的に使用されている場所が定着しているということは、色から受ける「印象」も同様、世間に根付いていると考えられます。
このような理由から、赤色は購買色と言われています。
バーゲンの時になどに赤を基調にした値札やポスターやチラシを見かけることがよくありますが、これは無意識のうちに購買意欲を高める効果を利用しています。
ウェブサイトでもこの効果をうまく利用しましょう。

緊急性、好機を逃したくないという気持ちを与えたい時

赤色が使用されている人工物を見ても一目瞭然ですが、赤色は何より人の心に「緊急性」や「切迫感」を与えます。前述したバーゲン時に使用する値札の理屈と同様に、今がチャンスだ、この機を逃したくないという気持ちを駆り立てたい時に赤色を使用すると効果的でしょう。

赤色をメイン色に使っているホームページのデザイン

三菱UFJ国際投信株式会社 新卒採用情報サイト

三菱UFJ国際投信の新卒採用情報サイト。
全面にメインカラーである赤色を使い、大きめの白文字のキャッチコピーに目線が引き付けられます。

主な使用カラー

#e50000
#a00
参考サイト：https://www.am.mufg.jp/recruit/

カノデンキ

黒と赤の二色でまとめたシンプルなデザインのサイトですがフォントと写真の使い方で柔らかい雰囲気のサイトに仕上がっています。
デザインからも地域のための町の電気屋さんのWEBサイトだと伝わってきます。

主な使用カラー

#B70000
#222222
参考サイト：https://kanodenki.co.jp/

株式会社真面目

こちらも黒と赤の２色のサイトですが先ほどの柔らかい雰囲気とは違いスッキリしたデザインに仕上がています。
同じ赤と黒の２色のデザインでも見せ方によって印象ががらりと変わります。

主な使用カラー

#f0353c
#3e464a
参考サイト：https://majime.jp/

パイロンPL顆粒

ゴールドとレッドの２種類の商品にパッケージの色とロゴの色を合わせているサイトです。

主な使用カラー

#df0615
#caa845
参考サイト：https://www.shionogi-hc.co.jp/pylon-pl-karyu.html

まとめ

赤色は、「誘目性」「積極性」「緊急性」の三つを兼ね備えた「広告デザイン」に欠かせない色と言えるでしょう。また、この「3つの印象」が無意識に私たちの中に備わっている印象というところも重要です。だからこそ、命を預ける公共物にも多用されていますよね。
強く直感的なメッセージで、ユーザーの本能を揺さぶるデザインに、赤色を是非お試しください！