画像圧縮

提出先の「容量」と「画像サイズ」を確認する

画像を添付できないときは、まず提出先の条件を確認してください。「3 MB以下」といった容量の指定だけでなく、JPG限定、幅1000ピクセル以上など、形式や縦横のサイズが決められていることもあります。

KBやMBで表すのがファイルの容量です。一方、3000 × 4000ピクセルのような数値は、画像の幅と高さを表します。縦横のピクセル数が同じでも、保存形式や写っている内容によって容量は変わります。

縦横のサイズを変えられない場合は、元のサイズを維持して画質を調整します。必要以上に大きな画像なら、長辺を短くする方法もあります。ただし、提出先が指定する最小サイズを下回らないようにしてください。

長辺を指定すると、縦横はどう変わる？

長辺は、幅と高さのうち長いほうです。このツールでは、長辺の上限を1920・1280・800ピクセルから選べます。縦横の比率を保って縮小するため、画像の一部が切れたり、横に引き伸ばされたりすることはありません。

たとえば、幅3000 × 高さ4000ピクセルの縦長写真で、長辺を1280ピクセルにすると、幅960 × 高さ1280ピクセルになります。短いほうの幅も、同じ割合で縮小されるためです。

下の表は、この縦長写真のサイズを計算した例です。圧縮後の容量を示すものではありません。選んだ長辺より小さい画像は拡大せず、そのままの縦横サイズで処理します。

小さな文字がある画像は、縮めすぎない

風景写真と、文字の多いスクリーンショットでは、残したい情報が違います。写真全体が見えればよい場合でも、申込画面や資料の画像では、小さな文字まで読めることが大切です。

迷ったら、まず初期値の画質80で試してください。文字がある画像は、縦横のサイズを維持したまま画質を調整し、保存した画像を開いて確認します。縮小表示のプレビューだけでは、文字のにじみや輪郭の崩れを見落とすことがあります。

画質を下げて文字が読みにくくなったら、数値を上げてやり直します。写真では、顔、髪の毛、細かな模様、空のような色の変化にも目を向けてください。容量が減っていても、必要な部分が見えなくなれば、その設定は用途に合っていません。

画質の数値は、残る情報の割合や、元の容量に対する割合ではありません。100を選んでも無劣化を保証するものではないため、編集用の元画像は残しておきましょう。

透明な背景を残すなら、保存形式を確認する

背景が透明なロゴやイラストは、WebPを選ぶと透明部分を保って保存できます。JPGでは透明部分が白くなります。白以外の背景に重ねる予定があるなら、この違いを先に確認しておくと選びやすくなります。

ただし、提出先がWebPに対応しているとは限りません。JPG指定ならJPGで保存し、白い背景で問題がないか確認してください。JPGとJPEGは同じ形式を指します。

PNGは読み込みに対応していますが、保存形式には選べません。PNGを追加した場合も、保存できるのはJPGかWebPです。背景を消す機能はないので、元から写っている背景は、WebPに変えても透明にはなりません。

画像を選び、圧縮後のファイルを保存する

「画像を選択」からファイルを追加するか、画像を枠内にドラッグ＆ドロップします。「保存形式」「画質」「長辺」を選んだら、「画像を圧縮」を押してください。

結果には、元の容量、圧縮後の容量、保存される画像の縦横サイズが表示されます。内容を確認し、必要な画像の「ダウンロード」を押します。ファイルは1枚ずつ保存でき、元の名前に-compressedが付きます。

設定を変えると、それまでの結果はクリアされます。選択済みの元画像からもう一度圧縮してください。ダウンロードした画像を何度も圧縮し直すより、元画像から条件を変えて試すほうが、繰り返しの劣化を避けられます。

処理を途中でキャンセルしても、すでに完了した画像はダウンロードできます。最後に保存したファイルを開き、提出先の容量や形式の条件を満たしているか確認してから添付してください。

読み込める画像と処理の上限

読み込めるのは、静止画のJPG・PNG・WebPです。アニメーションPNGやアニメーションWebPには対応していません。GIF・HEIC・SVGも対象外なので、必要であれば別の方法で対応形式に変換してから追加してください。

容量と画素数の上限は別々に判定します。20 MiB以下でも、2400万画素を超える画像は読み込めません。その場合は、別の画像編集ソフトなどで縦横のサイズを小さくしてから追加してください。

保存形式に対応していないというメッセージが出たときは、JPGを選んで試してください。画像を開けない場合は、元のファイルが正常に開けるかも確認しましょう。

容量や保存結果についてのよくある質問

参考資料

• MDN：HTMLCanvasElement.toBlob()ブラウザーで画像を保存する際の形式や画質の指定について説明しています。
• Google：WebPの概要（英語）透過など、WebP形式の特徴を確認できます。このツールで利用できる機能は本文に記載した範囲です。