≪授業レポート≫ これだけは押さえたい「Web制作のカラー(色)」

みなさん、こんにちは。

デジハリ・オンラインスクール、授業運営担当の牧野です。

 

オンラインスクールのお盆休みは昨日まで！

本日から通常営業となりますので

みなさまどうぞよろしくお願いいたします。

 

ご質問にもどんどんお答えしていきますよ！

ご不明な点はお気軽にお問合せください。

 

と、いうことで、今週も授業の一部をちょっとだけご紹介する

＜授業レポート＞のお時間がやってきました！

 

今週は「Webデザイナー SOHO・在宅講座」に含まれている

ライブ授業の一つ「Webリテラシー講座[Web検定資格対策講座]」です。

 

◇Webデザイナー SOHO・在宅講座

 

今回は主に「Web制作」に必要なカラー(色)の話をお伝えします。

色使いって難しいのでは・・・

と思われている方はぜひご覧ください。

 

では、今週も言ってみましょう！

 

──────────────────────────────────

【1】 「色」の構成要素を知ろう

 

本日の授業の冒頭では「色」の基礎知識を勉強しました。

色には色相、明度、彩度の３つの要素があります。

ディスプレイにおける色構成は色を加えていくと白くなる「加法混色」です

 

──────────────────────────────────

【2】色の配分

 

色は闇雲にたくさん使えば良いというものではありません。

-ベースカラー70%

-メインカラー25%

-アクセントカラー5%

の比率で使われることが多いです。

 

──────────────────────────────────

【3】色はこうやって決めよう！

 

色の決め方一例：

1.ベースカラーには無彩色か、メインカラーの明度を上げた色。

2.メインカラーには明度の低い色。

3.アクセントカラーには色相環でメインカラーの逆にある色(＝補色)を使用する

 

──────────────────────────────────

【4】「Web標準」を知ろう

 

色の次は「Web標準」についての講義でした。

ポイントは「情報と装飾の分離」HTMLは情報を記し、CSSで装飾を行います。

こうすることで検索にも強く、メンテナンスも楽になるのです。

 

──────────────────────────────────

【5】美しいソースコードとは？

 

美しいソースコードとは：

1.情報の意味づけがわかる（正しいタグ）

2.正しい用法（Web標準に則った正規の記述）

3.人にも機械にも読めるように

がポイントです。

正しく記述できているかはValidation（構文チェック）で確認します

 

──────────────────────────────────

【6】ユーザビリティ、アクセシビリティ

 

よく聞く言葉ですが、正しい意味をしっかり理解しておきましょう。

1.ユーザビリティ　＝使いやすさ、分かりやすさ

2.アクセシビリティ＝そもそも使えるかどうか

⇒まずはアクセシビリティを優先させましょう。

 

──────────────────────────────────

 

いかがでしたか？

授業の雰囲気をすこしでも感じて頂ければうれしいです！

 

それではまた来週！

Comments

[投稿情報: cheap oakley sunglasses]

What about a big asteroid like like the one believed to have wiped out the dinosaurs? – get real. Not to mention volcanic activity.

[投稿情報: ray ban wayfarer sale]

Guidance should use your own system settings to set the Time Zone and Daylight Savings Time, can you send me your application settings and your computer settings?

[投稿情報: yfpJcZSR]

yfpJcZSR
yfpJcZSR http://www.r3w59eioa3739PNkop35lr.com/
[url=http://www.r3w59eioa3739PNkop35lr.com/]yfpJcZSR[/url]

[投稿情報: gucci outlet]

Fusce euismod consequat ante lorem ipsum

[投稿情報: jordans free shipping]

especially nice post, i undoubtedly love this site, maintain on it jordans free shipping http://jordansneakersh.blurpalicious.com/ jordans free shipping