FORMAT COMPARISON
PSD vs PNG
PSDとPNGはいずれも画像を扱いますが、PSDはAdobe Photoshopでの編集情報を保持する作業用形式、PNGは閲覧・配布に使いやすい画像形式です。役割を分けて使います。
PSDとPNG、どちらを選ぶ？
レイヤー、マスク、テキストなどを残して編集するならPSDを、Webや資料で表示・配布するならPNGを選びます。PSDを最終配布用画像として扱いません。
PSD向き
画像編集の作業ファイル・レイヤーを保持する制作
- Photoshopでの編集元保存
- レイヤー・マスク・テキストを残す制作工程
PNG向き
透過画像・スクリーンショット
- ロゴ
- 図版
- 透過が必要な画像
基本情報を比較
PSDとPNGの主な違いを確認できます。
| 項目 | PSD | PNG |
|---|---|---|
| 拡張子 | .psd | .png |
| MIME Type | image/vnd.adobe.photoshop | image/png |
| 主な用途 | 画像編集の作業ファイル・レイヤーを保持する制作 | 透過画像・スクリーンショット |
| 開く方法 | Adobe PhotoshopまたはPSD対応ソフトで開きます。重要な表現は対象ソフトで確認します。 | 標準ビューア、ブラウザ、画像編集ソフトで開けます。 |
| 書き出し・変換 | 配布用にはJPEGやPNG等へ書き出し、レイヤーを残す編集元PSDは別に保管します。 | PNGをJPEGへ変換すると透過を保持できず、背景色や合成結果を決める必要があります。JPEGとして書き出す場合は非可逆圧縮になります。WebPへ変換する場合も、透過を保つ必要と可逆・非可逆の設定を先に決めます。 |
用途別の選び方
作りたいものや使う場面から選べます。
Photoshopでの編集元保存
画像編集の作業ファイル・レイヤーを保持する制作
PSD向きレイヤー・マスク・テキストを残す制作工程
画像編集の作業ファイル・レイヤーを保持する制作
PSD向きロゴ
透過画像・スクリーンショット
PNG向き図版
透過画像・スクリーンショット
PNG向き確認ポイント 1
PSDはレイヤーや編集可能な要素を保持できる
使い分け確認ポイント 2
PNGは可逆圧縮と透過を扱える配布用画像の候補
使い分け選ぶ理由を詳しく
- PSDからPNGへ書き出すと編集情報は通常保持されない