JPEG画像のサイズに関して、「最適な」ファイルサイズはどれくらいですか？

100,000以上のJPEG画像をスキャンして、ファイルサイズの点で「大きすぎる」場合は再圧縮するスクリプトを作成する予定です。スクリプティングは簡単な部分ですが、画像を「大きすぎる」として分類する方法がわかりません。

たとえば、ファイルサイズが1.81MBの2400x600pxの画像があります。Photoshopの「Web用に保存」コマンドは、60KBの品質と同じサイズの540KBファイルを作成します。これは元のサイズの約29％です。

現在、これらの数値をガイドラインとして使用することを考えています。540KB /（2,400 * 600 / 1,000,000）のようなもの=メガピクセルあたり375KB。これより大きい画像は大きいと見なされます。これは正しいアプローチですか、それとももっと良い方法がありますか？

編集1：画像をWebサイトでの表示用に最適化する必要があります。

編集2：実験して目的の出力品質を決定できます。画像のファイルサイズの観点から画像が大きく、低品質で保存する必要があるかどうかを知る必要があります。

で平均、JPEGのスイートスポットは、周りでピクセルあたり1ビット。

もちろん、これは画像の内容によって異なります。特定の種類のグラフィック（たとえば、平坦な領域や滑らかなグラデーション）は、他の種類（ノイズ、テキスト）よりも圧縮率が高いため、すべての画像に盲目的に適用する堅牢な方法ではありません。

また、比較するための非圧縮の参照画像がないという問題もあるので、現在の画像の品質がどの程度であるか、さらに許容範囲内に品質をどれだけ下げることができるかは本当にわかりません。品質はJPEGの量子化テーブルからある程度推測できますが、信頼できる方法でもありません（特に、ImageMagickの品質判断は、カスタムの最適化された量子化テーブルを使用するJPEGでは非常に不正確です）。

そうは言っても、合理的な実用的なアプローチがあります：

1. 満足できる最高のJPEG品質設定を選択します（70〜85の範囲）。
2. 画像をその品質レベルに再圧縮します。
3. 再圧縮された画像が〜10％以上小さい場合は、再圧縮された画像を保持します。

小さいファイルサイズだけを選択するのではなく、ファイルサイズを大幅に減らす必要があることが重要です。これは、JPEGの再圧縮では、JPEGの損失の多い性質と8ビットRGBへの変換によって生じるディテールの損失により、常にファイルサイズがわずかに低下する傾向があるため、ファイルサイズの小さな低下は、価値のない品質の低下が不釣り合いに大きくなる可能性があるためです。それ。

JPEGで圧縮されたファイルのサイズは、画像の複雑さによって異なります。記述した方法でファイルサイズを制御しようとすると、知覚されるイメージの品質が非常に変動します。

代わりに次のオプションを検討してください。

• 十分なアプローチ。 75など、許容できる品質設定を使用します。結果のサイズを元の画像と比較し、小さいファイルを保持します。JPGに変換するときに選択する品質を参照してください。

• JPEGの最小化を使用し JPEGmini好きか、jpeg-recompressからJPEG-アーカイブ。それらは基本的に、あなたがやろうとしているように見えることをするように設計されていますが、JPEGアルゴリズムの内部をより意識しています。

• 様々なサイズのサムネイルを生成するよう、Nathancahillは、ウェブ開発者の観点から、示唆しています。

いいえ、これは間違ったアプローチです。

ピクセル単位のファイルサイズは、最終的な重みと関係がありますが、それだけではありません。

テストを行います。同じ2400x600pxの完全に白いファイルを取り、JPGとして保存します。

次に、たくさんの詳細を含む森（同じ2400x600px）の写真を撮って保存します。このファイルは、同じ圧縮設定を使用すると大きくなります。

最終的なサイズは、次の3つの要素によって異なります。

• ピクセルサイズ
• 圧縮設定
• コンテンツ（画像の詳細と複雑さ）

したがって、ピクセルサイズに基づいてウェイトを定義することはできません。

しかし、私はあなたの問題を理解しています。

画像の現在の圧縮を分析しないと、「最適な」重みを定義することは困難です（これは、オブザーバーまたは画像の使用に関連しています）。

おそらく、圧縮設定を定義して「すべて」を再圧縮できます。「アップロード」の前にそれを実行するかどうかはわかりません。おそらく、一部をスキップして保存するよりも時間を節約できます。

画像を分析して現在の圧縮率を計算するツールがいくつかあります。しかし、私はそれが重要であることを疑います。

Web開発者はこちら。これが私がこれに取り組む方法です：

1.表示される画像の寸法と必要な画面解像度を決定します。

最初のタスクは、画像が表示されるピクセルサイズを決定することです。それらはオンラインストアの商品写真ですか？フォトギャラリー？ユーザーのプロフィール写真？複数の異なるサイズ？必要なピクセル寸法のリストを作成します。最近の携帯電話やタブレットなどの高解像度画面に@ 2x画像が必要かどうかを確認してください。

2.サムネイルスクリプトを使用して、新しい画像ファイルを作成します。

これらはサムネイルスクリプトと呼ばれますが、単なるサムネイル以外にも使用できます。そこには多くのスクリプトがありますが、独自に作成することもできます。元のファイルのサイズを変更しないことで、スクリプトに誤りを犯した場合や、高解像度の画像が必要であることに気付いた場合に、やり直すことができます。一般的な方法は、出力ファイル名にサフィックスを指定することです。例えば：

lena.jpg (Original, 2000x3000)
lena-thumb.jpg (100x150)
lena-thumb@2x.jpg (200x300)
lena-product.jpg (400x600)
lena-product@2x.jpg (800x1200)

3.圧縮。

サムネイルスクリプトでは、新しい画像ファイルを切り取るときにjpg圧縮を指定する必要があります。ただし、ファイルサイズをさらに削減する可能性のある他の縮小機能が他にもあります。

一方でラファエルの答えは、@ JPEG圧縮インとアウトを説明したが、私はあなたのウェブにお答えし、問題のアップロードしようとします。

Webサイトで画像を使用する（デザインまたはコンテンツ用）には、いくつかの命令が必要になります。ロゴ、カバー写真、サムネイル、ブログ投稿の写真、ギャラリーの全画面写真...また、複数の目的で使用する場合（たとえば、写真とそのギャラリーのサムネイル）、必要なすべてのサイズでそれを拒否する必要があります。ただし、独自のWebサイトを構築していない限り、ほとんどの今日のWebサービスは、サイト内で使用するために、大きな画像から小さなサイズの画像を生成します。

画像の目的がわかったので、Webサイト（またはCMSまたはフロントエンドフレームワーク）では、画像が準拠するために常にピクセル単位の最大サイズが必要になります。ロゴは最大600x600px、バックグラウンドカバーは最大1280x720px、フルスクリーンディスプレイのコンテンツ写真1920x1080、または絶対的なディテール保護のためのカメラのネイティブ解像度の場合があります。アップロードするWebサイトの正しいサイズを確認してください。達成したい比率に応じて、必要な最大ピクセルサイズの少なくとも1つに一致させる必要があります。注意してください、アスペクト比が同じでない場合、一部のサービスは画像をトリミングして拡大します。その場合、必要な最大サイズと比率に合わせて画像を再トリミングする必要があります。

次に、Webサイトによってファイルサイズの制限が課される場合があります（画像の目的によっては、課されない場合もあります）。ページの読み込み時間については、軽いほど良いです。2400x600pxの高解像度画像の例では、300〜500kBが読み込み時間の完全に適切なサイズです。コンテンツの写真（写真など）は、イメージの目的で必要な場合（フルスクリーン表示など）、必要に応じてカメラの本来の解像度まで、より重い場合があります。何も示されていない場合、オーディエンス機器（モバイル、デスクトップ...）、オーディエンスの国のネットワークの品質に依存する可能性があるため、ファイルサイズの制限は推測しにくい場合があります...最高の品質とサービスを得るには、写真を1枚ずつ処理してください。目に見えるアーチファクトのない最小ファイルサイズを取得します。便宜上または処理を高速化するために、全体的に満足できる圧縮レベルを使用して、スクリプトのサイズを変更します（約70で十分です）。@xiotaの回答も必要なツールとなる場合があります。ここに独自の基準を設定します。

TL; DRウェブサイト上の画像の目的は、サイズ変更/圧縮量の鍵です。

計算しているのは、画像ピクセルの平均圧縮サイズです。これを生のピクセルサイズ（通常、24ビットRGBの場合は3オクテット）で割ると、圧縮率が得られます。

これは画像の圧縮状態に関する情報を提供する優れたメトリックですが、圧縮率は圧縮プロファイルのみに依存しないため、画像が十分に圧縮されているかどうかを判断するだけでは不十分です（アルゴリズム= JPEG、品質= 60/100）だけでなく、画像の圧縮の可能性についても同じです。同じrawサイズと同じ圧縮プロファイルの異なる画像は、圧縮の程度が多少異なるため、JPEGサイズが異なります（空白の画像は非常に圧縮しやすく、白です）ノイズはありません）。

このため、「最後に使用された」品質プロファイルはこの画像（メタデータまたはjpegヘッダー構造のどちらにも）に保存されないため、ターゲットサイズ/品質プロファイルで画像を再発行するときに最も使用されるアプローチは、実際には単に再圧縮することです（そして画像の初期状態に関係なく、すべてのサイズを（自動的に）変更する可能性があります。

はい、不要な場合は再圧縮できます。より高品質のプロファイルで再圧縮するとスペースが失われる可能性もありますが、これらはエッジケースであり、大規模な場合、目標の品質プロファイルを確保するために行うのが最も簡単です。もちろん、画像を徐々に劣化させないために、一度だけ行いたいので、おそらく、2つの画像ライブラリを保存する必要があります。

たくさんのファイルを再圧縮するためのツールはたくさんあります。独自のスクリプトを作成し、適切なテクニカルスタック（主にC ++とlibjpeg）を使用することもできます。100kを超えるファイルでもかなり高速です。

よりスマートでより複雑なプロセスを実装する場合は、反復的な再圧縮/比較サイズロジックを試して、元の品質プロファイルを推定することができます（同じ品質で再圧縮すると、ほぼ同じサイズで高い品質はわずかにサイズを増やし、品質が低いとサイズは大幅に減少するはずです）もちろん、これはより多くのCPUパワーを消費します。

For example there is a 2400x600px image with a file size of 1.81MB.
Photoshop's save for web command creates a 540KB file at 60 quality and same dimensions.    
This is about 29% of original size.

元の非圧縮サイズは2400 x 600 x 3 = 4,320,000バイト（4.1 MB）です。これは、24ビットカラーは常にピクセルあたり3バイトのRGBデータであるためです。この絶対的な真実を回避する方法はありません。

ただし、JPGサイズは画像の詳細にも依存します。大きな滑らかな領域（空や塗られた壁など）は圧縮率が高くなりますが、細部（葉でいっぱいの木など）の領域も圧縮されません。したがって、絶対的な数値インジケータはありません。

ただし、540 KBは0.540 / 4.1 = 4.1 MBの元のサイズの13％です。以前のJPGサイズの29％かもしれませんが、元の非圧縮サイズの13％です。したがって、これは元の非圧縮サイズの1/8であり、通常は「まともな」品質と見なされます。最適ではありませんが、最高の品質ではありませんが、一般的にはまあまあで、おそらく一部の用途には十分です。ただ言うと、もう小さいです。

大きいJPGファイルは画質が良く、小さいほど画質が低くなります。何が適切であるかを判断する必要がありますが、JPG圧縮では画像の品質が低下するため、JPGが「大きすぎる」ことはありません。24ビットカラーは、非圧縮のピクセルあたり3バイトです。

したがって、決定は、それを小さくしたいか、それとも良いものにしたいかです。

しかし、既存のJPGを大きくするとさらに悪いことになります。追加されるJPGアーティファクトが追加されるためです。また、一度小さくなると、データが変更され、データが改善されることはありません。

JPGアーティファクトは、通常、ディテールのない滑らかな領域にある1色の8x8ピクセルのブロックとして表示される方法と、ディテールエッジの周りの粗いエッジとして表示される方法の2つを示します。

JPGを編集して再保存すると、JPGアーティファクトが追加されます。それが必要な場合は、元の圧縮設定と一致するように常に再保存することをお勧めします。

Photoshopの「Web用に保存」は、実際にはファイルサイズと品質のかなりの妥協点であるため、より具体的な要件がない限り、それを採用する必要があります。典型的なアドバイス Web開発者のための50〜70％の品質範囲に固執することです。もちろん、例外もあります。常に見栄えの良い（またはそれをロスレス形式に変換する）会社のロゴの品質を90〜95％にしたい場合、大きいがわずかに30％まで低くする必要があります。目に見えるページの背景。

また、画像のサイズを変更することを忘れないでください。2400x600の画像は4Kディスプレイで見栄えがよくなりますが、小さい画面で再スケーリングされ、ユーザーの視覚的な改善なしにデータ帯域幅を浪費します。使用するWebサイトテンプレートを確認して、画像の最適な幅を確認してください。通常、執筆時点では、約1200〜1300ピクセルになります（ここで最も一般的な解像度を参照してください）。

元の画像をWeb品質に変換することを忘れないでください。この素材を手直ししたり印刷したりする必要がある場合は、品質が60％、解像度が1 Mpixであることが残念です。