WebP Gallery
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
此库的内容
最好使用支持 WebP 的浏览器查看此图库页面，例如
Google Chrome、Opera
及其他。
如果无法访问 Google Chrome，您可将图片下载到
以便与其他产品搭配使用
支持 WebP。
JPEG 和 WebP 格式的示例图片文件以及 PNG 来源
下表显示了缩放后的 JPEG（左侧）和 WebP 图片（右侧）
以便进行比较。由于现有的浏览器原生支持 WebP
我们不再像发布时那样将 WebP 图片放置在 PNG 容器中。图片文件大小准确无误。点击 JPEG 和 WebP 缩略图将会打开
在新标签页中打开大图片
缩略图下方的文件大小与点击缩略图时查看的图片的文件大小相对应。WebP 图片比 JPEG 图片小了 30% 以上。
图片来源
此页面上的图片来自多个不同的来源。我们精选了一些精美且丰富的图片，以展示 WebP 的画质。
以下是上述图片的创作者名单。
重现图像
为了实现可重现性，并演示一些 WebP 技术的用法
压缩参数中，我们在这里介绍了
正在生成此图库中的图片
为了转换和重新调整源图片的大小，我们使用了名为 convert 的 ImageMagick 工具的较新版本，该工具可从 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 像素的较小宽度
运行这些命令：
convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png
以生成最终的一组源 PNG 图片。
JPEG 的编码器 (cjpeg) 接受 PPM 格式的输入图片。我们使用 convert 生成它们。然后，完整的转化序列如下：
convert in.png tmp.ppm
cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm
该参数会生成质量因子为 80 的优化 JPEG 文件。
我们的目标是比优化后的 JPEG 文件缩小 30%。
因此，我们明确指定了每张图片的目标尺寸。此外，借助 cwebp 工具的 -f 选项，我们为每张图片设置了临时滤除强度值。使用 -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
总体而言，与 JPEG 文件大小相比，生成的 WebP 文件在全球范围内缩减了 32%。
请注意，此页面中使用的 WebP 缩略图也缩小了 26%
相较于对应的 JPEG 文件。
如未另行说明，那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可，并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情，请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC)：2025-08-08。
[null,null,["最后更新时间 (UTC)：2025-08-08。"],[[["\u003cp\u003eThis gallery showcases the advantages of using WebP images over JPEG images, particularly in terms of file size reduction.\u003c/p\u003e\n"],["\u003cp\u003eWebP images in this gallery are more than 30% smaller than their JPEG counterparts while maintaining comparable visual quality.\u003c/p\u003e\n"],["\u003cp\u003eThe gallery provides sample images in both JPEG and WebP formats, along with the original PNG source for comparison.\u003c/p\u003e\n"],["\u003cp\u003eVisitors can download these images and utilize them with WebP-supported products.\u003c/p\u003e\n"],["\u003cp\u003eDetails on the tools and compression parameters used to generate the WebP images are provided for reproducibility.\u003c/p\u003e\n"]]],["This gallery displays side-by-side comparisons of JPEG and WebP images, demonstrating WebP's smaller file sizes. WebP images are consistently over 30% smaller than their JPEG counterparts. The gallery includes five example images from various sources, each with downloadable JPEG, WebP, and PNG files. The method for creating these image formats are detailed, utilizing tools like ImageMagick and cjpeg, and employing specific commands to convert, compress, and optimize the images to Webp and JPEG.\n"],null,["# WebP Gallery\n\nContents of this Gallery\n------------------------\n\nThis gallery page is best viewed with a browser that supports WebP, such as\nGoogle Chrome, Opera\n[and others](/speed/webp/faq#which_web_browsers_natively_support_webp).\n\nIf you don't have access to Google Chrome, you may download the images on your\nlocal drive to use with other products that\n[support WebP](https://wikipedia.org/wiki/WebP#Support).\n\nSample Image Files in JPEG and WebP and the PNG Source\n------------------------------------------------------\n\nThe table below shows scaled JPEG (on the left) and WebP images (on the right)\nside-by-side for comparison. Since browsers exist that support WebP natively,\nwe no longer place WebP images in a PNG container as we did at launch. Image\nfile sizes are exact. Clicking on the JPEG and WebP thumbnails will open the\nlarge images in a new tab\n\nFile sizes below the thumbnails correspond to the files sizes of the images\nviewed when clicking the thumbnails. The WebP images are more than 30% smaller\nthan the JPEG ones.\n\n| JPEG | WEBP |\n|--------------------------------------------------------------------------|---------------------------------------------------------------------------|\n| \"Nærøyfjorden, Norway - from Breiskrednosi. UNESCO World Heritage\" [^1^](#credits1) ||\n| [](https://www.gstatic.com/webp/gallery/1.jpg) JPEG file size: 43.84 KB | [](https://www.gstatic.com/webp/gallery/1.webp) WebP file size: 29.61 KB |\n| ||\n| \"Kayaker at Ekstremsportveko 2010, Voss\". [^2^](#credits2) ||\n| [](https://www.gstatic.com/webp/gallery/2.jpg) JPEG file size: 86.25 KB | [](https://www.gstatic.com/webp/gallery/2.webp) WebP file size: 59.18 KB |\n| ||\n| Frame 10 of the \"Parkrun\" sequence [^3^](#credits3) ||\n| [](https://www.gstatic.com/webp/gallery/3.jpg) JPEG file size: 297.05 KB | [](https://www.gstatic.com/webp/gallery/3.webp) WebP file size: 198.38 KB |\n| ||\n| Image: [\"A Wild Cherry (Prunus avium) in flower\"](https://commons.wikimedia.org/wiki/File:Fr%C3%BChling_bl%C3%BChender_Kirschenbaum.jpg) [^4^](#credits4) ||\n| [](https://www.gstatic.com/webp/gallery/4.jpg) JPEG file size: 251.03 KB | [](https://www.gstatic.com/webp/gallery/4.webp) WebP file size: 172.82 KB |\n| ||\n| Image: [Fire breathing \"Jaipur Maharaja Brass Band\" Chassepierre Belgium](https://commons.wikimedia.org/wiki/File:Fire_breathing_2_Luc_Viatour.jpg) [^5^](#credits5) ||\n| [](https://www.gstatic.com/webp/gallery/5.jpg) JPEG file size: 120.78 KB | [](https://www.gstatic.com/webp/gallery/5.webp) WebP file size: 80.76 KB |\n\nImage Credits\n-------------\n\nThe images on this page come from a number of different sources. We have\nselected some delightful and rich pictures to showcase qualities of WebP.\n\nCredits for the images above are listed here in order.\n\n|---|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| 1 | \"Nærøyfjorden, Norway - from Breiskrednosi. UNESCO World Heritage\" Image Author: Kjetil Birkeland Moe Reproduced with permission of the author. [PNG source](https://www.gstatic.com/webp/gallery/1.png) [Blog post](https://www.kjetilbm.net/prosjekter/data/lyd-og-bilde/webp#) by author with comparison of JPEG and WebP. Mouse hover activates examples. |\n| 2 | \"Kayaker at Ekstremsportveko 2010, Voss\" Image Author: Kjetil Birkeland Moe Reproduced with permission of the author. [PNG source](https://www.gstatic.com/webp/gallery/2.png) [Blog post](https://www.kjetilbm.net/prosjekter/data/lyd-og-bilde/webp#) by author with comparison of JPEG and WebP. Mouse hover activates examples. |\n| 3 | Frame 10 of the \"Parkrun\" sequence Image Producer: Lars Haglund, SVT Sveriges Television AB Reproduced with permission of producer [PNG source](https://www.gstatic.com/webp/gallery/3.png) |\n| 4 | Image: [\"A Wild Cherry (Prunus avium) in flower\"](https://commons.wikimedia.org/wiki/File:Fr%C3%BChling_bl%C3%BChender_Kirschenbaum.jpg) Image Author: Benjamin Gimmel [PNG source](https://www.gstatic.com/webp/gallery/4.png) Photo licensed under the [Creative Commons](https://en.wikipedia.org/wiki/en:Creative_Commons) [Attribution-Share Alike 3.0 Unported](https://creativecommons.org/licenses/by-sa/3.0/deed.en) license. |\n| 5 | Image: [Fire breathing \"Jaipur Maharaja Brass Band\" Chassepierre Belgium](https://commons.wikimedia.org/wiki/File:Fire_breathing_2_Luc_Viatour.jpg) Author: Luc Viatour [PNG source](https://www.gstatic.com/webp/gallery/5.png) Photo licensed under the [Creative Commons](https://en.wikipedia.org/wiki/en:Creative_Commons) [Attribution-Share Alike 3.0 Unported](https://creativecommons.org/licenses/by-sa/3.0/deed.en) license. Author website at [www.lucnix.be](https://www.lucnix.be) |\n\nReproducing the Images\n----------------------\n\nFor the sake of reproducibility and to demonstrate the use of some WebP\ncompression parameters, we describe here the exact steps involved when\ngenerating the images in this gallery.\n\n### Tools\n\nTo convert and rescale the source pictures, we used a recent version of\nImageMagick's tool named `convert`, available at \u003chttps://www.imagemagick.org\u003e.\nThe version information reads: \n\n Version: ImageMagick 6.5.7-8 2010-12-02 Q16 https://www.imagemagick.org\n\nFor JPEG compression, we used the version 8b of IJG's reference encoder,\navailable at \u003chttps://www.ijg.org/files/jpegsrc.v8b.tar.gz\u003e.\n\nThe version information reads: \n\n Independent JPEG Group's CJPEG, version 8b 16-May-2010\n Copyright (C) 2010, Thomas G. Lane, Guido Vollbeding\n\n### Generating the Source PNG Pictures\n\nFirst, the JPEG sources are converted losslessly to PNG format simply using: \n\n convert in.jpg out.png\n\nThen, the large source images are rescaled to a smaller width of 1024 pixels\nusing the following command: \n\n convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png\n\nto produce the final set of source PNG images.\n\n### Compressing to JPEG Format\n\nJPEG's encoder (`cjpeg`) takes input images in PPM format. We use `convert` to\ngenerate them. The complete conversion sequence is then: \n\n convert in.png tmp.ppm\n cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm\n\nwhich produces optimized JPEG files with a quality factor of 80.\n\n### Compressing to WebP Format\n\nWe targeted a 30% file size reduction compared to the optimized JPEG files.\nThus, we explicitly specified the target sizes for each picture.\nAdditionally, we set ad-hoc values for the filtering strength for each\npicture, thanks to the `-f` option of the `cwebp` tool. The amplitude of the\nspatial noise shaping is also reinforced for some pictures by use of the\n`-sns` option. The exact command lines used read: \n\n cwebp -m 6 -f 50 -size 31500 1.png -o 1.webp\n cwebp -m 6 -f 20 -sns 100 -size 62000 2.png -o 2.webp\n cwebp -m 6 -sns 90 -size 213000 3.png -o 3.webp\n cwebp -m 6 -f 40 -size 181000 4.png -o 4.webp\n cwebp -m 6 -f 40 -size 89000 5.png -o 5.webp\n\nOverall, the resulting WebP files provided a global saving of 32% compared\nto the JPEG file sizes.\n\nNote that the WebP thumbnails used on this page are also smaller by 26%\ncompared to their JPEG equivalent."]]
