WebP 変換ガイド：WebP・JPG・PNG の使い分け

形式変換が必要になる場面

Web サイトやミニアプリでは、JPG や PNG を WebP に変換すると転送量が減り、表示が速くなります。商品一覧や記事の画像で効果的です。逆方向も一般的です。ダウンロードした WebP が古い Photoshop や古い Office、取引先の管理画面で開けず、JPG か PNG に戻す必要があるケースです。

素材の形式を揃えたい場合もあります。同じ商品画像を Web サイト、SNS、印刷物、取引先への受け渡しで使うと、必要な形式はそれぞれ違います。その都度変換ツールを探すより、高品質な原本を 1 つ残し、納品先に合わせて書き出すほうが管理しやすくなります。

変換先の形式と品質の選び方

写真なら WebP か JPG が第一候補です。WebP は同じ見た目なら小さくなりやすく、JPG は互換性のリスクがほとんどありません。透明が必要なら WebP か PNG を選びます。JPG にすると透明部分は白で埋まり、半透明の縁も白と混ざります。これは変換の不具合ではなく、形式の仕様です。

品質設定が効くのは WebP や JPG などの非可逆出力で、PNG 出力では品質を変えても結果は変わりません。強く圧縮した JPG を WebP にしても小さくならず、劣化だけが増えることがあります。アニメーションや複数フレームの WebP は通常 1 フレーム目だけが残るため、動きのある素材には使わないでください。

• Web 納品は WebP、互換性重視は JPG
• 透明が必要なら WebP か PNG を選ぶ
• アニメーションは 1 フレーム目だけになる

代替手段と、変換しないほうがよい場合

目的がブラウザー対応なら、すべての画像を変換する必要はありません。<picture> で WebP と JPG の両方を用意する、画像 CDN に Accept ヘッダーで形式を選ばせる、といった方法なら、容量の利点を残しつつ古いブラウザーにも表示できます。

印刷、組版、長期保存用の素材は、ブラウザーで何度も形式変換するべきではありません。非可逆変換のたびに劣化が積み重なり、メタデータも失われます。原本を残し、納品時に書き出してください。相手が WebP に対応していないなら、JPG か PNG を渡すほうが、開けないファイルを送るより確実です。