术语

WebP

WebP 是 Google 开发的现代图像格式,同时支持有损和无损压缩。在质量相近时,它生成的文件通常比 PNGJPG 更小。

WebP、PNG 与 JPG

从灵活性来看,WebP 介于 PNG 和 JPG 之间,并兼具两者的一些优势。

与 PNG 相比,WebP 无损文件通常小 20%–30%,视觉质量则完全相同。两种格式都支持透明,但 WebP 所需开销更少。对于包含文字和锐利界面边缘的截图,WebP 无损能像 PNG 一样保持像素级精准,文件却更小。

与 JPG 相比,在相同压缩级别下,WebP 有损文件大小相近或更小,可见伪影也更少。JPG 不善于处理锐利边缘和文字,而这恰好是多数截图的主要内容。WebP 的压缩算法不受 8 × 8 分块结构限制,因此能更好地处理这些内容;这种分块正是 JPG 出现典型方块感的原因。

需要权衡的是,所有图像查看器、编辑器和平台都普遍支持 PNG 和 JPG。浏览器对 WebP 的支持已经很广,但旧版桌面应用、邮件客户端和某些社交媒体平台仍可能无法正常处理。

WebP 的应用场景

  • Web 性能——WebP 文件更小,可以缩短页面加载时间并减少带宽使用。许多内容分发网络和图像优化服务会自动转换为 WebP。
  • 截图流程——支持 WebP 无损输出的截图工具可以缩小档案体积,又不牺牲文字和界面内容所需的清晰度。
  • 渐进式 Web 应用——WebP 同时具备文件小、支持透明和动画等特点,很适合接近原生应用体验的 Web 产品。
  • 文档与知识库——Web 文档中嵌入的截图可以利用 WebP 在质量与文件大小之间取得的平衡。
  • 自动截图管线——批量截图工具一次生成数百张图像时,默认使用 WebP 可以明显降低存储和传输成本。

浏览器与工具支持

Chrome、Firefox、Safari 14 及更高版本、Edge,以及所有基于 Chromium 的浏览器都支持 WebP,覆盖绝大多数 Web 用户。

工具方面的支持也在持续增长。多数现代图像编辑器、设计工具和截图实用工具都能打开和保存 WebP。操作系统层面的支持有所不同,macOS 和 Windows 的默认图像查看器目前都能处理 WebP,但某些旧版本可能需要更新。

需要通用兼容性的流程通常会以 WebP 为主要格式,再为不支持 WebP 的环境提供 PNG 或 JPG 后备。有些截图工具会自动处理,默认保存 WebP,同时提供一键导出为其他格式的选项。

常见错误

  • 文字较多的截图使用 WebP 有损压缩。 与 JPG 一样,WebP 有损模式可能在锐利边缘周围引入轻微伪影。包含可读文字的截图应使用 WebP 无损模式,保持清晰。
  • 以为所有接收者都能打开 WebP。 虽然浏览器支持良好,但某些邮件客户端、旧版办公套件和旧式系统可能无法渲染 WebP。选择格式前应了解受众所用环境。
  • 没有利用无损模式。 许多人认为 WebP 只有有损压缩。WebP 无损可以作为更小的 PNG 直接替代方案,应成为截图流程的默认选择。
  • 把 JPG 重新编码为 WebP,并期待质量提高。 把有损 JPG 转成 WebP,无法恢复已经损失的质量。要得到最佳结果,应始终从原始无损源转换。

常见问题

所有浏览器都支持 WebP 吗?

Chrome、Firefox、Safari 和 Edge 等主流现代浏览器都支持 WebP。非常旧的浏览器版本可能不支持,但目前其覆盖范围已超过全球 Web 流量的 95%。

WebP 可以同时取代 PNG 和 JPG 吗?

多数情况下可以。WebP 无损压缩能以更小文件取代 PNG,WebP 有损压缩则能以较小体积提供与 JPG 相近的质量。主要限制在于浏览器以外的工具和平台支持。

WebP 支持透明背景吗?

支持。WebP 的有损和无损模式都支持 Alpha 透明度,而 JPG 完全不支持透明。

WebP 是无损还是有损格式?

两者都支持。WebP 提供类似 JPG 的有损压缩,也提供类似 PNG 的无损压缩。可以根据质量和文件大小要求选择模式。

截图应使用 WebP 吗?

WebP 无损压缩很适合截图。它能像 PNG 一样保留清晰文字和界面边缘,而文件通常小 20%–30%。

参考资料

相关资料

什么是 WebP? | 术语表 | Shotomatic