学科 ユーザーインターフェイス基礎④【オンライン】
デザインラフの制作に向けて
画像について
- 画像がなくても成立する＝背景
→ CSS（background）で記述する - 画像に意味がある（商品画像・ロゴなど）
→ HTML（img）で記述する
※必ずalt属性に画像の情報を記述する（SEO・音声読み上げに関わる）
テキストについて
- テキストを画像にする
- メリット：コーディングが楽・早い
- デメリット：重いため表示スピードが落ち、SEO的に不利になる
- フォント
- バンドルフォント
- Webフォント
色について
- rgba関数
16進数で表す - hsl関数（CSS3から採用）
色相を°（角度）、彩度・輝度を％で表す
Googlechromeの検証ツールで色の確認・関数の変換が可能
その他
- デザインラフでは動きを表現できないので、別途説明を記載する
- リテイクをしても古いデータは残しておく
- コーディングに入る前にテキストをすべてベタ打ちしておく
→ 全角スペースなどのエラーを防ぐ・時短になる
