ウェブ用にJPEGを圧縮する方法

大きすぎるJPEGが1枚あるだけで、ページの残り部分をすべて合わせたよりも重くなることがあり、ページが遅く感じる最も一般的な原因になっています。その画像を生成したカメラや書き出し処理は、印刷やフルスクリーン表示向けに最適化されたものであり、サムネイルやヒーローバナー、商品グリッドのような用途は想定されていません。そうした場面では、同じファイルが本来必要な何倍も重くなっていることがよくあります。

朗報は、JPEGが非可逆写真形式であるため、目にはほとんどわからない大量のデータを削れる点です。適切に圧縮し、画像サイズを実際の表示サイズに合わせれば、画面上で見た目の違いがほとんどないまま、写真を元の重さのごく一部にまで縮小できます。

JPG圧縮ツールには画質を調整できるコントロールがあり、サイズと見た目の両方が満足いくまで微調整できます。

• JPEG圧縮ツールを開いて写真をドロップします。複数枚まとめて読み込むこともできます。
• 画質を設定します。ウェブ用の写真であれば、75–82前後がちょうどよい範囲です。画面上では見た目にほとんど差がないまま、ファイルサイズを大幅に削減できます。
• プレビューしてから書き出してダウンロードします。書き出されたファイルは新規のJPEGで、メタデータが除去されているため、隠れたEXIFやGPSの情報がサーバーに送られることはありません。

すべての処理はデバイス内で行われます。ページを読み込んだ後にオフラインにしても動作し続けることが、画像がどこにもアップロードされていない何よりの証拠です。

画質は成功の半分にすぎません。もう半分はサイズです。4000ピクセル幅の写真を、実際には800ピクセルでしか表示されない枠に収めると、訪問者が決して目にすることのないディテールにファイルの大部分が費やされ、それでもブラウザは余分なピクセルをすべてダウンロードしなければなりません。

そのため圧縮する前に、実際に表示される最大サイズ程度まで画像をリサイズしましょう（高密度スクリーン向けに少し余裕を持たせても構いません）。表示枠に合わせてリサイズしてから画質75–82で圧縮した写真は、多くの場合オリジナルの十分の一程度になり、スピード向上としては最大級の効果があります。ひとつ注意点があります。JPEGの圧縮は不可逆で、しかも累積します。すでに圧縮されたJPEGを再圧縮するたびに目に見える劣化が加わるため、必ずオリジナルから始めて、圧縮は一度だけ行ってください。

JPEGは安全で汎用性の高い選択肢ですが、もはや最小のファイルサイズではありません。その現代的な後継であるWebPやAVIFは、同じ見た目の画質をより小さいサイズで実現でき、現行ブラウザでも十分にサポートされています。ページの軽さを優先するなら、JPGをWebPに変換したりAVIFに変換したりして結果を比較する価値があります。

これは「検討する価値がある」という正直な提案であって、絶対的なルールではありません。どこでも確実に開けるファイルが必要なら、JPEGのままで構いません。画質とフォーマットの選び方をより幅広く知りたい場合は、画質を落とさずに画像を圧縮する方法を参照してください。