PNG・JPEG・WebPの違いと使い分け｜画像フォーマット変換の基本

3つのフォーマットの性格

違いの核心は「可逆か非可逆か」と「透過に対応しているか」の2点です。PNGは情報を一切捨てずに圧縮するため画質は完全ですが、そのぶん写真では容量が大きくなります。JPEGは人の目に分かりにくい情報を捨てて小さくするため、写真では非常に効率的ですが、輪郭がはっきりした図やテキストではノイズ（モスキートノイズ）が目立ちます。

迷ったときの選び方

• 透過が必要 → PNG または WebP（JPEGは選べません）
• 写真で、とにかく軽くしたい → WebP、次点でJPEG
• ロゴ・図・スクリーンショットで文字がある → PNG または WebPの可逆
• 配布先の環境が古い・不明（印刷所への入稿、社内の古い業務システムなど）→ PNG または JPEG
• Webサイトに載せる画像 → WebPを第一候補に

WebPは主要なブラウザで対応済みのため、Web掲載用途では基本的に第一候補になります。一方で、相手のアプリやシステムに読み込ませる場合は、対応していないケースがまだ残っています。「Webに載せるならWebP、ファイルとして渡すならPNG／JPEG」と覚えておくと迷いません。

品質設定はどのくらいが適切か

JPEGとWebPには品質（quality）設定があります。100に近いほど劣化は少なく、下げるほど軽くなります。実用上の目安は次のとおりです。

ブラウザで変換する手順

1. 1

   画像を選択する

   PNG、JPEG、WebPなど、手元の画像ファイルを選びます。スマートフォンの写真もそのまま使えます。

2. 2

   変換後のフォーマットを選ぶ

   PNG・JPEG・WebPから選択します。上の使い分けを参考にしてください。

3. 3

   品質を調整する

   JPEGとWebPでは品質スライダーが有効になります。PNGは可逆圧縮のため、品質設定はありません。

4. 4

   変換前後の容量を比べてダウンロードする

   変換後のファイルサイズと削減量が表示されます。期待した効果が出ていなければ、フォーマットや品質を変えて試し直してください。

変換処理はすべてブラウザ内で行われるため、画像がサーバーにアップロードされることはありません。

変換時に気をつけること

• JPEGに変換すると透過が失われます。透明だった部分は白で塗りつぶされるため、透過を残したい場合はPNGかWebPを選んでください。
• 非可逆圧縮は元に戻せません。JPEG→PNGに変換しても、失われた情報は復元されず、容量だけが増えます。
• 再圧縮を繰り返すと劣化が蓄積します。編集の中間ファイルはPNGなど可逆形式で保存し、書き出しの最終工程で非可逆に変換するのが基本です。
• 元画像は必ず残しておいてください。あとから別の形式・別の品質で書き出し直せます。

「PNGにすれば高画質になる」という誤解はよくあります。PNGは劣化させない形式であって、すでに劣化した画像を回復させるものではありません。画質を上げたいときは、変換ではなく元データに戻る必要があります。

AVIF・HEIC・GIF・SVGはどう位置づけるか

手元に届く画像は、PNG・JPEG・WebPだけではありません。iPhoneで撮ればHEIC、Webから保存するとAVIF、ということが増えています。それぞれ「何のために作られた形式か」を押さえておくと、変換すべきかどうかの判断が速くなります。

AVIFが開けない場合の変換手順はAVIF形式の扱い方、iPhoneのHEICをWindowsで開けるようにする手順はHEICをJPEGに変換する方法、WebPが開けないときの切り分けはWebPが開けないときの対処にまとめています。ロゴのSVGだけは仕組みが根本的に違うので、SVGとPNG・JPEGの違いで別に扱っています。

変換しても容量が減らないときに見るところ

形式を変えたのにほとんど軽くならない、という相談はよくあります。原因は形式ではなく、画像そのものの大きさや中身にあることがほとんどです。

• ピクセル数が大きすぎる：4000px幅の写真をそのまま載せている。表示に必要な幅まで縮めるほうが効果は大きい
• 写真をPNGにしている：写真は情報量が多く、可逆圧縮では減らない。JPEGかWebPに変える
• 図やスクリーンショットをJPEGにしている：平坦な面が多い画像はPNGのほうが小さくなることがある
• すでに圧縮済みの画像を再圧縮している：削れる余地が残っていない

よくある質問

PNGとJPEGはどちらを使うべきですか？

写真ならJPEG、ロゴや図、スクリーンショットなど輪郭がはっきりした画像や透過が必要な画像ならPNGが適しています。JPEGは非可逆圧縮のため、文字や細い線があるとノイズが目立ちます。

WebPに変換するとどのくらい軽くなりますか？

画像の内容によりますが、同程度の見た目でJPEGより2〜3割前後小さくなるケースが多く報告されています。ただし効果は画像ごとに差が大きいため、実際に変換して容量を比較するのが確実です。

変換すると画質は落ちますか？

PNGへの変換は可逆圧縮のため、その工程での劣化はありません。JPEGやWebPの非可逆設定では、品質の設定値に応じて劣化します。品質85前後であれば、通常の閲覧で違いを感じることはほとんどありません。

画像フォーマット変換ツールに画像はアップロードされますか？

されません。変換処理はすべてブラウザ内で行われ、画像ファイルがサーバーに送信されることはありません。

透過を保ったままファイルを軽くするには？

WebPを選んでください。WebPは透過に対応しながら非可逆圧縮もかけられるため、透過PNGより大幅に軽くなることがあります。提出先がWebPに対応していない場合は、透過PNGのままピクセル数を減らすのが現実的です。

AVIFに変換したほうがよいですか？

自分のWebサイトに載せる画像なら有力な選択肢です。一方、相手にファイルとして渡す用途では、開けない環境がまだ残っているため避けたほうが無難です。渡す相手が決まっていないときはJPEGかPNGが安全です。