今回は、スライスで分割した画像をWeb用に最適化して書き出す方法を解説しています。
Photoshop上で作成した画像をインターネットのブラウザで表示できる「jpg、gif、png」などのファイル形式に変換して、ファイルサイズや画質を調節し、
スタイルシートでのコーディング用にパーツごとに書き出します。
概要
- スライスに名前をつける→コレが書き出しの際のファイル名になる
- Web用に保存のダイアログの説明
- JPEG形式での書き出し方法
- 画像圧縮率の設定とコツ
- 書き出し設定
補足・ポイント
書き出しの形式について
一般的にロゴマークやイラストなど色数の少ない画像はGIF形式、写真やグラデーション等の効果がついた色数の多いものはJPEG形式で書き出します。
画像やボタン等のパーツの一部を透明にして書き出したい場合はPNG形式で書き出します。
PNG形式のファイルは、複雑な背景やグラデーション等の上にパーツを配置したい場合によく利用されます。
【Webデザインを学びながらビジネス力も身につける体験型スクール＆オンラインサロン】を運営する50代のWebデザイナー。 元スタイリスト→パソコン初心者→子育てしながらWebでお小遣い稼ぎ考える→ネットショップ運営→アフィリエイター→Webデザイナー→未経験でいきなりフリーランス。 こんな経歴を辿り2013年からWebデザインのオンラインスクールをプラットフォームに頼らず、ほぼ自力で運営しています。 「仕事は自分で創りだすもの」がモットー☆
