ウェブ向けの画像圧縮とリサイズ

圧縮より先にリサイズ

最大の効果はほぼ常に品質ではなく寸法から得られます。ファイルサイズはピクセル数に比例するため、幅と高さをそれぞれ半分にすれば、圧縮をかける前にデータの約4分の3が消えます。表示幅が800ピクセルを超えない画像を4,000ピクセルで保存するのは、誰も見ないピクセルに4〜5倍を払っているようなものです。

順序が大切です。巨大な画像を圧縮してからブラウザーで縮小するのは、節約しようとした帯域をそのまま無駄にする行為ですし、強く圧縮してから縮小するとアーティファクトは減るどころか目立つことが多いのです。実際に表示される最大サイズを決め、そこまでリサイズしてから品質を考えましょう。

形式を選ぶ

JPEG は写真向けです。人間の目が気づきにくい情報を捨てる方式なので、グラデーションや肌の階調では美しく働き、輪郭のはっきりした部分では弱くなります。PNG は可逆でピクセルを完全に保持するため、スクリーンショット・ロゴ・線画、そして透過が必要な場面に適しており、写真には不向きです — 必要の数倍のサイズになります。

WebP は両方をカバーし、同程度の見た目の品質で JPEG より通常25〜35%小さく、PNG のような透過にも対応します。ブラウザー対応はもう何年も実質的に普遍的なので、多くのサイトでの正直な答えはこうです — WebP を使い、よほど古い環境を支える必要があるときだけ元形式をフォールバックとして残す。

品質スライダーが実際にしていること

品質値は何かのパーセンテージではありません。どれだけ積極的に情報を捨てるかを決めるつまみであり、目盛りは線形ではありません。意味のある範囲は狭く、およそ75〜85であればたいていの写真は通常の表示サイズで原画と見分けがつかず、ファイルは品質100のごく一部で済みます。90を超えると、買っているのは見える品質ではなくバイト数です。

選び方の正解は推測ではなく実際に見ることです。いくつかの設定で書き出し、拡大した状態ではなく**実際に表示されるサイズ**で比べてください。400%拡大では明らかなアーティファクトも、実際の配置では見えないことがよくあります。誤った倍率で判断することが、必要の2〜3倍の画像を公開してしまう最大の原因です。

再圧縮はただではない

非可逆形式は再エンコードのたびに劣化します。JPEG を開いて少し手を入れて保存し直せば情報は二度目に捨てられ、損失は積み重なります — 何度も往復した画像特有の、ブロック状でにじんだ見た目がそれです。原本を最高品質で保管し、派生物は常に原本から書き出すべき理由がここにあります。

すでに小さいファイルは、それ以上圧縮しても意味のある効果が出ないことがある、という意味でもあります。一度圧縮を通した画像をもう一度かけると、見える品質を数キロバイトと引き換えにしがちです。結果を受け入れる前に、実際にどれだけ減ったかを確認しましょう。

使わない情報は削る

写真には公開したくないメタデータが付いてきます — カメラの機種、撮影設定、時刻、そしてスマートフォンなら撮影地の GPS 座標まで含まれることが珍しくありません。容量であると同時にプライバシーの問題であり、アプリ間でコピーしても残り続けます。

公開前の短いチェックリスト:

• 実際に表示される最大サイズに合わせてリサイズする。
• 写真は WebP を優先し、スクリーンショット・ロゴ・透過は PNG のままにする。
• 品質75〜85で書き出し、拡大ではなく表示サイズで比較する。
• 派生物は必ず原本から書き出し、圧縮済みのコピーから作らない。
• 公開するものからは EXIF、とくに位置情報を削除する。