使用する 写真の場合は JPG、グラフィックス、スクリーンショット、透明度の場合は PNG。この 1 つのルールにより、ほとんどのフォーマット決定が解決されます。その背後にある理由は数字に帰着します。PNG として保存された 12 メガピクセルの写真の重さは 2 ～ 8 MB ですが、JPG として保存された同じ写真は 200 ～ 800 KB であり、目には違いが感じられません。ただし、内容を反転すると、利点も反転します。 JPG として保存された単色のロゴには、PNG では生成されない、エッジの周りにぼやけたハローが生じます。このガイドでは、各形式が実際に何を行うのか、各形式がどこで壊れるのか、写真、ロゴ、スクリーンショット、印刷物、Web でどれを選択するべきかについて説明します。

PNGファイルとは何ですか?

PNG の略 ポータブルネットワークグラフィックス、GIF の特許フリーの代替として 1996 年にリリースされた形式。 ZIP アーカイブで使用されるのと同じ方法である DEFLATE アルゴリズムを使用して可逆圧縮するため、すべてのピクセルが保存および再保存されても変更されることなく残ります。 PNG には アルファチャンネル、完全に非表示から完全にソリッドまで不透明度を制御するピクセルごとの 4 番目の値。一般的な 2 つの亜種が存在します。PNG-8 では、パレットを 256 色に制限し、シンプルなグラフィック用にファイルを小さく保ちます。一方、PNG-24 では、より豊かな画像用に数百万色を保存します。スクリーンショット、ロゴ、アイコン、チャート、インターフェイスのモックアップはすべて PNG の強みを発揮します。写真にはそうではなく、ライバルがそこを引き継ぐのです。

JPGファイルとは何ですか?

JPG（JPEGと同じ、略称） 共同写真専門家グループ) は 1992 年に登場し、写真を小さくするという 1 つの目的のために設計されました。画像を 8 × 8 ピクセルのブロックに分割し、人間の視覚ではほとんど認識できない色の詳細を破棄します。これは非可逆圧縮と呼ばれるプロセスです。 0 から 100 までの品質ダイヤルは、破棄をどの程度積極的に行うかを制御します。そのダイヤルの上部では、損失は目に見えません。下部では、画像がブロック状になります。貿易には多大なコストがかかります。 JPGにはアルファチャンネルがありませんしたがって、透明な背景を保持することはできず、破棄されたデータは決して戻ってきません。この取引により、実際にファイルはどれくらい小さくなりますか?その数字は驚くべきものです。

ファイルサイズ: 実際の数値

ファイルサイズは 2 つの形式が最も大きく異なる部分であり、勝者は完全にコンテンツによって決まります。

スマホの写真: PNG として約 4MB、品質 90 の JPG として 300 ～ 500KB。JPG の方が 10 倍優れています。
全画面デスクトップのスクリーンショット：PNGで2～5MB、JPGで約400KB。サイズの点では JPG が勝ちますが、テキストのエッジはわずかに柔らかくなります。
2 色のロゴ、500 x 500 ピクセル: PNG-8 として約 8KB、目に見えるエッジノイズを伴う JPG として 25KB 以上。サイズと外観の両方で PNG が勝ります。
グラデーションの多いグラフ: 結果はさまざまなので、両方をテストする価値があります。

したがって、どちらのフォーマットも普遍的に「小さいもの」ではありません。写真コンテンツは JPG として劇的に圧縮率が高くなります。色が少ないフラットなグラフィックスは、多くの場合、PNG の方が圧縮率が高くなります。フォーマットごとに失敗の仕方も異なるため、サイズは話の半分にすぎません。

画質: 各フォーマットのどこが壊れるのか

品質の問題は反対の場所で発生します。 JPGの弱点は シャープでハイコントラストなエッジ: 白地に黒のテキスト、細い線、ハードボーダー。積極的に圧縮すると、エッジの周囲にかすかな斑点 (リンギングアーティファクトと呼ばれる) が散乱します。これが、同じ設定の写真がきれいに見える場合でも、高度に圧縮されたスクリーンショットが汚れて見える理由です。 JPGも苦しむ 世代損失: 編集と保存のサイクルごとに画像が再圧縮され、古いものに新しいダメージが蓄積されます。 PNGではどちらも問題ありません。その弱点は純粋に重量です。完璧には何メガバイトもかかります。フォーマット間の 3 番目の違いは、品質に関するものではありません。それは画像の背後で何が起こっているかについてです。

透明性とアルファチャンネル

この比較では、透明度は PNG のみに属します。そのアルファチャネルにより、任意のページの色の上にロゴを浮かせることができます。これが、Web デザイナーがデフォルトでインターフェイスアセットを PNG としてエクスポートする理由です。そのファイルを JPG に変換すると、シースルー領域は単色 (デフォルトでは白) にフラット化される必要があります。私たちのコンバーター、黒とカスタムの塗りつぶしが利用可能です。仕組みについては、こちらの記事で詳しく説明しています。透明な背景ガイド。 3 つの主要な違いが確立されると、特定のファイルの選択は機械的になります。

PNG を使用する場合

次のような状況では PNG にアクセスしてください。

ロゴとアイコン、どの圧縮レベルでもエッジが非常に鮮明な状態を維持する必要があります。
注釈を付けたり再編集したりするスクリーンショット, 保存を繰り返してもコストがかからないためです。
透明度が必要な画像：透かし、オーバーレイ、フローティンググラフィックス。
チャート、図、およびテキストの多いグラフィック、圧縮斑点が可読性を損なう可能性がある場合。
マスターコピー 後で変更する可能性のあるものについては、

JPG を使用する場合

次のジョブには JPG を選択してください:

写真 Web、電子メール、ソーシャル、ストレージなど、どこにでもアクセスできます。
フォームをアップロードする 政府のポータルサイトや求人サイトでは、頻繁に JPG が要求され、100 KB や 200 KB などの上限が適用されます。
電子メールの添付ファイル, ここで、10 枚の画像のバッチは、Gmail と Outlook が課す 25 MB の上限未満に収まる必要があります。
ウェブサイトのコンテンツ画像軽いページはランク付けされ、コンバージョンが向上するためです。
完成した写真をアーカイブする 品質 90 以上では、目に見えない損失と引き換えにストレージを大幅に節約できます。

あなたのウェブサイトにはどちらが適していますか?

ウェブサイトのパフォーマンスでは、すべての写真アセットで JPG が優先されます。ページの重みが直接入力される 最大のコンテンツ豊富なペイント、Google の中核的な Web Vitals の 1 つであり、PNG 写真を JPG コピーに交換することは、多くの場合、画像の多いページで実現できる最大の 1 ステップの節約です。ロゴ、透明度のあるアイコン、UI 要素など、必要な部分については PNG を保持します。最新のサイトではますますサービスが提供されています WebP または AVIF圧縮に関しては両方の古典的な形式を上回っていますが、JPG は依然として、10 年前のブラウザからオフィスソフトウェアに至るまで、あらゆる場所で利用できる普遍的な代替手段です。どのような組み合わせに決めても、最終的には画像をある形式から別の形式に移動する必要があります。

PNGとJPGの間で変換する方法

変換には 3 つの手順が必要です無料のブラウザベースのツール: PNG ファイルをドロップし、品質レベルまたは正確なターゲットサイズを選択して、結果をダウンロードします。処理は何もアップロードせずに自分のデバイスで行われます。他の方向 (JPG から PNG) に進むことは技術的には簡単ですが、すでに圧縮されたピクセルを可逆コンテナーでラップすると何も回復せず、ファイルが膨張するため、ほとんど役に立ちません。私たちの品質ガイド使用する価値のある正確な設定について説明します。

PNG は JPG よりも高品質ですか?

グラフィックの場合は「はい」ですが、写真の場合は事実上「いいえ」です。 PNG は数学的に完璧です 何も破棄されないため、通常のサイズで写真を表示すると、品質 90 で保存された JPG は同じように見えますが、重さは 10 分の 1 です。

可逆圧縮とはどういう意味ですか?

可逆圧縮手段 ファイルはピクセルデータを破棄せずに縮小されます。, そのため、解凍するとイメージが正確に復元されます。非可逆圧縮は、目が見逃す可能性の低い詳細を永久に削除することでさらに圧縮します。

ロゴ、写真、スクリーンショットにはどの形式を使用すればよいですか?

ロゴは PNG、写真は JPG、スクリーンショットは目的地によって異なります: 編集中は PNG を保持し、共有またはアップロードする場合は JPG に変換します。

印刷用の PNG または JPG?

どちらも高解像度でうまく印刷できますが、 印刷所は通常 JPG を好みます ファイルの転送速度が速く、カラーパイプラインもそれを期待しているためです。品質 95 以上でエクスポートすると、圧縮が紙上で見えなくなります。

PNG ファイルが非常に大きいのはなぜですか?

なぜなら 写真の詳細をロスレスで保存するにはコストがかかる。何百万もの微妙に異なる色を使用すると、DEFLATE アルゴリズムでは圧縮するものがほとんどなくなるため、この形式ではほぼ生のピクセルデータが保存されることになります。

JPG を PNG に変換すると品質は向上しますか?

いいえ。 破棄された詳細 JPG は完全に失われます、PNG ラッパーは破損したバージョンをより大きなファイルに保存するだけです。

どの画像形式が透明度をサポートしていますか?

PNG、WebP、AVIF、GIF 透明性をサポートします。 JPG と BMP にはありません。 PNG は、古い形式の中で最もスムーズなアルファブレンディングを提供します。

WebP は PNG や JPG よりも優れていますか?

圧縮では、はい: WebP ファイルは 25 ～ 35% 小さくなります 同等の JPG よりも優れており、透明度もサポートしています。 JPG は古いソフトウェアとの普遍的な互換性において依然として優れており、それが両方がどこでも残っている理由です。

まだ決めていますか？イメージのコピーを実行します。 PNGからJPGへのコンバーターそして結果を元の結果と並べて比較します。正しい答えは通常数秒以内にわかり、確認するのに費用はかかりません。