ToolRoll
必要な道具を、すぐ広げる。ITミニツール集。

画像圧縮｜JPEG・WebPをブラウザで圧縮

画像ツール

JPEG・WebP、20MB以下の画像を1枚選択してください。

数値を下げると容量が小さくなる場合がありますが、画質も低下します。

JPEGまたはWebP画像を選択してください。

このツールでできること

JPEGまたはWebP画像を1枚選び、形式とピクセル寸法を変えずに、指定した品質で再圧縮して保存できます。元の容量、圧縮後の容量、減少量または増加量と変化率を確認できます。目標容量を指定して自動調整する機能ではありません。

使い方

  1. JPEGまたはWebP画像を1枚選択します。
  2. 画像の読み込み後、品質を1～100で指定します。初期値は80です。
  3. 「画像を圧縮」を押します。
  4. 圧縮後の容量、容量の変化、プレビューを確認します。
  5. 「画像を保存」を押します。

入力例・出力例

1600×900px、10,000バイトのmy photo.jpgを品質80で処理し、ブラウザが6,000バイトのJPEGを生成した場合、寸法は1600×900pxのまま、容量は9.8 KBから5.9 KBになり、3.9 KB減少（40.0%）と表示します。保存名はmy-photo-compressed-q80.jpgです。

同じ品質80でも、5,000バイトの画像から7,000バイトの結果が生成された場合は2.0 KB増加（40.0%）と警告します。この結果も保存できます。ここで示した出力容量は表示計算の例であり、実際の容量は画像内容、元の圧縮状態、ブラウザによって変わります。

透明部分を含むicon.webpを品質55で処理すると、同じ寸法とWebP形式で書き出し、ブラウザが対応する範囲で透明度を維持します。保存名はicon-compressed-q55.webpです。

よくある利用場面

  • Webへ掲載するJPEG・WebPの容量を軽くしたいとき
  • 品質設定ごとの見た目と容量を1枚ずつ比較するとき
  • 画像寸法と形式を変えずに再圧縮したいとき

品質と容量表示の見方

品質は半角数字の整数1～100で指定し、Canvasの画像エンコーダーへ0.01～1の品質ヒントとして渡します。たとえば品質80は0.8です。品質値は元画質を何パーセント残すか、容量を何パーセントにするかを表す数値ではありません。100でも可逆圧縮や元画像との完全一致を意味せず、圧縮方法、画質、色、容量はブラウザのエンコーダーによって異なります。

容量の変化量は「元容量－圧縮後容量」で求め、変化率はその差の絶対値を元容量で割って計算し、小数第1位まで表示します。容量は1,024バイト未満をB、1MiB未満をKB、それ以上をMBとして、KBとMBは小数第1位へ丸めます。元画像がすでに強く圧縮されている場合や単純な画像では、品質を下げても容量が小さくならず、同じか大きくなることがあります。

処理では、ブラウザがデコードした元画像と同じ幅・高さのCanvasへ描画します。JPEGは白い描画面へ、WebPは透明な描画面へ描画し、元と同じ形式で再生成します。Canvasで再生成するため、EXIF、GPS位置情報、撮影日時、DPI、ICCカラープロファイル等のメタデータ保持や、元画像との完全な色一致は保証しません。EXIF Orientationを独自には解析せず、寸法、向き、出力はブラウザがデコードした画像に基づくため、保存前にプレビューを確認してください。品質を変えると以前の結果は破棄され、もう一度圧縮する必要があります。

処理仕様

対応形式はJPEGとWebPで、出力形式とピクセル寸法は元画像と同じです。JPEGとWebPの相互変換や、PNGの圧縮には対応していません。

入力ファイルは20 × 1024 × 1024バイト以下です。画面上の「20MB」は実装上20MiB、20,971,520バイトを表します。元画像は幅・高さ各12,000ピクセル以下かつ40,000,000ピクセル以下です。10,000×4,000pxは画素数上限内ですが、10,000×4,001pxは上限を超えます。上限内でも、大きな画像は端末のメモリやブラウザの制限により処理できない場合があります。

形式はファイル名やMIMEタイプだけでなく、ファイル先頭のシグネチャから判定し、画像としてデコードできることも確認します。MIMEタイプが空、または拡張子・MIMEタイプと実データが異なる場合も、実データがJPEGまたはWebPでブラウザがデコードできれば、その実データの形式で処理します。ブラウザが同じ形式で書き出せず、生成データのMIMEタイプが一致しない場合はエラーになります。

保存名は元ファイル名の最後の拡張子を除き、制御文字、ファイル名に使いにくい記号、連続する空白やハイフンを整理した先頭80文字へ、-compressed-q品質と実データの形式に対応する拡張子を付けます。元名が空になった場合はimage-compressed-q80.jpgのように保存します。アニメーション画像には対応していません。

入力データについて

選択したファイルの名前、容量、ブラウザがデコードした寸法と画素、圧縮後の画像はブラウザ内だけで処理され、ToolRollのサーバーや外部サービスへ送信されません。外部API、外部ライブラリ、Cookie、localStorage、sessionStorage、IndexedDB、ブラウザの履歴は使用しません。「画像を保存」を押したときだけブラウザのダウンロード機能へ生成画像を渡します。