いくつかのワードプレスのテーマを使用して、いくつかの画像ファイルを変更しましたが、編集したバージョンが元のファイルよりも3〜4倍大きいことがありました（同じ形式で保存）。品質を低下させたくありません。ファイルサイズを小さくしてロードを高速化する方法をいくつか教えてください。
現在、たとえば、Photoshopを使用して、画質スライダーを「8」（10個中）に設定しています。
画像のファイルサイズを小さくするにはどうすればよいですか？
回答:
Smashing Magazineは、PNG最適化とJPG最適化に関する2つの素晴らしい記事を発表しました。
それらは非常に詳細であり、フォーマットとその実装について知らないかもしれないことを詳細に説明しています。たとえば、JPEGの記事「PhotoshopでQualityを50未満に設定すると、カラーダウンサンプリングと呼ばれる追加の最適化アルゴリズムが実行され、隣接する8ピクセルブロックの色が平均化されることに注意してください」。
両方の記事では、Photoshopでファイルを準備して圧縮率を高めるために使用できる特定の手法について説明しています。これは、ファイルを保存した後に使用する手法よりもはるかに効果的です。
これらのファイルを保存した後、またはPhotoshopで微調整するためにレイヤー化されたソースファイルを作成するほど幸運ではないファイルには、これらのファイルを圧縮するためのさらなる圧縮があります。
ImageOptimというMacアプリを使用します。彼らのサイトから：
ImageOptimは、最適な圧縮パラメーターを見つけ、不要なコメントとカラープロファイルを削除することで、画像を最適化し、ディスク容量を削減し、読み込みを高速化します。PNG、JPEG、GIFアニメーションを処理します。
ImageOptimは、様々な最適化ツールのためのGUIを提供する：AdvPNGを AdvanceCOMPからOptiPNG、PngCrush、JpegOptim、のlibjpegからjpegtran、Gifsicleおよび任意PNGOUT。
Web上で画像を公開するのに最適で（Photoshopで「Web用に保存」画像を簡単に縮小できます）、MacおよびiPhoneアプリケーションを小さくするのにも役立ちます。
ケーキ。画像（または画像フォルダー）をウィンドウにドラッグします。圧縮スキームを調整し、不要なメタデータとカラープロファイル情報を削除します（いずれにしても広くサポートされていません。保存する前にカラープロファイルを修正する必要があります。保存および埋め込みは行いません）。
その引用にリンクされているすべてのツールにはPNGOUTを除くWindows / Linux / Macバージョンがありますが、ありがたいことに誰かがPNGOUTをOS XとLinuxに移植しました。ImageOptimを使用する場合、.appにはPNGOUT以外のすべてが含まれるため、PNGOUTポートを取得して/ usr / local / bin（またはどこでも）にドロップし、ImageOptimにその場所を伝えます。
特にPNG画像では、Photoshopの「Webおよびデバイス用に保存」で保存した後でもファイルサイズが30％以上低下するのを見るのは珍しいことではありません。
ヒント：最適化を実行した後、左側のアイコン列でソートし、（X）アイコンが付いたすべての行を選択します（これ以上縮小されていないファイル）。リストからそれらを削除し、チェックマークアイコンがあるすべての画像で再実行します。ファイルサイズがまだ失われている画像があることをほぼ約束できます。すべての（X）アイコンを取得して1日呼び出すまで、並べ替え、選択、削除、再実行を繰り返します。
+1うわー！これらは素晴らしい記事です。それらを投稿してくれてとてもうれしいです。
—
ジェセガビン
ええ、彼らは私よりもPhotoshopの方がずっと進んでいますが、デザイナーに見せてみて、彼らは常に1つまたは2つのことを学びました。
—
ブライソン
PNG画像の場合、カラーマップの色数を減らして、インデックス付きPNGとして保存できます。たとえば、128x128ピクセル（非圧縮）のロゴを考えます。実際に使用する色は16色しかないことを想像してください。
- PNG-32、ピクセルあたり4バイト-65 KB
- PNG-8、1ピクセルあたり1バイト-16 kB
- PNG-4、ピクセルあたり4ビット-8 KB
画像の品質を低下させることなく（これは特定の種類の画像にのみ適用されます）、サイズを大幅に縮小できることがわかります。
ボタンとサイトアイコンについては、それらを1つの画像に集約し、CSSまたはJavaScriptを使用して表示（スプライト）を制御することも検討できます。これにより、各イメージに対して行われるHTTP要求の数が節約されます。
基本的に、画像をさまざまな形式で保存してから、ファイルサイズを確認してください。
JPEGを使用している場合は、paint.netなどのグラフィックエディターで画像の品質を上下に調整できるはずです。通常、画像の50％品質はWebに十分であり、画像をより小さくします。
PNGではこれを行うことはできませんが、JPEGよりもPNGがはるかに大きく、時にははるかに小さいことに注意する価値があります。PNGは、たとえば白黒の線画などの白黒画像の場合、はるかに小さくなります。
最近のアドバイスは、CSSスプライトを使用してリクエストを減らすことで読み込み時間を短縮することですが、ここでも実際に画像サイズを確認する必要があります。たとえば、複数の白黒PNGを1つの色と組み合わせた場合、CSSスプライト画像はコンポーネント画像よりもはるかに大きくなる可能性があります。
EXIFデータを2番目に表示します-必要ない場合はダンプします。それは小さいと思いました（単なるテキストですか？）しかし、いくつかのサイトでは、同じ品質設定で50KBの画像（ユーザーがアップロードしましたが、EXIFを維持してサイズを変更）が30KBの違いを見ました-ちょうどEXIFデータを削除することによって..
—
jeffreypriebe
また、すべてのEXIFデータを削除していることを確認する必要があります。このほとんどすべては、Web上のユーザーとは無関係です。写真を撮るためにCanon 5Dを使用したこと、そしてFストップ2.8、0.5秒間露光、ISO 160、露光バイアスなし、焦点距離9mm
このメタデータはすべて画像に重みを追加するものであり、通常は削除する必要があります。
以下のようjessegavinのポイント、ほとんどの画像のアプリは、あなたの圧縮の効果のプレビューが表示されます-それらを使用し、「8」のブランケット設定としてめったにあなたに可能な限り最高のトレードオフ与えるつもりはありません。
最後に、Google Page Speed Firefox / Firebugプラグインを使用すると、画像サイズをどれだけ縮小できるかを知ることができます（小さなバージョンを表示して保存できるようにするなど）。
目的の品質レベルを維持しながら画像をできるだけ小さくするために他のすべての提案を行ったら、最小限のHTTPヘッダーで画像を提供するようにWebサイトを構成し、提供するヘッダーにより、プロキシサーバーとWebブラウザをキャッシュすることで画像を適切に保存できます。
リクエストのサイズを小さくするには、X-Powered-Byのような無駄なヘッダーを送信しないようにWebサーバーが構成されていることを確認してください。また、Cookieを設定しないホスト（例：static.example.com）から画像、CSS、その他の静的コンポーネントなどを提供していることを確認してください。
静的な画像の場合、Expiresヘッダーを遠い未来の日付に設定します。これにより、Webブラウザーと中央のキャッシュプロキシが可能な限り画像を保持します。これの唯一の欠点は、別の画像を表示したい場合は、別のファイル名を使用し、代わりにリンクする必要があることです。ファイル名のバージョン番号（例：myimage_1.pngまたは/images/3/logo.png）は、これを行う効果的な方法です。静的でないページの場合、現実的なExpiresヘッダー（アクセスとX時間）を設定し、Last-ModifiedヘッダーまたはeTagヘッダー（両方ではない）を設定して、以前にファイルをダウンロードしたブラウザーがすばやくテストできるようにします画像全体をプルダウンする代わりにヘッダーを比較することで、現在のバージョンを持っているかどうか。
これらのテクニックについて議論する多くのリソースがありますが、Yahooはコンテンツ配信のパフォーマンスを改善するための多くのヒントを1か所にまとめて素晴らしい仕事をしました。