サイズや形式をその都度決めるなら[書き出し形式]、決まった条件で繰り返すなら[クイック書き出し]、旧来の比較画面で画像を調整するなら[Web用に保存(従来)]を使います。
WebPの保存はこの3方式とは別で、[コピーを保存]から選びます。
3つの保存経路と確認項目
| 方式 | 向いている作業 | 確認する項目 |
|---|---|---|
| 書き出し形式 | サイズ・倍率を指定する | 形式、幅と高さ、倍率、透明、色空間 |
| クイック書き出し | 同じ条件で繰り返す | 事前設定の形式、保存先、メタデータ |
| Web用に保存(従来) | 比較プレビューで調整する | JPEG・PNG・GIFなどの形式、寸法、推定サイズ |
ここでは画像全体を書き出します。
レイヤーだけを選んで書き出す場合は、そのレイヤーの範囲と文書全体のサイズが同じとは限りません。
対象が文書・アートボード・選択レイヤーのどれなのかを先に決めてください。
書き出し形式で1倍と2倍のPNGを作る
練習ZIPのpractice-transparent.pngを開きます。
入力は256×128pxです。
[ファイル]→[書き出し]→[書き出し形式]で文書全体を対象にし、PNG、透明を保持する設定、幅256・高さ128を確認します。
出力倍率を1xと2xに分け、2x側には@2xなど区別できる接尾辞を付けます。
別の空フォルダーに保存し、1xが256×128px、2xが512×256pxになっていることを開き直して確認します。
倍率を変えても元のPNGやPSDを拡大して保存する必要はありません。
元画像が小さい場合、2倍出力で細部が新しく増えるわけではないことにも注意してください。
クイック書き出しの設定を確認する
[書き出しの環境設定]で現在の設定を記録し、練習用にPNGと保存先を毎回確認する設定を選びます。
[ファイル]→[書き出し]のクイック書き出しを実行し、別フォルダーへ保存してください。
出力を開いて256×128pxと透明を確認したら、環境設定を元へ戻します。
設定した形式は次回にも使われるため、その場だけの指定と思い込まないようにします。
Web用に保存で比較する
[ファイル]→[書き出し]→[Web用に保存(従来)]を開き、原稿と最適化後のプレビューを比べます。
透明を使う練習ではPNGを選び、寸法と透明の設定を確認してから保存します。
JPEGを選ぶ場合は透明を保持できないため、背景をどうするかも決めてください。
表示される推定サイズだけでなく、保存後の実ファイルも確認します。
形式・画質・保存先で迷ったとき
JPEGの画質値は画面によって尺度が異なります。
Adobeの[書き出し形式]の説明にある1〜100%と、JSXのJPEGSaveOptionsの0〜12を同じ値として扱わないでください。
ファイルが見つからない場合はクイック書き出しの保存先設定を確認し、生成したフォルダーを開いて名前・拡張子・寸法を照合します。
SVGはPhotoshop 22.5で従来の書き出し機能が廃止された経緯があり、2026年の一般向けヘルプにSVGの記載があることだけで、手元の版で選べると判断できません。
実際の形式欄で確認し、ベクターとして保持したい制作物はIllustratorなど対応する作成元で書き出してください。
WebPについてはコピーを保存からのWebP手順へ進みます。
確認範囲と公式資料
2026年10月3日に、Adobeのクイック書き出し、書き出し設定、Web用に保存と、Adobe担当者のSVG廃止説明を確認しました。
Photoshop実機での各出力と環境設定の復元は未検証です。
