JPGとPNGの違いを一覧で比較
| JPG(JPEG) | PNG | |
|---|---|---|
| 圧縮方式 | 非可逆圧縮:細かい情報は削られる | 可逆圧縮:すべてのピクセルを保持 |
| 透過 | 非対応 | 対応(半透明も可) |
| 写真のファイルサイズ | 小さい | 数倍大きい |
| スクリーンショットや図のファイルサイズ | 大きくなりがちで、輪郭がぼやける | 小さく、くっきり鮮明 |
| 繰り返しの編集 | 保存するたびに少しずつ劣化 | 劣化なし |
| おすすめの用途 | 写真、写真をスキャンした画像 | スクリーンショット、文字、ロゴ、アイコン、グラフ |
結論:写真にはJPG、くっきりした輪郭や文字、透過を含む画像にはPNG。
JPEGの圧縮のしくみ
1992年に標準化されたJPEGは、人間の目の特性に基づいて設計されています。目は色の細部にあまり気づかないため、明るさと色を分けて、通常は色をより低い解像度で保存します。次に画像を8 × 8ピクセルのブロックに分割し、各ブロックを周波数成分に変換(離散コサイン変換)して、最も細かい情報を丸めて削ります。どれだけ削るかを決めるのが画質の設定です。残ったデータは、ハフマン符号化で圧縮されます。
写真の場合、この方式は驚くほどうまく機能します。画質85~90%のJPGは、非圧縮時のごく一部のサイズでありながら見た目は変わりません。しかし、くっきりした輪郭や文字の周りでは、この丸めがブロック状のノイズやうっすらとしたにじみとして現れます。また、JPGは編集して保存し直すたびに、細部が少しずつ失われていきます。
PNGの圧縮のしくみ
PNGは、GIFに代わる特許フリーの形式として1996年に誕生しました。PNGは情報を一切削りません。まずピクセルの各行に、隣接するピクセルから値を予測するフィルターをかけ、その結果をDEFLATE(ZIPファイルと同じ圧縮方式)で圧縮します。単色の広い領域や繰り返しのパターン、くっきりした輪郭は非常によく圧縮されますが、写真のような不規則な細部はほとんど圧縮されません。
PNGは、1チャンネルあたり最大16ビットのフルカラー、なめらかな透過を実現するアルファチャンネル、ごく小さなグラフィック向けの最大256色のパレットモードに対応しています。
JPGを使うべき場面
- カメラやスマートフォンで撮影した写真
- 写真や、画像入りの書類をスキャンしたもの
- Webサイト、メール、SNSに載せる写真
- ピクセル単位の正確さよりも、ファイルサイズの小ささを優先したいとき
ほとんどの用途では、画質80~90%が最適なバランスです。
PNGを使うべき場面
- スクリーンショット(特に文字や操作画面を含むもの)
- ロゴ、アイコン、ベタ塗りのグラフィックやイラスト
- グラフ、図表、線画
- 背景を透明にする必要がある画像
- 何度も編集・保存し直す画像
WebP・AVIF・HEIC・GIFとの違いは?
- WebPは非可逆・可逆のどちらの圧縮にも対応し、透過も使えます。ファイルはJPGやPNGより明らかに小さくなることが多く、現在のすべてのブラウザで表示できるため、Webサイトに適しています。
- AVIFはWebPよりもさらに圧縮率が高く、現在のブラウザは対応していますが、ほかのソフトではまだ対応していないものが多くあります。
- HEICはiPhoneの写真形式です。効率に優れていますが、ほとんどのブラウザや多くのソフトが対応していないため、JPGに変換されることがよくあります。
- GIFは256色に制限されており、今では簡単なアニメーション用途くらいにしか使われません。
- SVGはベクター形式です。元のベクターファイルがあれば、ロゴやアイコンには最適な選択肢です。
JPGとPNGを相互に変換する方法
PNGからJPGへの変換では、写真や大きな画像のサイズを大幅に小さくできます。透明部分は背景色で塗りつぶされます。JPGからPNGへの変換では、画像を編集し続けるときのさらなる劣化を防げますが、JPEG圧縮ですでに失われた細部は戻らず、ファイルが大きくなるだけです。どちらの変換も、このサイトの「PNG JPG 変換」と「JPG PNG 変換」のツールを使えば、ブラウザ上で複数のファイルをまとめて行えます。
JPG・JPEG・JFIFの違いは?
これらはすべて同じ形式です。JPEGは規格の名前(Joint Photographic Experts Groupに由来)で、.jpgが普及したのは、初期のWindowsでは3文字の拡張子しか使えなかったためです。.jpegや.jfifは、同じ画像データに対する別の拡張子です。拡張子を変更しても、画像には何の変化もありません。
よくある質問
PNGはJPGより画質が良いのですか?
PNGは可逆圧縮なので、細部が失われることはありません。ただし写真の場合、画質85~90%のJPGなら、ごく一部のファイルサイズで見た目は同じです。つまり写真においてPNGは「より良い」わけではなく、サイズが大きいだけです。
WebサイトにはJPGとPNGのどちらを使うべきですか?
写真にはJPG(またはWebP)、スクリーンショットやグラフィック、透過のある画像にはPNG(またはWebP)を使いましょう。ロゴやアイコンには、SVGが最適な場合が多いです。
JPGをPNGに変換すると画質は良くなりますか?
いいえ。PNGの見た目はJPGとまったく同じです。画像をさらに編集するときに、追加の劣化を防げるだけです。
最終更新日: