「このサイト、なんか使いやすい〜！」って思ったこと、あるかな？
実はそれ、Webデザインと人間中心設計（HCD）のチカラかも！
今回は、ITパスポートにも出る「使いやすいWebサイト設計の考え方」について、CSSやモバイル対応、人を中心にした設計のプロセスまで、いっしょに見ていこうねっ！
Webデザインとは？
Webデザインって、ただ「かわいく飾る」だけじゃないの。
たとえば「文章が読みやすい」「スマホでも見やすい」「どこを押せばいいかわかる」
…そんな使いやすさ（ユーザビリティ）がすっごく大事！
CSSの役割は？
CSS（Cascading Style Sheets）は、Webページのデザインを整える言語だよ～！
HTMLだけだと味気ないページも、CSSで統一感のある見た目にできるの！
モバイルファーストとは？
最近は、スマホでWebを使う人のほうが多いよねっ。
そこで大事なのが「モバイルファースト」という考え方！
モバイルファースト vs PCファーストの違い
| 設計方針 | 特徴 |
|---|---|
| モバイルファースト | スマホでの見やすさ・操作性を最優先。 小さい画面からデザイン！ |
| PCファースト | パソコン画面を前提に作り、あとからスマホ対応を考える。 |
つまり「小さい画面から先に考える」のがモバイルファーストなの。
この発想、ITパスポートでもよく問われるから覚えておいてね！
💡 ちなみにこの表も…？
表がスマホでも横スクロールできるように、カスタムCSSが使われてるの！
スマホで見ると「表が伸びて読みづらい…」ってなりがちだけど、
CSSで工夫すると見やすく・読みやすく調整できるんだよ〜！
人間中心設計（HCD）とは？
デザインの世界では、人間中心設計（HCD: Human-Centered Design）っていう考え方が超重要なの！
人間中心設計の4ステップ
人間中心設計は、ざっくりいうとこんな流れ！
- 【調査】ユーザーの目的・状況をよく知る
- 【設計】使う人の視点で考えてデザインする
- 【評価】試しに使ってもらって反応を見る
- 【改善】使いづらいとこを修正してもう一回！
これをぐるぐる回して「ユーザーの満足度（UX）を上げる」のが目的だよ～！
実務でも役立つよ～！
この考え方って、実はITだけじゃなくて…
…などなど、人が操作するシーンなら全部使えるの！
「誰に・どう使ってもらいたいか？」って視点が、やさしい設計のカギなんだよ🩷
Webデザインに関するITパスポート試験の過去問！
Webページの見栄えをデザインするためのものはどれか。
ア：Cookie
イ：CSS
ウ：CUI
エ：SSL
正解は『イ』
→ Webページの「見た目のデザイン」はCSSの役割。
文字の色・サイズ・レイアウトなどを整えるCSSは、Webデザインに欠かせない存在なんだよ～！
ア：Cookieはユーザー情報を保存する仕組みのこと！
ウ：CUIはコマンド入力型のUI（黒い画面で文字入力）だよ。
エ：SSLは通信を暗号化するセキュリティ技術のこと。
ITパスポート試験をスマホで手軽に勉強！
「えろ勉」も戦略的に開発＆運営してるよ～！この記事が勉強になったり、ためになったよ〜って思ったら、なにかアクションをお願い！！「えろの力で勉強するゲーム：えろ勉」
ユーザーの気持ちになって考えることで、恋も…じゃなくて、UXもぐっと良くなるんだよ❣️笑
