JPGをPNGに変換する方法: どちらをいつ使うか
JPG と PNG はウェブで最も一般的な 2 つの画像フォーマットです。ほとんどの人には同じに見えますが、内部では非常に異なる動作をします。間違ったものを使うと、不必要に大きなファイル、予期しない品質損失、透明性の欠如、間違った色で印刷される印刷物につながる可能性があります。それぞれの方向にいつ変換するか(そしていつ WebP や AVIF を選ぶか)を知ることは、日常的な作業を小さいが重要な決定に変えます。
JPG と PNG の簡単な歴史
JPEG(Joint Photographic Experts Group)は 1992 年に標準化され、ほぼ一夜にして主要な写真フォーマットになりました。非圧縮ビットマップに対する帯域幅の節約は莫大で、特許状況はブラウザが受け入れるのに十分有利でした。PNG(Portable Network Graphics)は 1996 年に、当時 Unisys の LZW 特許に縛られていた GIF の代わりとして、無料で可逆、ウェブに優しい代替として登場しました。PNG は 24 ビットカラー、アルファ透明性、ガンマ補正、ストリーミングフレンドリーなチャンク構造を追加しました。GIF の特許は 2004 年に最終的に失効しましたが、その時までに PNG はすでに可逆ニッチを獲得していました。
20 年後、WebP(Google、2010 年)と AVIF(Alliance for Open Media、2019 年)が、より小さなファイルで非可逆と可逆の両方のケースを処理する普遍的な代替として登場しました。ブラウザサポートは 2024 年までに WebP で 97% 以上、AVIF で 92% 以上に達したため、ほとんどの現代のチームは新しいコンテンツにそれらをデフォルトで使用します。JPG と PNG は依然として遍在しています。なぜなら、何十億もの既存のアセット、サードパーティ API、メールクライアントが依然としてそれらを最低共通分母として扱うからです。
重要な違い
JPG(JPEG)は非可逆圧縮を使用します。目が気づきにくい画像データを破棄することでファイルを小さくします: 高周波の詳細、彩度の高い領域の微妙な色のグラデーション、人間の視覚システムが注意を払わない領域の情報。写真には素晴らしく、シャープなグラフィックには悪いです。
PNG は可逆圧縮を使用します。DEFLATE(ZIP と同じアルゴリズム)を使用してすべてのピクセルを正確に保持するため、ファイルは大きくなりますがピクセル単位で完璧です。スクリーンショット、ロゴ、テキスト、シャープなエッジ、透明性のあるものに最適です。
不一致がほとんどのフォーマット選択ミスの原因です: ワイヤーフレーム図の 4 MB の JPEG、休暇写真の 8 MB の PNG、そして 2 秒で読み込まれるべきところを 20 秒で読み込まれる結果のページ。
JPG を PNG に変換するとき
- 透明性が必要: JPG は透明な背景をサポートしません。画像を色付きまたはテクスチャ付きの背景に配置する必要があり、白いボックスが見えないようにしたい場合は PNG に変換します。
- 画像を繰り返し編集している: JPG を保存するたびに、再圧縮されてさらに少し品質が失われます。最初に PNG に変換し、必要なだけ編集し、終わったときだけ JPG に戻して保存します。
- 画像にテキストまたはシャープな線がある: JPG 圧縮はシャープなエッジの周りに目に見えるアーティファクト(有名な「リンギング」のハロー)を作ります。PNG はテキストを鮮明に、線をクリーンに保ちます。
- デザインツールでレイヤー化している: Figma、Sketch、PowerPoint は背景の上に合成するとき、JPG よりも PNG をクリーンにレンダリングします。
- ドキュメント用のスクリーンショットが必要: スクリーンショットは常に PNG として良く見えます。UI 要素には JPEG が台無しにするシャープなエッジがあります。
- 画像がグラフ、図、または QR コード: 大きなフラットカラーの領域と硬い境界のあるものは、PNG が設計されたものです。
PNG を JPG に変換するとき
- 写真とリアルな画像: PNG の写真は同じ画像の高品質 JPG の 3〜5 倍のサイズになる可能性があり、目に見える違いはありません。
- ファイルサイズを減らす必要がある: メール経由での写真送信やウェブサイトへのアップロードは JPG の方がはるかに速いです。6 MB の PNG は知覚的な損失なしに 600 KB の JPG になることが多いです。
- 透明性が必要ない: 常に白または単色の背景にある場合、JPG はより小さく、完全に問題ありません。
- 印刷業者に送信: 多くの印刷サービスは依然として写真コンテンツに JPG を期待します。PNG は問題ありませんが、常に推奨されるわけではありません。
- サイズ上限のあるプラットフォームにアップロード: ほとんどのプラットフォームのプロフィール写真は JPG にどのみち圧縮されるので、最初に変換すると品質を制御できます。
変換方法
JPG から PNG へ:
- JPG ファイルをアップロード、ドラッグ&ドロップまたはクリックして参照。変換ツールは JPEG、JPG、JPE 拡張子を受け入れます。
- 「PNG に変換」をクリックして処理。変換はブラウザで実行され、何もアップロードされません。
- 可逆 PNG 画像をダウンロード。結果のファイルは大きくなりますが、ソースのすべてのピクセルを含みます。
PNG から JPG へ:
- PNG ファイルをアップロード。
- 必要に応じて品質スライダーを調整(高品質 = 大きいファイル)。85〜92 がほとんどの写真のスイートスポットです。
- 透明性の処理方法を選択(透明なピクセルが白、黒、または選んだ色になります)。
- 圧縮された JPG 画像をダウンロード。
フロー全体はクライアント側で実行されます: ファイルが FileReader で読み込まれ、ブラウザでデコードされ、キャンバスに描画され、canvas.toBlob で再エンコードされます。機密性の高いスクリーンショットでさえマシン上に残ります。
クイックリファレンス
| 機能 | JPG | PNG |
|---|---|---|
| 圧縮 | 非可逆 | 可逆 |
| 典型的なファイルサイズ | 小さい | 大きい |
| 透明性 | なし | あり(8 ビットアルファ) |
| 色深度 | チャネルあたり 8 ビット | チャネルあたり 8 または 16 ビット |
| 最適 | 写真、リアルな画像 | スクリーンショット、グラフィック、ロゴ |
| 繰り返し編集 | 品質が劣化 | 品質が保持 |
| ウェブパフォーマンス | 読み込みが速い | 読み込みが遅い |
| ブラウザサポート | 1995 年以来普遍的 | 2003 年以来普遍的 |
| アニメーション | なし(APNG/MP4 を使用) | APNG 経由で、限定的なサポート |
| メタデータ | EXIF、IPTC、XMP | tEXt、iTXt、eXIf チャンク |
| プログレッシブレンダリング | あり(プログレッシブ JPEG) | あり(Adam7 インタレース) |
現代の代替とのフォーマット比較
JPG と PNG が唯一の選択肢ではありません。2 つの新しいフォーマットは、より小さなファイルで同じケースのほとんどを処理します。
| フォーマット | 圧縮 | 透明性 | アニメーション | ブラウザサポート(2024) |
|---|---|---|---|---|
| JPG | 非可逆のみ | なし | なし(モーション JPEG) | 普遍的 |
| PNG | 可逆のみ | 8 ビットアルファ | 限定的(APNG) | 普遍的 |
| GIF | 可逆、256 色 | 1 ビット | あり | 普遍的 |
| WebP | 非可逆 + 可逆 | 8 ビットアルファ | あり | 97%+ |
| AVIF | 非可逆 + 可逆 | 12 ビットアルファ | あり | 92%+ |
| HEIC | 非可逆 + 可逆 | あり | あり | Safari、他では約 60% |
| TIFF | 可逆 | あり | なし | ブラウザサポートが限定的 |
| JPEG XL | 非可逆 + 可逆 | あり | あり | 限定的、増加中 |
視聴者が現代のブラウザを使用している場合、AVIF と WebP に 1 回エクスポートし(JPG/PNG をフォールバックとして)、現在のウェブ画像のベストプラクティスです。
よくある落とし穴
- 「品質を向上させる」ために JPG を PNG に変換: JPEG 圧縮中に品質が既に失われた場合、PNG に変換しても戻りません。ファイルが大きくなるだけで同じに見えます。
- デフォルトで写真を PNG として保存: PNG として 12 MP の写真は 20 MB に達する可能性があります。JPEG 品質 88 の同じ画像は 2 MB 未満で視覚的に同一です。
- JPG への変換時の透明性の無視: 透明なピクセルが単色(通常は白)になります。透明な背景のロゴには、PNG または WebP のままにします。
- JPG を繰り返し再エンコード: 各保存で圧縮アーティファクトが追加されます。可逆フォーマット(PNG、TIFF)で編集し、最後にだけ JPG にエクスポートします。
- EXIF データを忘れる: カメラの JPEG には GPS、デバイスモデル、タイムスタンプの EXIF があります。PNG 変換ツールはこれを取り除くかもしれませんし、そうでないかもしれません。プライバシーが重要なら、変換後にサンプル画像で確認してください。
- 間違ったカラープロファイル: Adobe RGB JPEG を変換なしで sRGB PNG にドロップすると、色が目に見えてシフトする可能性があります。ほとんどのブラウザ変換ツールは sRGB を想定します。ワイドガミットソースには、まずフォトエディタで変換してください。
- CMYK JPEG の誤解釈: CMYK は印刷ワークフローで使用されます。ブラウザ(およびほとんどのウェブ変換ツール)は RGB を期待します。CMYK JPEG はグレースケールまたは反転した色になる可能性があります。印刷アセットにはデスクトップツールを使用してください。
- JPEG のみのサイトでのアルファ付き PNG: JPG に再圧縮するソーシャルメディアプラットフォームは、透明なピクセルを彼らが選ぶもので埋めます。ダークテーマでは黒のことが多いです。
- ヘッダーバイトでフォーマットを比較: 最初の 8 バイトに PNG シグネチャがある
.jpgファイルは名前が間違った PNG です。拡張子は内容を反映しません。コンテンツを確認するために、16 進ダンプまたはfileコマンドを使用してください。 - PNG 品質がバイナリであることを忘れる: PNG には品質スライダーがありません。「PNG を 80% で保存」することはできません。唯一のノブはビット深度、パレットサイズ(PNG-8 vs PNG-24)、プリフィルター選択です。
代替ツールとライブラリ
ウェブ変換ツールは、1 つまたは数枚の画像の最速の道です。バッチやスクリプト化された作業には、コマンドラインツールやライブラリが引き継ぎます。
| ツール | プラットフォーム | 強み | 注意点 |
|---|---|---|---|
| ウェブ JPG/PNG 変換ツール | ブラウザ | インストール不要、アップロード不要、即時プレビュー | 一度に 1 枚または数枚 |
ImageMagick convert | CLI、クロスプラットフォーム | スクリプト可能、すべてのオプション、バッチ | 冗長な構文 |
| GraphicsMagick | CLI、クロスプラットフォーム | ImageMagick のフォーク、スレッドセーフ | より小さなコミュニティ |
sharp(Node.js) | ライブラリ | サーバー側最速、libvips ベース | Node ランタイムが必要 |
| Pillow(Python) | ライブラリ | Python 的、簡単なスクリプト化 | sharp より遅い |
| Squoosh CLI | CLI | Google の現代のコーデック、AVIF/WebP | 新しく、オプションが少ない |
| Preview / Photos | macOS | バンドル済み、JPG/PNG にエクスポート | デフォルトでバッチなし |
| IrfanView / XnConvert | Windows | 優れたバッチ UI | Windows または有料アプリ |
| GIMP / Photoshop | デスクトップ | フルエディタ、すべての変換オプション | シンプルな変換には重い |
cwebp、dwebp、avifenc | CLI | 現代のフォーマットのリファレンスエンコーダ | フォーマットごとのバイナリ |
商品写真パイプラインの自動化には、通常 sharp または vips が適切なツールです。素早い一度限りの変換には、ブラウザツールが利便性とプライバシーで勝ります。
プライバシーと変換ツール
JPG と PNG 変換ツールは完全にブラウザ内で動作します。選択したファイルは FileReader API で読み込まれ、ブラウザの画像パイプラインでデコードされ、オフスクリーンキャンバスに描画され、canvas.toBlob で再エンコードされます。アップロードもログ記録も共有もされません。機密素材、内部ダッシュボードのスクリーンショット、ID スキャン、画像プルーフとしての契約書ドラフトには、このローカルのみのフローが、見知らぬ人のサーバーを信頼するか誰も信頼しないかの違いです。普通の写真でも、サードパーティに見せたくない EXIF メタデータ(GPS 座標、デバイスのシリアル番号、タイムスタンプ)が含まれることがよくあります。キャンバスベースのパイプラインはデフォルトでほとんどの EXIF を取り除き、アップロードがないため、データはどのみちページを離れません。2 つのフォーマット間の変換のような日常的な作業では、プライバシーのデフォルトは: 何もページを離れない、何も保存されない、何も共有されない、であるべきです。
よくある質問
JPGからPNGへの変換はロスレスですか?
はい。JPGをPNGに変換すると、追加の品質損失なしに既存のすべてのピクセルデータが保持されます。ただし、JPEG圧縮ですでに失われた品質は復元できません。
なぜPNGファイルはJPGよりはるかに重いのですか?
PNGは各ピクセルを正確に保持するロスレス圧縮を使用します。JPEGは、目があまり気付かないデータを破棄するロッシー圧縮を使用します。トレードオフは、ファイルサイズと完璧な品質です。
代わりにWebPをいつ使用すべきですか?
WebPは両方の世界の最良を提供します, JPGまたはPNGより軽いファイルでロッシーまたはロスレス圧縮。視聴者がモダンなブラウザを持っているとき(現在97%以上がWebPをサポート)に使用します。
複数の画像を一度に変換できますか?
はい。ほとんどのブラウザ内コンバーターはバッチ処理を処理します。複数のファイルをアップロードすると、すべて同じ設定で変換されます。
Does converting strip EXIF and GPS metadata?
It depends on the tool. Browser converters built on the Canvas API typically drop all EXIF, including GPS coordinates, camera serial number, and orientation. Tools that round-trip through a JPEG decoder often preserve EXIF. If privacy matters, prefer a Canvas-based converter and re-test with a sample image.
Will the converter handle CMYK JPEGs?
Most browser converters assume sRGB and may misinterpret CMYK JPEGs (often used by print workflows) as greyscale or distorted colour. If you are converting print assets, use a desktop tool (ImageMagick, Photoshop) that explicitly handles CMYK to sRGB conversion.