日本語

どの画像形式を使用する必要がありますか?

写真は JPEG または WebP に保存されます。スクリーンショット、ロゴ、図など、シャープなエッジや単色のものはすべて PNG に保存されます。透明性と小さいファイルが必要な場合、WebP は両方を実行します。

これでほぼすべての決定がカバーされます。このページの残りの部分では、ルールが適用されない場合と、他の 3 つよりもブラウザの処理が一貫性の低い AVIF と HEIC についてどうすればよいかを説明するため、その理由が説明されています。

JPEG

JPEG は画像をブロックに分割し、目には気付かない可能性が最も高い微細な部分を破棄します。これは、ディテールが不規則でノイズが多い写真には非常にうまく機能しますが、破棄されたディテールが正確にエッジを定義するハードエッジのあるものにはあまり効果がありません。

最高を含むすべての品質設定で損失が発生します。ここにはロスレス JPEG オプションはありません。透明度を保存することはできません。透明な領域のある画像は、JPEG になるときに単色で塗りつぶされます。

写真、写真のスキャン、主に連続トーンの画像などに使用します。スクリーンショット、テキスト、線画、ロゴなど、後で再度編集するものは避けてください。

PNG

PNG はロスレスです。指定されたピクセルを正確に保存するため、アーティファクトが発生することはなく、完全なアルファ透明度をサポートします。その圧縮は繰り返しを利用するため、フラットなカラーやシャープなエッジでは劇的に効率的ですが、写真のノイズでは非効率的です。

PNG として保存された写真は通常、JPEG として保存された同じ写真よりも数倍大きくなりますが、目に見えるメリットはありません。これは最も一般的な画像形式の間違いであり、ページが遅いことを他の何かのせいにする前に確認する価値があります。

スクリーンショット、UI キャプチャ、ロゴ、図、グラフ、画像内のテキストを含むもの、および再編集する画像の作業コピーなどに使用します。

WebP

通常、WebP は同等のビジュアル品質を備えた 3 つの中で最も小さく、透過性をサポートしているため、両方のジョブをカバーする 1 つの形式になります。

ここで重要な注意点が 1 つあります。ブラウザは、品質 100 であっても WebP を非可逆モードでエンコードします。この形式では可逆モードが定義されていますが、このツールが使用するキャンバス API はそれを公開しません。したがって、このサイトからの WebP エクスポートは非​​可逆エクスポートであり、形式が原理的にサポートしているため、可逆エクスポートとは呼ばれず、そのように説明されています。

WebP を表示するためのブラウザーのサポートは、事実上、現在ではユニバーサルになっています。エンコードのサポートはそれほど均一ではないため、WebP をエンコードできないブラウザは、別の形式を静かに渡すのではなく、ここでエラーを報告します。

AVIF と HEIC — 正直な立場

AVIF は、上記の 3 つの形式すべてよりも圧縮率が高く、多くの場合大幅に圧縮されます。 HEIC は、最新の iPhone が写真にデフォルトで使用するものです。どちらも ToolAcre Image Converter では読み取ることができません。これは選択というよりはブラウザーの制限です。

通常、ブラウザは AVIF を表示できますが、処理する任意の AVIF または HEIC ファイルをデコードする信頼できる方法は公開されておらず、特に HEIC デコードはどこにも存在しないプラットフォーム コーデックに依存します。これらのファイルを受け入れるツールは、一部のマシンでは動作しますが、他のマシンでは混乱を招くほど失敗するため、代わりに明確に拒否されます。

実際の結果は、HEIC を生成したデバイス上で HEIC を JPEG に変換し (現在のすべての携帯電話と主要なデスクトップ オペレーティング システムの両方でこれを行うことができます)、JPEG 上でブラウザ ツールを使用します。 AVIF の場合は、JPEG または PNG マスターを保持し、公開時にビルド ツールを使用して出力として AVIF を生成します。

GIFについてのメモ

GIF は 1 フレームあたり 256 色に制限されているため、短いアニメーション以外には適していません。 Image Converter は GIF を読み取りますが、最初のフレームのみを使用し、出力として GIF を提供しません。.gif 拡張子を持つ静止画像を生成すると、役立つというより誤解を招く可能性があります。

短いアニメーションの場合、最新の答えは MP4 または WebM ビデオ、またはアニメーション WebP です。それらはどれもここでは生産されていません。

作業例: 1 つの記事に 4 つのアセット

記事には、ヒーローの写真、インターフェイスのスクリーンショット、背景が透明なロゴ、およびスプレッドシートからエクスポートされたグラフが必要です。

  • ヒーロー写真 — デフォルト品質の JPEG、表示幅の約 2 倍にサイズ変更されます。連続トーン、透明度は必要ありません。
  • インターフェイスのスクリーンショット — PNG。テキストとハードエッジが満載で、まさに JPEG が最も扱いにくいものですが、PNG はフラット パネルを効率的に圧縮します。
  • ロゴ — WebP または PNG。どちらも透明性を保ちます。 WebP は小さくなり、PNG は正確になります。さまざまな背景に配置されるロゴの場合、正確さは数キロバイト以上の価値があります。
  • チャート — PNG。スクリーンショットと同じ理由: 平らな塗りつぶし、細い線、軸ラベル。

結果: 4 つのファイル、3 つのフォーマット。それぞれ習慣ではなく、写真に写っているものによって選択されます。最も一般的な失敗モードは、4 つすべてを PNG としてエクスポートするか、4 つすべてを JPEG としてエクスポートすることです。写真が数倍大きくなりすぎるか、スクリーンショットやグラフのテキストの周りが目に見えて汚れてしまいます。

ツールを開く

JPEG、PNG、WebP 間の変換

Image Converter は、変換を実行する前に変換が非可逆であるかどうかを示し、実行後に実際の測定サイズを報告します。

これでカバーされないもの

  • ToolAcre Image Converter は、JPEG、PNG、WebP、GIF を読み取り、JPEG、PNG、WebP に書き込みます。 HEIC、AVIF、TIFF、カメラ RAW は拒否されます。
  • このサイトからの WebP 出力には非可逆性が含まれています。これは、ブラウザー キャンバス API が公開しているものであるためです。
  • カラー プロファイルはキャンバスの変換では保持されないため、異常なプロファイルが埋め込まれた画像は若干ずれる可能性があります。
  • ファイルサイズの比較は画像によって異なります。ここでの経験則は測定の開始点であり、引用する数値ではありません。