制作のポイント
実務ではデザインラフの制作はお客様と、多くのやり取りが必要になるでしょう。
デザインは必ず複数パターンの提案（最低2パターン）をして、お客様とのイメージの共有を具現化して行けるよう進めましょう。
【参考サイト】
Web用画像とは？
Web用画像には、 主に「jpg」「gif」「png」「svg」が昨今のWebサイトで使われます。 その特徴と違いを確認しておきましょう。
【ワンポイントアドバイス】
「jpg」「gif」「png」「svg」について、まず悩んだら「jpg」透過表現を必要とすなら「png」、「gif」はアニメーションが必要な時ぐらい、「svg」複雑な画像は重たくなるので、条件次第で使う。と良いでしょう。
【参考サイト】
- Web用の保存形式、きちんと使い分けてますか？ | バンフー …
- Webで扱える画像について知ろう！基本の4つの画像形式と …
- Photoshopの「Web用に保存（従来）」の使い方 – カラー …
- 新人コーダーに知っておいて欲しい命名規則の考え方[画像 …
メモ
・SVG→線やシェイプ等の組み合わせでできたベクターデータのため、jpg・gif・pngと違い拡大してもぼやけない。
デメリット：写真には使えないこと。また最近出始めた形式のため、使うサーバーによっては別で表示させるコードが必要になるとのこと。
ロゴなど簡単な色使いの物などは向いていそう。
・グラデーションなど情報量が多いものや写真、たくさんの色使いのイラストなどは向いていないが、簡単な色使いのものやロゴなどはJPGよりPNG-24が向いている（簡単なものであればPNGの方がデータ量が低い場合もある）
・（先生よりおすすめのサイト）TinyPNG
品質を下げすぎずに、適切なファイルサイズに圧縮してくれるサイト