画像圧縮

容量とピクセル寸法を調整する仕組み

画像ファイルを読み込み、品質を指定して再エンコードし、必要なら最大幅・最大高さに合わせて縦横比を保ちながら縮小します。画質の数値を下げる方法と、ピクセル数を減らす方法を組み合わせて、用途に合うファイルを作る仕組みです。画像を何％小さくするか、何KB以下にするかを直接指定する機能ではありません。

品質は10～99%の範囲で調整でき、初期値は80%です。この値はエンコード時の品質設定であり、ファイル容量が同じ割合で減るという意味ではありません。元画像の形式や内容、寸法、ブラウザーのエンコード結果によって、圧縮後の容量は変わります。処理後に元と出力の容量を比較し、実際に小さくなった場合にだけ削減率が表示されます。

品質設定とサイズ上限の見方

幅と高さの上限はそれぞれ800、1280、1920、2560ピクセル、または「制限なし」から選べます。初期値は幅・高さともに1920ピクセルです。どちらか一方でも画像が上限を超える場合、より厳しい側に合わせて縦横比を保って縮小します。たとえば4000×3000ピクセルの画像で幅1920、高さ1280を指定すると、高さ側が先に上限に達し、出力は約1707×1280ピクセルになります。上限より小さい画像を引き伸ばす処理はありません。

PNG画像はJPEGとして書き出され、透明部分には白い背景が入ります。JPEGには透明度を保持する仕組みがないためです。その他の画像形式は、読み込みとブラウザーの書き出し対応に左右されます。書き出し形式に対応していないブラウザーではPNGへ切り替わる場合があります。MDN Web DocsのCanvas書き出し仕様では、品質引数は有損形式の画質を調整する値で、非対応形式はPNGになると説明されています（2026年10月1日確認）。

設定を選んで圧縮結果を保存する

1. 画像を追加します。選択欄から複数ファイルを選ぶか、画像をドロップします。画像として認識されないファイルは処理対象になりません。
2. 品質を調整します。写真の容量を抑えたい場合は品質を低めに試し、文字・細線・ロゴの見た目を優先したい場合は高めから比較します。品質値だけで目標容量に到達するかは判断できません。
3. 幅と高さの上限を選びます。表示用途に必要なピクセル寸法を考えて、幅・高さを個別に設定します。寸法を制限しないときは両方を「制限なし」にします。
4. 圧縮して確認します。画像ごとに圧縮するか、一覧の未処理分をまとめて実行します。処理後は容量の前後比較と出力ピクセル寸法を確認してください。
5. 必要な画像をダウンロードします。個別保存、または完了した画像の一括ダウンロードを選びます。一括ダウンロードは各画像を個別のファイルとして保存します。

アップロード先が「500KB以下」など容量を指定している場合、この画面には目標KBを入力して自動調整する項目はありません。品質や寸法を変えて何度か処理し、実際の出力サイズを確認してください。条件に届かなければ、別の画像編集手段も検討します。

出力形式と容量についてよくある質問

元画像と出力ファイルを照合する

再エンコードでは画像の細部が変化することがあり、出力容量が必ず小さくなるとは限りません。圧縮前のファイルを残し、ダウンロード後に見た目、寸法、拡張子、実際に開けることを確認してから利用してください。特に文字入り画像、細い線、グラデーションは拡大して比較すると差に気づきやすくなります。

PNGの透明部分は白背景に置き換わります。また、ブラウザーが指定の出力形式に対応していない場合、データ形式がPNGに切り替わることがあります。元の拡張子と中身が一致しない可能性もあるため、形式が重要な提出や透過素材には、テスト用コピーで先に結果を確かめてください。アニメーション画像や特殊な画像形式も、元の動きや情報が保たれるとは限りません。