画像の容量指定圧縮｜指定のKB以下に収めて画質と画素数の2案を比較
アップロードの「200KB以下」のような上限に画像を収めます。画素数を保って品質を下げる案と、品質を保って画素数を減らす案を同じ上限で作り、並べて選べます。1KBを何バイトで数えるかも選べます。
クリックまたはドラッグ＆ドロップで画像を選択
JPEG・PNG・WebP（最大50MB）
容量を小さくしたい画像を選んでください
決めた容量に収めた 2 つの案（画素数を保つ / 品質を保つ）を並べます
このツールについて
使い方・特徴・補足情報
画像の容量指定圧縮とは
画像の容量指定圧縮は、画像を決めた容量以下に収めるツールです。応募フォームの「200KB以下」のような上限に合わせるときに使います。
容量を減らすには、品質を下げるか画素数を減らすかのどちらかが要ります。このツールは両方の案を同じ上限で作り、並べて出します。
A案は縦横のピクセル数を保ち、品質を下げて収めます。B案は品質85を保ち、縦横比はそのままで画素数を減らします。
収まったかどうかは、実際に書き出したバイト数で判定します。1KBを1,000バイトで数えるか、1,024バイトで数えるかも選べます。
こんな人におすすめ
申請や投稿で画像を送る人
楽になること
画像を容量の上限に収める作業
避けたい手間
上限を超えて送れないこと
解決できる困りごと
- 品質の数字を少しずつ変えては保存し直し、容量を確かめる往復がなくなる
- 上限ぎりぎりに作ったつもりが、1KBの数え方の違いで弾かれる失敗を防げる
- 文字の多い画像を縮めすぎて読めなくなる前に、品質を下げる案と見比べられる
- 自動で縮めたあと何を削ったのか分からず、提出後に粗さに気づく事態を減らせる
- 上限を超えたファイルを気づかずに送ってしまうことがなくなる。超えた案は保存できないため
使い方
- 画像をドラッグするか、ファイルを選びます。JPEG・PNG・WebPを読み込めます。
- 目標の容量を数字で入れ、単位をKBかMBから選びます。
- 必要なら、1KBの数え方と保存する形式を選びます。
- 「この容量に収める」を押し、2つの案ができるのを待ちます。
- 容量・縦横・品質を見比べ、使うほうの案を保存します。
使用例
横4,000pxの風景写真を200KB以下にする
4,000×2,670pxの風景写真（1.9MB）をChromeで200KB以下に収めた例です。2つの案で何を残し、何を削ったかに注目してください。
入力
画像: 4,000 × 2,670 px / JPEG / 1,961,471 バイト
目標: 200 KB（1KB = 1,000 バイト）→ 200,000 バイト
保存する形式: JPEG
出力
A 画素数を保つ: 4,000 × 2,670 px・品質 10
→ 196,770 バイト（上限の 98.3%）
B 品質 85 を保つ: 1,336 × 892 px・品質 85
→ 199,801 バイト（上限の 99.9%）
同じ100KBでも上限のバイト数が違う
送り先が1KBを何バイトで数えるかで、上限が2,400バイト変わる例です。1,000で数えて作れば、どちらの送り先にも収まります。
入力
目標: 100 KB
出力
1KB = 1,000 バイト → 100,000 バイト以下
1KB = 1,024 バイト → 102,400 バイト以下
101,000 バイトの画像は、1,024 で数える送り先には通り、1,000 で数える送り先では超える
目標が小さすぎるときの2案
品質を下げるだけでは収まらない例です。収まらない案は保存ボタンを出さず、試した中でいちばん小さかった容量を出します。
入力
画像: 4,000 × 2,670 px / 目標: 1 KB（1,000 バイト）
出力
A 画素数を保つ: 収まりません
（試した中で最小は品質 1 の 78,693 バイト）
B 品質 85 を保つ: 24 × 16 px・946 バイト
活用シーン
応募フォームに写真を添付する
「写真は500KB以下」と書かれたフォームに合わせます。顔の細かさを残すか、画素数を残すかを見比べて選べます。
資料のスクリーンショットを送る
文字の多いスクショは、画素数を減らすと字がつぶれます。拡大して見比べ、読めるほうの案を保存します。
投稿サイトの容量上限に合わせる
ブログや掲示板の画像に上限があるときに使います。上限の何%まで使ったかが出るので、余裕を見て選べます。
WebPを受け付ける送り先に出す
形式をWebPにして、同じ上限で2案を作ります。JPEGのときと比べて、品質や画素数がどれだけ残るかを確かめます。
1,024で数える送り先に合わせる
送り先が1KBを1,024バイトで数えると分かっているなら、数え方を切り替えます。上限を2.4%広く使えます。
技術的な解説
補足: 仕組み
画像はcreateImageBitmapで読み、Canvasに描いてからcanvas.toBlobで書き出します。toBlobの品質は0〜1の値で、JPEGとWebPにだけ効きます。
A案は品質を、B案は長辺のピクセル数を二分探索で決めます。書き出すたびにBlobのsizeを見て、上限以下のものだけを候補にします。
品質と容量は、隣り合う値で大小が逆転することがあります。そのため結果は「試した中で収まった最も高い値」とし、試した回数も出します。
もっと詳しく
1KBは1,000バイトか1,024バイトか
容量の単位には、1KBを1,000バイトとする数え方と1,024バイトとする数え方があります。送り先の案内に、どちらで数えるかまで書かれているとは限りません。
100KBなら、上限は100,000バイトと102,400バイトで2.4%違います。1,024で数えてぎりぎりに作ると、1,000で数える送り先では超えてしまいます。
既定は1,000です。1,000で数えて収めれば、1,024で数える送り先にも必ず収まります。
品質を下げるか画素数を減らすかの選び方
画素数を減らすと、細い線や小さな文字がつぶれます。品質を下げると、色の境目にブロック状のノイズが出ます。
どちらが目立つかは画像によって変わります。文字の多いスクリーンショットと風景写真では、向く案が逆になることもあります。
迷ったら「拡大して見比べる」を開いてください。2つの案の同じ位置を、元の画像と同じ倍率で並べます。
PNGを保存形式に入れていない理由
PNGは画質を落とさない形式で、canvas.toBlobの品質の指定が効きません。容量を減らす手段が画素数だけになり、A案が作れません。
写真をPNGで保存すると、JPEGよりかなり大きくなることがあります。容量に上限があるときは、JPEGかWebPを選んでください。
透明な部分がある画像をJPEGにすると、その部分は白で塗られます。
よくある質問
目標よりだいぶ小さくなるのはなぜですか？
品質は1刻み、画素数は1px刻みでしか変えられないためです。1段上げると上限を超えるときは、その手前で止まります。
上限の何%を使ったかは、案ごとに出します。
元の画像がすでに目標より小さいときは？
変換しなくても容量の条件は満たしているので、その旨を画面に出します。
JPEGに限るなど形式の指定があるときだけ、案を保存して使ってください。
撮影日時や位置情報は残りますか？
書き出したファイルには残りません。Canvasに描き直して、新しく書き出すためです。
写真の向きは画素に反映してから書き出すので、横倒しにはなりません。
どちらの案も収まらないと出ました。
目標が小さすぎて、品質1や、縦横比を保てるいちばん小さい大きさでも超えています。目標を上げるか、送り先の上限を確かめ直してください。
試した中でいちばん小さかった容量を、案ごとに画面に出します。
画像はどこかへ送られますか？
選んだ画像はブラウザの中だけで処理され、サーバーへは送られません。書き出しもプレビューも端末の中で完結します。
なお、サイト自体はアクセス解析と広告を使っています。詳しくはプライバシーポリシーをご覧ください。
関連記事
このツールの使い方や活用例をブログでも紹介しています。
関連ツール
同じカテゴリの他のツールも合わせてどうぞ。