图片格式怎么选？JPG、PNG、WebP、AVIF对比

同样一张图，JPG 存完 200KB，WebP 80KB，AVIF 只要 50KB。选对格式直接决定页面速度。

一、四种格式定位

JPG 有损压缩，适合照片，不支持透明；PNG 无损，适合线稿和需要透明的图；WebP 同画质体积比 JPG 小 25% 至 35% 且支持透明和动图；AVIF 基于视频编码技术，压缩率更高但编码慢。

二、压缩率对比

同等主观画质下体积大致为：JPG > PNG > WebP > AVIF。照片用 AVIF 或 WebP 收益最大；纯色块和小图标 PNG 可能反而更小。

三、兼容性

WebP 已被所有现代浏览器支持，可放心用；AVIF 主流浏览器已支持但旧版 Safari 需降级。生产环境建议 picture 标签提供多格式回退。

四、落地建议

照片类内容：WebP 为主、JPG 回退；透明图：PNG 或 WebP；动图：优先视频或 WebP 动图替代 GIF；缩略图统一转 WebP 可显著降带宽。