简短答案:比单位字节的画质,WebP 明显胜过 JPG。比兼容性,JPG 不可撼动——它在每台设备、每个软件、每家印刷厂都能打开。所以"哪个更好"的答案是一个反问:这张图要去哪里?去你自己掌控的网站:WebP。去未知的地方:JPG。下面给出这个答案两半各自的技术依据。
压缩技术:1992 对 2010
JPEG 的核心手法可以追溯到 1992 年(JPG 的历史讲了完整故事)。图像被切成 8×8 像素的块,每块做一次离散余弦变换转成频率,量化器丢掉人眼几乎察觉不到的高频细节。色度分辨率出于同样的理由减半。这是拨号上网时代的杰出工程——从那以后没有根本性的变化。
有损 WebP 是 VP8 的帧内编码,Google 于 2010 年发布(WebP 的诞生解释了它如何从视频压缩工作中诞生)。哲学相同——留下眼睛注意到的,丢掉其余——但机器年轻了十八年。VP8 先从相邻块预测每个块,再对剩余差值做变换;用更高效的熵编码器;按图像区域自适应调整量化强度,而不是全局一刀切。
可测量的结果:同等主观画质下,WebP 文件比 JPG 小约 25% 到 35%。两种格式都是有损的——每次保存都会丢弃信息——我们的 有损与无损压缩详解讲了这对编辑各自意味着什么。
压缩得越狠,差距越大。高画质下两者都不错。把画质调低,JPG 的 8×8 块会以可见的棋盘伪影浮出水面,而 WebP 劣化成平滑而不是方块——仍然是劣化,但是更安静的那种。对缩略图和预览图来说,字节最要紧、审视最少,这种行为比标题里的百分比更值钱。
体积对比表
同一张照片,主观画质对齐:
| 照片 | JPG | WebP(有损) |
|---|---|---|
| 1200 万像素,全画质 | 约 3.4 MB | 约 2.3 MB |
| 1920×1080,网页分发 | 约 450 KB | 约 300 KB |
| 缩略图,400 像素宽 | 约 35 KB | 约 24 KB |
页面上每张图省三分之一,累积起来很快——这就是网站如此激进地采用 WebP 的全部原因。乘上一整屏商品图,在中档移动网络下就是加载两秒和三秒的差别。
WebP 有而 JPG 永远不会有的东西
JPG 的格式已经冻结;WebP 的容器留有成长空间。两个功能值得一提:
Alpha 透明度。 有损 WebP 携带一个独立编码的 alpha 通道,照片可以坐在透明背景上。JPG 完全没有 alpha——保存时透明度会被压到纯色上。
动画。 WebP 支持全彩加 alpha 的动图,这让它成为 GIF 的实用替代品。动画 JPG 是不存在的东西。
对一张普通的照片,两者都无所谓。一旦网站需要透明的产品抠图或短循环片段,两者就都重要了。
JPG 的护城河:永远到处可用
JPG 从九十年代初起就可读。每台相机都拍它。每部手机、每台打印机、每台电视、每个数码相框、每个用了二十年的 CMS 都读它。拒收其他一切格式的上传表单也接受 JPG。这不是能跑分 benchmark 的功能——这是三十年积累下来的支持,没有任何格式规范能复制它。
WebP 在每个现代浏览器里渲染多年了,但跨出浏览器,支持迅速稀薄:老图像编辑器、年迈的 CMS、印刷流水线、嵌入式设备。我们在 WebP 与 PNG 对比里从图形一侧画过同一个缺口,在 JPG 与 PNG 对比里从有损对无损一侧也画过。
什么场景用哪个
| 图片的去向 | 用哪个 | 原因 |
|---|---|---|
| 你自己控制的网站 | WebP | 同等画质小约 30% |
| 邮件、即时通讯、未知收件人 | JPG | 人人都能打开,无需解释 |
| 打印 | JPG | 印刷流水线期待的就是它 |
| 你控制不了的上传表单 | JPG | 很多仍然拒收 WebP |
| logo、抠图、一切透明元素 | WebP | JPG 做不了 alpha |
| 母版的长期存档 | 都不用——保留原图,或走无损 | 两种格式都会丢数据 |
当你需要转换时
如果网站塞给你的 WebP 文件需要在更老的环境里工作,WebP 转 JPG 在你的浏览器本地完成转换——支持批量和 ZIP 下载,没有任何上传;详细步骤见 如何把 WebP 转成 JPG。反方向,JPG 转 WebP 能在照片上网之前削掉三分之一体积。
从以上内容得出的规则:拍摄和发送用 JPG,发布用 WebP——在两个世界的边界处转换。