WebP 格式:现代网页图像,可有损可无损

WebP 是 Google 推出的现代网页图片格式,同时提供有损与无损压缩、透明通道和动画。它旨在用一种受良好支持的格式,承担 JPEG、PNG 和 GIF 的角色。

当受众的浏览器支持 WebP 时(如今所有主流浏览器的当前版本均已支持),可使用 WebP 高效分发网页图片。同时保留 JPEG 或 PNG,作为极少数无法解码 WebP 的旧客户端的回退方案。

有损与无损模式

WebP 的独特之处在于一种格式支持两种压缩模式。有损 WebP 像 JPEG 一样丢弃细节以获得较小体积,适合照片。无损 WebP 像 PNG 一样精确还原原始像素,适合图形和截图。

根据 Google 的 WebP 文档,这种双重特性意味着单一格式可以取代过去需要在 JPEG 与 PNG 之间做选择的角色。

透明通道

WebP 在有损和无损两种模式下都支持逐像素透明的透明通道。这让透明徽标或界面元素可以以 WebP 分发,而不必用 PNG,这很有帮助,因为带透明的有损 WebP 可以比等效的 PNG 小得多。

由于有损模式下透明同样可用,你不必仅仅为了保留透明背景就退回到完全无损的文件。

动画——一个重要区分

WebP 还能存储动画,在多帧之间结合有损、无损和透明,类似于动态 GIF 或 APNG。这是格式本身的能力。

需要明确的是,格式支持动画并不意味着每个工具都能生成动态 WebP。PixMovo 的图片转换器只输出静态图像,不生成动态 WebP。若需要动态效果,请改用视频工具。

WebP 能力一览

能力WebP类比对象
有损压缩支持JPEG
无损压缩支持PNG
透明通道支持PNG
动画支持(格式层面)GIF / APNG

浏览器分发

  • 所有主流浏览器的当前版本都能解码 WebP,因此如今对大多数公开网站都是安全的。
  • 部分较旧或小众的客户端无法解码 WebP;如果必须支持它们,请提供 JPEG 或 PNG 回退。
  • HTML 的 picture 元素可以在不支持 WebP 的浏览器上自动提供回退来源。
  • 保留一份 JPEG 或 PNG 原图,可随时轻松重新生成回退图像。

PixMovo 当前设置

PixMovo 可以在 WebP、JPEG 和 PNG 图片之间相互转换。选择 WebP 作为目标格式会生成静态 WebP 图像;PixMovo 的图片工具不导出动态 WebP。

转换时默认移除元数据,上传和目标格式都使用同一份保守的格式白名单。

实例:为网页将照片转换为 WebP

  1. 保留你的 JPEG 或 PNG 原图

    留存原始文件,以便在访客浏览器无法解码 WebP 时重新生成回退图像。

  2. 在 PixMovo 中转换为 WebP

    上传图片并选择 WebP 作为目标格式。结果是适合网页的静态 WebP。

  3. 配合回退分发

    在 HTML 的 picture 元素中引用该 WebP,并提供 JPEG 或 PNG 来源,让旧浏览器仍能看到图像。

常见问题

WebP 是有损还是无损?
两者都有。WebP 支持类似 JPEG 的有损模式和类似 PNG 的无损模式,因此可以按图像逐一选择。
WebP 支持透明吗?
支持。WebP 在有损和无损两种模式下都有透明通道,因此可以承载透明背景。
所有浏览器都能显示 WebP 吗?
所有主流浏览器的当前版本都可以。对于极少数较旧的客户端,可用 HTML 的 picture 元素提供 JPEG 或 PNG 回退。
PixMovo 能生成动态 WebP 吗?
不能。WebP 格式支持动画,但 PixMovo 的图片工具只输出静态图像。若需动态效果,请使用视频工具。
转换为 WebP 后应该删除 JPEG 或 PNG 吗?
请保留原图。它能让你为无法解码 WebP 的浏览器重新生成回退图像。

官方来源