# 画像圧縮 — ファイルサイズの上限に収める サイズを指定するだけ。あとは自動で探します。 > JPEG、PNG、WebP、AVIFを100 KBや2 MBなどのファイルサイズ上限に収めます。目標以下のサイズを目指し、バイト数が完全一致する保証はありません。アップロード不要、オフライン対応。 これはhttps://abox.tools/ja/compress-image/にあるブラウザー用の対話型ツールです。ファイルはそのブラウザーを実行する端末上で処理します。意図した共有や任意の通信機能はページ内で説明します。以下は文章による説明です。利用するにはアドレスを開いてください。 ## 画像は**ブラウザー内で処理**されます。処理のためのアップロードはありません。 圧縮を行うのは、お使いのブラウザと手元のハードウェア、そしてブラウザに最初から入っているエンコーダーです。このツールにはネットワーク機能が一切ありません。取りに行く先も、送る先もありません。仮に送ろうとしても、このページの向こう側に画像を受け取るサーバーが存在しません。 - ✗ アップロードなし - ✗ 登録なし - ✗ 容量制限なし - ✓ オフラインで動作 - ✓ ソース公開 ## 画像を指定サイズに圧縮する手順 1. **画像を選びます。** 選択欄にドロップするか、手で選んでください。ブラウザがディスクから直接読み出します。その間に何かがどこかへ送られることはありません。 2. **指定されたサイズを打ち込みます。** 写真を何度も突き返してくるアップロード欄なら100KB、応募フォームなら500KB、速く表示したいページなら2MB。よく使う4つはボタンになっています。 3. **「目標サイズまで圧縮」を押します。** 収まる範囲でいちばん高い画質へ絞り込みながら、各画像が何度もエンコードされます。すでに目標を下回っているものには、まったく手をつけません。 4. **代償を確かめて、ダウンロードします。** どの結果にも、どの形式で書き出したか、画質はいくつか、寸法が変わったか、測ってみて元とどれだけ一致しているかが表示されます。「比較」を押すと2枚を並べて見られます。 ## 詳しい解説 [画像をファイルサイズ上限以下に圧縮する方法](https://abox.tools/ja/guides/compress-an-image-to-a-target-size/): アップロード欄は500KBを求め、手元の写真は4MB。サイズ制限が実際に何を犠牲にするのか、どの設定から動かすべきか、そしてPNGがJPEGのようには縮まない理由。 ## 箱の中のほかのツール - [画像リサイズツール](https://abox.tools/ja/resize-image/): サイズを指定し、枠を描き、形式を選ぶ。それだけです。 - [HEIC→JPG変換ツール](https://abox.tools/ja/heic-to-jpg/): iPhoneが作る写真を、どこでも開ける形式に。 - [WebPをJPGに](https://abox.tools/ja/webp-to-jpg/): ウェブから保存した画像を、どこでも使える形式へ。 - [PNGをWebPに](https://abox.tools/ja/png-to-webp/): 同じ画像を、透明な部分はそのまま、多くの場合3分の1ほど小さく。 ## よくある質問 ### 画像はどこかにアップロードされますか？ されません。読み込みも圧縮も計測も、お使いのブラウザが手元のハードウェア上で、最初から入っているJPEG・PNG・WebPのエンコーダーを使って行います。このツールにはネットワーク機能が一切なく、何も取りに行かず、何も送りません。ページの`Content-Security-Policy`には接続してよいアドレスがすべて挙がっていますが、そのどれも当サイトのものではありません。 ### ファイルサイズの上限にどう収めますか？ 候補を何度かエンコードして測定し、上限に収まる最高の画質を探します。対応する候補を作れる場合、結果は目標以下になりますが、入力したバイト数と完全に一致するとは限りません。すでに上限以下のファイルは変更しません。画質の調整だけで足りなければ寸法を縮小するので、結果を確認してください。 ### ここでいう「劣化は最小限」とは具体的に何ですか？ 3つあります。1つ目、すでに目標を下回っている画像は再エンコードせず、1バイトも変えずにそのまま通します。2つ目、解像度より先に画質を使い、圧縮のノイズが見え始める下限までしか下げません。そこを超える場合は画像そのものを小さくして画質を戻します。荒れたピクセルが多いより、きれいなピクセルが少ないほうが見た目は良いからです。3つ目、収まる結果が見つかったあとは予算を使い切るまで上へ押し戻すので、500KBと指定して300KBのファイルが返ってくることはありません。 ### 結果に出ているSSIMとPSNRは何の数字ですか？ 圧縮の代償を測った数字です。書き出した結果を読み直し、元の画像と比べています。SSIMは局所的な明るさ・コントラスト・構造を比べるもので、変わったピクセルを数えるより、人の目が気にする点にずっと近い指標です。おおむね0.98を超えると、並べても見分けがつきにくくなります。PSNRは昔ながらのデシベル値です。どちらも手元の端末で計算し、どちらも表示します。劣化が小さいという主張を、言いっぱなしにせず確かめられるようにするためです。 ### 読み書きできる形式は何ですか？ ブラウザがデコードできるJPEG、PNG、WebP、GIF、BMP、AVIFなどを読み込みます。新しい符号化にはJPEG、PNG、WebPを使います。目標サイズ以下のファイルは、形式もメタデータも変えずに返します。符号化が必要な場合、自動はブラウザが書き出せる元の形式から始めます。書き出せない場合、GIFはPNG、AVIFやBMP、MIME型が不明な入力はJPEGから始めます。その後、見た目の損失が少なく目標に収まるならWebPを選ぶことがあります。 ### PNGがあまり小さくならないのはなぜですか？ PNGが可逆だからです。回すべき画質のつまみがありません。PNGを小さくする手はピクセルを減らすか色を減らすかしかないので、PNGを選んだ場合、このツールは縮小だけで目標に近づけます。写真であればJPEGかWebPのほうが、見て問題ないとわかる画質のまま目標にずっと近づきます。ロゴや透過のあるスクリーンショットなら、JPEGが白で埋めてしまう透過をWebPは保ちます。 ### 圧縮するとEXIFやGPSの情報は消えますか？ 再エンコードした結果には、元のEXIF、GPS、日時などのメタデータを引き継ぎません。キャンバスは画素だけを持つためです。すでに目標サイズ以下のファイルは、メタデータごと変えずに返します。[EXIFビューアー・削除ツール](https://abox.tools/ja/exif-editor/)はJPEG、PNG、WebPの画像を再エンコードせずにメタデータを閲覧・編集します。AVIFは抽出できたEXIFの読み取り専用表示に対応し、最初にデコードした画像を新しいPNGへ変換して削除します。色やHDRが変わる場合があります。 ### 無料ですか。アカウントは必要ですか？ 無料です。アカウントも、ログインも、試用期間も、透かしもありません。ファイルの数にもサイズにも制限はありません。その費用を払うサーバーが存在せず、処理が手元の端末で起きているからです。このサイトには広告があり、それが費用を賄っています。広告に画像の情報が渡されることはありません。 ### オフラインでも動きますか？ 動きます。ページを一度読み込んでから通信を切っても、そのまま使えます。何もアップロードされていないことを示す、いちばん簡単な方法でもあります。圧縮のために画像をどこかへ送っている道具なら、線を抜いた瞬間に止まるからです。 ## この主張を確かめる方法 - **処理はこのブラウザー内で行います。** 入力と結果はブラウザー内で処理し、処理コードはそれらを処理用にアップロードしません。Content-Security-Policyは資源と接続先を制限しますが、許可済みの相手はリクエストを受け取れます。内容は検査せず、何も送られないことを単独で証明しません。具体的な操作の要求とソースを比較するか、切断中にローカル操作を完了してください。 - **何かを取りに行くコードがありません。** `src/`のどこにも`fetch`も`XMLHttpRequest`も`sendBeacon`もありません。圧縮の実体は`canvas.toBlob`、つまりブラウザにすでに入っているエンコーダーです。 - **数値は測ったもので、報告したものではありません。** サイズも、画質の数値も、SSIMによる比較も、すべてこのページの中で計算して表示しています。ファイル名もサイズも件数も結果も運ぶような独自の解析イベントは、このリポジトリのどこにもありません。 - **Googleが読み込むものと、渡されないもの。** 広告と計測のスクリプトはGoogleから、寄付ボタンはBuy Me a Coffeeから来ています。そのどれにも、画像に関する情報は渡されません。ファイルを読み、圧縮し、測るコードはすべてこのオリジンから配信され、リポジトリに載っています。 - **オフラインで動きます。** 通信を切ってもこのツールは何も変わりません。もともと通信する段階が存在しないからです。これがいちばん単純な証明です。 **自分で確かめてください。**以上のどれも、鵜呑みにする必要はありません。このページは、リポジトリにあるテンプレートと設定から、誰でも読んで実行できるビルドスクリプトが生成しています。その結果は`dist`ブランチに置いてあるので、配信されているものと、ソースをビルドした結果とを差分で比べられます。 https://github.com/A-Box-of-Tools/website まず読むとよいのは、Content-Security-Policyについては`config/site.toml`、どこまで画質を使うかを決める探索については`src/compress.js`、「見た目の一致度」の数値の裏にある比較については`src/measure.js`です。