WebP Gallery

最好使用支持 WebP 的浏览器查看此图库页面,例如 Google Chrome、Opera 及其他

如果无法访问 Google Chrome,您可将图片下载到 以便与其他产品搭配使用 支持 WebP

JPEG 和 WebP 格式的示例图片文件以及 PNG 源代码

下表显示了缩放后的 JPEG(左侧)和 WebP 图片(右侧) 以便进行比较。由于现有的浏览器原生支持 WebP 我们不再像发布时那样将 WebP 图片放置在 PNG 容器中。图片 文件大小是否准确无误点击 JPEG 和 WebP 缩略图将会打开 在新标签页中打开大图片

缩略图下方的文件大小对应于图片的文件大小 点击缩略图时看到的视频WebP 图片比普通图片小 30% 以上 相较于 JPEG 格式

JPEG

WEBP

“挪威 Nærøyfjorden - 来自 Breiskrednosi。联合国教科文组织世界 传统"1
<ph type="x-smartling-placeholder"></ph>
JPEG 文件大小:43.84 KB
<ph type="x-smartling-placeholder"></ph> WebP 图片
WebP 文件大小:29.61 KB
“Kayaker at Ekstremsportveko 2010, Voss”。 2
<ph type="x-smartling-placeholder"></ph>
JPEG 文件大小:86.25 KB
<ph type="x-smartling-placeholder"></ph> WebP 图片
WebP 文件大小:59.18 KB
“Parkrun”的第 10 帧序列 3
<ph type="x-smartling-placeholder"></ph>
JPEG 文件大小:297.05 KB
<ph type="x-smartling-placeholder"></ph> WebP 图片
WebP 文件大小:198.38 KB
图片:“野生樱桃 (Prunus avium) in flower” 4
<ph type="x-smartling-placeholder"></ph>
JPEG 文件大小:251.03 KB
<ph type="x-smartling-placeholder"></ph> WebP 图片
WebP 文件大小:172.82 KB
图片:冒烟的“斋浦尔王铜铜管乐队”比利时查斯皮埃尔 5
<ph type="x-smartling-placeholder"></ph>
JPEG 文件大小:120.78 KB
<ph type="x-smartling-placeholder"></ph> WebP 图片
WebP 文件大小:80.76 KB

图片来源

此页面上的图片来自多个不同的来源。我们有 我们选择了一些赏心悦目而又丰富的图片来展示 WebP 的品质。 她经常在实验或活动中使用著名的经典图片,如 Lena、Baboon 等 压缩比较,遗憾的是,这些内容并无版权限制。

以上图片的出处按顺序列出。

1 “挪威 Nærøyfjorden - 来自 Breiskrednosi。联合国教科文组织世界遗产
图片作者:Kjetil Birkeland Moe
经作者许可复制的内容。
<ph type="x-smartling-placeholder"></ph> PNG 来源
作者的博文,对 JPEG 和 WebP 进行了比较。老鼠 悬停激活示例。
2 “2010 年度 Ekstremsportveko 皮划艇运动会,沃斯”
图片作者:Kjetil Birkeland Moe
经作者许可复制的内容。
<ph type="x-smartling-placeholder"></ph> PNG 来源
作者的博文,对 JPEG 和 WebP 进行了比较。老鼠 悬停激活示例。
3 “Parkrun”的第 10 帧序列
图片制作人:Lars Haglund,SVT Sveriges Television AB
在获得提供方许可的情况下复制
<ph type="x-smartling-placeholder"></ph> PNG 来源
4 图片:“花朵中的野生樱桃 (Prunus avium)”
图片作者:Benjamin Gimmel
PNG 来源
已根据 知识共享 署名-相同方式共享 3.0 未移植许可。
5 次 图片:冒烟的“斋浦尔王铜铜管乐队”比利时查斯皮埃尔
作者:Luc Viatour
PNG 来源
已根据 知识共享 署名-相同方式共享 3.0 未移植许可。
作者网站:www.lucnix.be

复制图像

为了实现可重现性,并演示一些 WebP 技术的用法 压缩参数中,我们在这里介绍了 正在生成此图库中的图片

工具

为了转换和重新缩放源图片,我们使用了 ImageMagick 的工具 convert,位于 https://www.imagemagick.org。 版本信息如下所示:

Version: ImageMagick 6.5.7-8 2010-12-02 Q16 https://www.imagemagick.org

对于 JPEG 压缩,我们使用了 IJG 参考编码器 8b 版, 网址为 https://www.ijg.org/files/jpegsrc.v8b.tar.gz

版本信息如下所示:

Independent JPEG Group's CJPEG, version 8b  16-May-2010
Copyright (C) 2010, Thomas G. Lane, Guido Vollbeding

生成源 PNG 图片

首先,只使用以下参数将 JPEG 源无损转换为 PNG 格式:

convert in.jpg out.png

然后,将较大的源图片重新缩放为 1024 像素的较小宽度 创建 Deployment

convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png

以生成最终的源 PNG 图片集。

正在压缩为 JPEG 格式

JPEG 的编码器 (cjpeg) 接受 PPM 格式的输入图片。我们将 convert 用于 生成它们。然后,完整的转化序列如下:

convert in.png tmp.ppm
cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm

它可以生成质量系数为 80 的优化 JPEG 文件。

压缩为 WebP 格式

我们的目标是比优化后的 JPEG 文件缩小 30%。 因此,我们明确指定了每张图片的目标尺寸。 此外,我们还为每个 这要归功于 cwebp 工具的 -f 选项。相较于 对于某些图片,通过使用 Transformer 中的 -sns 选项。使用的确切命令行的命令如下:

cwebp -m 6 -f 50 -size 31500 1.png -o 1.webp
cwebp -m 6 -f 20 -sns 100 -size 62000 2.png -o 2.webp
cwebp -m 6 -sns 90 -size 213000 3.png -o 3.webp
cwebp -m 6 -f 40 -size 181000 4.png -o 4.webp
cwebp -m 6 -f 40 -size 89000 5.png -o 5.webp

总体而言,与生成的 WebP 文件相比, 支持 JPEG 文件大小。

请注意,此页面中使用的 WebP 缩略图也缩小了 26% 相较于对应的 JPEG 文件。