ハウツー

PNG・JPG・WebP — どれを使うべきか、変換方法と注意点まとめ

K 投稿者 Kevin Feng2026年7月4日7 分で読める
PNG・JPG・WebP — どれを使うべきか、変換方法と注意点まとめ

多くの解説記事はすぐ手順に入ります。「ファイルをアップロードして、変換を押して、ダウンロード」—30秒で終わる話です。でも本当に大切なのは、その前に正しい形式を選ぶこと。選び方を間違えると、ファイルサイズが無駄に膨らんだり、透過が消えたり、保存のたびに画質が劣化したりします。

まず形式を決める

余計な説明なしに、各形式の特徴をひとつの表にまとめました。

形式向いている用途透過目安のファイルサイズブラウザ対応
PNGロゴ・スクリーンショット・アイコンなど、輪郭が明確なものやテキストを含む画像あり(アルファチャンネル)大きめ — 1200px のロゴで 200〜400 KB になることもすべてのブラウザで対応
JPG写真・グラデーション・とにかく軽さを優先したい画像なし小さめ — 同じ画像でも品質80なら 40〜80 KB 程度すべてのブラウザで対応
WebPWebで使う画像全般。画質を落とさずできるだけ軽くしたい場合に最適あり最も小さい — JPG と同等の品質で 25〜35% 程度軽くなるのが目安主要な現行ブラウザはすべて対応。IE はすでに終了しているので問題になることはほぼない

実際の選び方をざっくり言うと — 透過が必要な場合や、ロゴ・UIパーツのようにピクセル単位の精度が求められるなら PNG。WebP が使えない環境向けの写真なら JPG。Webサイトに載せる画像なら、基本は WebP で問題ありません。サイズの節約効果は実感できるレベルで、現行ブラウザなら表示上のトラブルもほぼありません。

よくある失敗のひとつに、「スクリーンショットを PNG から JPG に変換してサイズを減らそう」というパターンがあります。スクリーンショットはベタ塗りの色域とシャープなテキストを含むことが多く、まさに JPG 圧縮が最も苦手とする内容です。テキスト周辺にぼけが生じて、元の PNG より大きくなってしまうことすらあります。

Filuni での変換方法

Filuni の画像フォーマット変換ツールは、PNG・JPG・WebP の相互変換に対応しています。一度に最大10ファイルのバッチ変換も可能。アカウント登録不要、透かしなし、変換はサーバー側で処理され、完了後は自動削除されます。

  1. ツールを開いて画像をドロップします(複数可、最大10ファイル)。
  2. ドロップダウンから変換先の形式を選びます(JPG・PNG・WebP)。
  3. JPG に変換する場合は品質を設定できます(80 が標準的な目安。サムネイル用ならもう少し下げても構いません)。
  4. 「変換」をクリックしてダウンロードすれば完了です。

1枚なら1分もかかりません。商品写真を20枚まとめて変換する場合でも、2〜3分もあれば終わります。

よくある失敗パターン3つ

1. PNG を JPG に変換すると透過が消える

JPG にはアルファチャンネルがありません。透過背景の PNG — ロゴや切り抜き画像、アイコンなど — を変換すると、透明な部分が白か黒で塗りつぶされます。白背景のページでは気づかないこともありますが、ダークな背景に置いた途端に不自然な四角い枠が浮き上がります。透過が必要な場合は PNG のままにするか、透過に対応している WebP に変換しましょう。

2. JPG を JPG として再保存するたびに劣化する

JPG は非可逆圧縮を使っています。開いて編集して JPG で保存、を繰り返すたびに少しずつ品質が落ちていきます。これは蓄積するので、何度も編集する予定がある画像は PNG か WebP で保管しておき、最後に JPG へ書き出すのが正しい手順です。JPG をそのまま作業用のソースファイルとして使うのは避けてください。

3. WebP のブラウザ対応は十分だが、メールクライアントは別の話

2020年以降の主要ブラウザはすべて WebP に対応しており、表示上の問題はほぼありません。ただし、メールだけは例外です。Gmail を含む多くのデスクトップメールクライアントは、WebP をインラインで表示できません。ニュースレターやメールテンプレートに画像を使う場合は JPG か PNG を選んでください。

よくある質問

JPG を PNG に変換すると画質は上がりますか?

上がりません。PNG に変換しても、すでにあるピクセルデータをそのまま可逆圧縮のコンテナに入れ直すだけです。JPG の圧縮で生じたノイズや劣化はそのまま残ります。ファイルサイズが増えるだけで、見た目の品質は変わりません。JPG を PNG に変換する意味があるのは、これから何度も編集・書き出しを繰り返す予定がある場合(劣化の蓄積を防ぐ)か、透過レイヤーを追加したい場合に限ります。

WebP は JPG より常にサイズが小さいですか?

ほぼ常にそうです。同等の視覚品質で比べると、概ね 25〜35% 小さくなります。ただし 100px 以下の小さなサムネイルでは差が縮まり、大きくて細部の多い写真では差が広がる傾向があります。Webで使う画像であれば、WebP がほぼ正解です。JPG を選ぶ理由があるとすれば — メール向け、古いCMSとの互換性、クライアントからの指定 — といった特定の事情がある場合だけです。

JPG に変換するとき、品質はどのくらいに設定すればいいですか?

品質80が標準的な落としどころです。品質100と比べてファイルサイズは約40〜50% 減る一方、見た目の品質は95% 程度保たれます。背景用の画像やサムネイルなら70まで下げてもそれほど気になりません。60を下回ると圧縮のノイズが目立ち始めます。品質100はほぼ意味がなく、サイズだけが跳ね上がって見た目の差はほとんどありません。

複数の画像をまとめて変換できますか?

できます。Filuni の画像フォーマット変換ツールは1回の操作で最大10ファイルを受け付けます。まとめてドロップして変換先の形式を選ぶと、変換されたファイルをまとめた ZIP をダウンロードできます。商品写真を撮り直したとき、あるいはWebプロジェクト用のアイコンをセットで書き出すときなどに便利です。

#画像変換 #PNG #JPG #WebP #ファイル形式

Filuni の無料ツールを試す

この記事の内容すべて — さらに120以上のツール。無料・登録不要、ブラウザですぐに。

その他の記事

ハウツー画像を好きなサイズにトリミングする方法(用途別ガイド)画像のトリミングを用途別にわかりやすく解説する実践ガイド。プロフィール写真、SNS投稿、印刷用写真、証明写真など、よくある場面ごとに最適な切り抜き方を、無料のFiluniオンライン裁断ツールで実際に試しながら学べます。ハウツー画像をオンラインでリサイズする方法(ピクセル指定とパーセント指定、使い分けのポイント)オンラインで画像のサイズを変更する実践ガイドです。ピクセル単位で指定する方法とパーセントで指定する方法の違いから、Filuni上での具体的な操作手順、縦横比をきれいに保つコツ、そして画像を拡大すると画質が劣化してしまう理由まで、まとめてわかりやすく解説します。ハウツー画質を落とさずに画像を圧縮する方法画像ファイルが大きくなる原因は、サイズ・フォーマット・埋め込みメタデータという三つに絞られます。この記事では「ロスレス」の本当の意味を整理しつつ、Filuni での圧縮手順を具体的に解説。フォーマット別の実践アドバイスと、実際の圧縮前後の数値もまとめています。ハウツーPDFを回転させて、ちゃんと保存する方法PDFビューアでページを回転できても、いったんファイルを閉じて開き直すと、その回転が元に戻ってしまう。本記事ではなぜそんなことが起きるのかを丁寧に解説し、回転をファイル自体にしっかり焼き込んで、次に開いてもそのまま保たれるように保存する方法を紹介します。