【HTML&CSS】Webデザインを作る!CSSの基本/各色をメインで使ったWebサイト

HTML&CSS
HTML&CSS
この記事は約6分で読めます。

おはようございます!

8月12日 月曜日(振替休日)。晴れ🌞
最高気温36℃(東京)。いつまで続くのか。。週の後半は30℃近くまでさがるっぽいけど。。

ま、気にせず今日も学んでまいります。

今日の教材はこちら

スポンサーリンク

いつも通りです。

 

 

よしやっていこう。

 

CHAPTER3 Webのデザインを作る!CSSの基本

 

前回は、CHAPTER3-8の「上手に配色しよう」の途中で力尽きたのですが、
 ↓

 

今日はその続きではなく、CHAPTER3-9からやっていこうと思います。

それはなぜか、、

色のお勉強はちょっとお腹一杯なのです!

もういいぜ・・・


ということで。。

 

CHAPTER3-9

 

結局、色・・・

 Webサイトにおいて、メインカラー・ベースカラーに何の色が使われているのか、アクセントカラーには何が使われているのか、例を挙げていく。

 

BEAM(不動産投資・開発会社のホームページ)

BEAM (beamand.co)

 

赤色の与える印象

・情熱、熱意: 赤色は情熱や熱意、活力を象徴する色。そのため、スポーツチームやエンターテイメント業界など、活気あるイメージを伝えたい企業によく利用される。

・力強さ、自信: 赤色は力強さや自信、リーダーシップを象徴する色でもある。高級ブランドや自動車メーカーなど、高品質なイメージを伝えたい企業でも利用される。

 

 

KOREDAKE | ウェルネスプロテイン:女性の健康をサポートする完全栄養食

KOREDAKE | ウェルネスプロテイン

 

<ピンク色が与える印象

可愛らしさ、女性らしさ: ピンク色は、昔から女の子の色として親しまれており、可愛らしさや女性らしさを象徴する色。美容系やファッション系のサイトでよく使われる。

・柔らかさ、優しさ: ピンク色は、目に優しく、心を落ち着かせる効果があると言われている。そのため、癒しを求めるようなサイトや、子供向けのサイトなどに使われることもある。

 

 

クリエイティブサーベイ – 顧客の声を、機会に変える

クリエイティブサーベイ – 顧客の声を、機会に変える (creativesurvey.com)

 

<オレンジ色が与える印象

温かみ: 太陽の色を連想させ、心身に温もりを与える。そのため、飲食店やアパレルなど、人とのつながりを重視する業種でよく使われる。

活気: 赤と黄色の両方の要素を持ち合わせ、エネルギッシュな印象を与える。そのため、イベントやキャンペーンサイトなどで、来場者を鼓舞する効果が期待できる。

親しみやすさ: 明るく開放的な印象を与えるため、訪問者に安心感を与え、サイトへの滞在時間を長くすることができる。

 

 

THEO[テオ] by お金のデザインについて

THEO [テオ] by お金のデザイン

 

<青色が与える印象>

信頼感: 誠実さ、安定感といった印象を与え、企業の信頼性を高める。金融機関や医療機関など、信頼性が特に求められる業種でよく利用される。

冷静さ: 熱くなりすぎず、客観的な判断を促す色とされている。IT企業やコンサルティング会社など、論理的な思考が求められる業種で効果を発揮する。

 

 

JTウェブサイト

 

<緑色が与える印象>

自然: 緑色は植物を連想させ、自然や環境に配慮している印象を与える。そのため、環境関連企業やオーガニック食品の販売サイトなどで多く利用されている。

癒し: 緑色は目に優しく、リラックス効果があると言われている。そのため、スパやヨガスタジオなど、癒しを求める人が訪れるようなサイトで効果を発揮する。

安心感: 緑色は安全性を示す色としても知られており、医療機関や食品関連のサイトで信頼感を高める効果がある。

 

 

ブレイクです!

暑い~~~
エアコンつけてても暑い~
27℃の設定はもう限界か?・・・

Copilot!なんで最近の夏はこんな暑いの~?

 

気候変動?

 

 

何か対策を打たないと集中力が続かず、このブログでの学びも疎かになってまう。。

 

どげんかせんといかん。。。

 

Amazonにて何かいいアイテムがないか探すためこれにて終了です。

 

おつかれさまでした~(=゚ω゚)ノ

 

 

 

コメント

PAGE TOP
タイトルとURLをコピーしました