JPGをPNGに変換する方法: どちらをいつ使うか

· 9 分で読めます

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 に変換するとき

PNG を JPG に変換するとき

変換方法

JPG から PNG へ:

  1. JPG ファイルをアップロード、ドラッグ&ドロップまたはクリックして参照。変換ツールは JPEG、JPG、JPE 拡張子を受け入れます。
  2. 「PNG に変換」をクリックして処理。変換はブラウザで実行され、何もアップロードされません。
  3. 可逆 PNG 画像をダウンロード。結果のファイルは大きくなりますが、ソースのすべてのピクセルを含みます。

PNG から JPG へ:

  1. PNG ファイルをアップロード。
  2. 必要に応じて品質スライダーを調整(高品質 = 大きいファイル)。85〜92 がほとんどの写真のスイートスポットです。
  3. 透明性の処理方法を選択(透明なピクセルが白、黒、または選んだ色になります)。
  4. 圧縮された JPG 画像をダウンロード。

フロー全体はクライアント側で実行されます: ファイルが FileReader で読み込まれ、ブラウザでデコードされ、キャンバスに描画され、canvas.toBlob で再エンコードされます。機密性の高いスクリーンショットでさえマシン上に残ります。

クイックリファレンス

機能JPGPNG
圧縮非可逆可逆
典型的なファイルサイズ小さい大きい
透明性なしあり(8 ビットアルファ)
色深度チャネルあたり 8 ビットチャネルあたり 8 または 16 ビット
最適写真、リアルな画像スクリーンショット、グラフィック、ロゴ
繰り返し編集品質が劣化品質が保持
ウェブパフォーマンス読み込みが速い読み込みが遅い
ブラウザサポート1995 年以来普遍的2003 年以来普遍的
アニメーションなし(APNG/MP4 を使用)APNG 経由で、限定的なサポート
メタデータEXIF、IPTC、XMPtEXt、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 をフォールバックとして)、現在のウェブ画像のベストプラクティスです。

よくある落とし穴

代替ツールとライブラリ

ウェブ変換ツールは、1 つまたは数枚の画像の最速の道です。バッチやスクリプト化された作業には、コマンドラインツールやライブラリが引き継ぎます。

ツールプラットフォーム強み注意点
ウェブ JPG/PNG 変換ツールブラウザインストール不要、アップロード不要、即時プレビュー一度に 1 枚または数枚
ImageMagick convertCLI、クロスプラットフォームスクリプト可能、すべてのオプション、バッチ冗長な構文
GraphicsMagickCLI、クロスプラットフォームImageMagick のフォーク、スレッドセーフより小さなコミュニティ
sharp(Node.js)ライブラリサーバー側最速、libvips ベースNode ランタイムが必要
Pillow(Python)ライブラリPython 的、簡単なスクリプト化sharp より遅い
Squoosh CLICLIGoogle の現代のコーデック、AVIF/WebP新しく、オプションが少ない
Preview / PhotosmacOSバンドル済み、JPG/PNG にエクスポートデフォルトでバッチなし
IrfanView / XnConvertWindows優れたバッチ UIWindows または有料アプリ
GIMP / Photoshopデスクトップフルエディタ、すべての変換オプションシンプルな変換には重い
cwebpdwebpavifencCLI現代のフォーマットのリファレンスエンコーダフォーマットごとのバイナリ

商品写真パイプラインの自動化には、通常 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.