本ページはプロモーションが含まれている場合があります
みなさん、Photoshop CC 2015を使っていますか？
Photoshop CC 2015って地味にすごいパワーアップがされていたのです。
それがWeb用の画像書き出しです。Photoshop CC 2015のWeb用の画像書き出しはImageReadyからの画像書き出しから一新されています。
Adobeの公式ブログでは以下の様に説明されています。
1999年に販売したPhotoshop 5.5に「Web用に保存」が搭載されましたが、これはImageReady（現在は販売終了）から移植された機能です。高画素の写真をWeb掲載するために最適化したり、アニメーションGIFを作成したり。ただ、新しい機能を開発するにあたって、このコードは古いものとなってしまいました。
そこでアドビは新しくAdobe Generator (生成）、Photoshopから画像を書き出すために、より現代的で効率的な作業を考えた機能を搭載し、さらに約2年の歳月をかけて、「書き出し形式」や「Device Preview」の機能を開発しました。
Photoshop CCの「Web用に保存」機能の話 | Adobe Creative Station（Photoshop CCの「Web用に保存」機能の話 | Adobe Creative Station）
このブログの記事内に気になる表現が。
特に大きなポイントは、JPEG圧縮技術自体も向上し、JPEGの最高画質を選択した時、従来の「Web用に保存」と比較して、最終画像が半分のファイルサイズになる場合もあります。
Photoshop CCの「Web用に保存」機能の話 | Adobe Creative Station（Photoshop CCの「Web用に保存」機能の話 | Adobe Creative Station）
え？ ファイルサイズが半分に？？
半分って盛り過ぎじゃないですかね…？ということで検証してみました。
●検証してみる画像
画像は「ぱくたそ」さんの画像でLサイズを使ってみましたよ。助かります。ありがとうございます。
自然豊かな中でのノマドの様子の画像
町の夜景の画像
女性の薬剤師（という設定）のふんわりした画像
白っぽい背景が多めの人物画像
ベタが多めの画像
JPEGが苦手な赤を多く含む画像
●CS4とCC 2015でファイルサイズを比較
これらの画像をPhotoshop CS4の「Web用に保存」とPhotoshop CC 2015の「書き出し形式」で書き出した場合のファイルサイズの比較をしてみます。（便宜上Photoshop CS4を使っていますがPhotoshop CC 2015の「Web用に保存（従来）」でも同じです）
設定はJPEGの画質を60％です。Adobeのブログでは「最高画質」でしたがWeb制作の現場でよく使いそうな画質にしてみました。
Photoshop CS4の「Web用に保存」は以下の設定です。
Photoshop CC 2015の「書き出し形式」は以下の設定です。Photoshop CC 2015ではプログレッシブにするかどうかの設定できないのですね。
さてファイルサイズ比較は以下の通りでした。
Photoshop CC 2015のJPEG画像のファイルサイズが圧倒的に小さく平均でも半分に！
Adobeが書いていた半分というのもあながち嘘ではないようです。
●JPEGminiを使ったデータとファイルサイズを比較
JPEGを少しでも小さく！という時の強い味方と言えば「JPEGmini」ですよね。画像をドロップするだけでファイルサイズが小さくなります。
Photoshop CS4のJPEG画像をJPEGminiにドロップして最適化を行ったものとPhotoshop CC 2015のJPEG画像のファイルサイズと比較してみます。
すると、おおよそ60％の縮小率で、差が10ポイント縮まった結果となりました。
JPEGminiを使っても、Photoshop CC 2015のJPEG画像の方がファイルサイズが小さいとはすごいですね。
●CC 2015のJPEG画像にはJPEGminiは効かない
ちなみに十分ファイルサイズが小さいPhotoshop CC 2015のファイルをJPEGminiにドロップしたらどうなるのでしょうか？
今回試した6点の画像ファイルを全てドロップしてみましたが、結果は「Nothing Done」と表示されて、最適化できませんでしたとの旨が表示されました。Photoshop CC 2015のJPEG画像はJPEGminiが不要と言えます。
●設定は同じつもりでも画質は結構違う？
しかし、ここまでファイルサイズが違うと怪しく感じてしまいます。
なので、比較して調べてみます。
森の中のノマドの画像を開いて、JPEGでは弱い赤の服の部分を見てみると、Photoshop CC 2015の方がJPEG特有のブロックノイズが強く出ている状態になっています。
紺色のシャツの部分もブロックノイズが強いように感じます。（画像は200％の状態です）
色差が大きい部分だとどうでしょうか。
ペンを持った画像では、グリーンバックの背景と指の境目のモスキートノイズがPhotoshop CS4よりPhotoshop CC 2015の方が強くなっていますね。（画像は100％の状態です）
結果としては、Photoshop CS4とPhotoshop CC 2015では画質の数値が同じでも、同じ品質の画像ではない、ということがわかりました。
（いくつか試してみましたが、個人的にはPhotoshop CS4のJPEG画質60とPhotoshop CC 2015のJPEG画質80くらいが同じような画質なのでは…と感じています）
詳しく比較したい方は、元画像・Photoshop CS4の「Web用に保存」・Photoshop CC 2015の「書き出し形式」で保存したファイルをまとめて圧縮しておきましたのでダウンロードして比較してみてください。
- ダウンロード（25.4MB）
●結論
同じ画質の数値の指定での画質の違い（劣化）は、見る方のご判断に任せますが、違うことは事実です。
ただ、比較した赤のシャツ部分なども、ピクセル等倍（100％）で見れば、そんなに違いは感じませんし、モスキートノイズも気にならないと言えば気にならないレベルなのかもしれません。その中で、ファイルサイズが半分というのは嬉しいことです。
いずれにせよ、JPEG最適化ツールがいらないというのはWeb制作者に助かりますし、前の書き出し方法が無くなったわけではなく、選択肢が増えることは良いことです。
ぜひPhotoshop CC 2015のJPEG書き出しの実力を君の目で確かめてくれ！
それでは、よいPhotoshopライフを。
●関連ページ
★画像
- 僕の職場は緑に包まれた公園のテーブル（フリー写真素材・無料ダウンロード-ぱくたそ）
- 夜の日比谷（フリー写真素材・無料ダウンロード-ぱくたそ）
- 倒れこちらを見つめる薬剤師少女（フリー写真素材・無料ダウンロード-ぱくたそ）
- 「今日は部活が無いから、映画観に行こうよ！」と彼氏を誘う彼女（フリー写真素材・無料ダウンロード-ぱくたそ）
- 油性ペンを持った手（グリーンバック）（フリー写真素材・無料ダウンロード-ぱくたそ）
- カンチャンをツモり、笑顔がこぼれる女流雀士（フリー写真素材・無料ダウンロード-ぱくたそ）
★ネタ元・ツール
- Photoshop CCの「Web用に保存」機能の話（Adobe Creative Station）
- JPEGmini