随着互联网的发展,图片作为最直观的内容展示方式逐渐在系统中占用越来越多的版面,但是随之而来的就是系统性能的大幅度下滑。传统的JPEG、PNG、GIF各有优点,也各有弊端,“大一统”的图片格式被需要,于是WebP诞生了。
需求
WebP格式文件产生的原因主要是源于对**「网络图像传输效率」的需求以及「现有图像格式在某些方面的局限性」**。
在现代互联网网站需要加载**「大量的高质量图像」,智能手机和平板电脑的普及推动了「移动互联网」**的快速发展。在移动设备上用户的流量是有限的。因此,如何在不影响图像质量的前提下减少图像文件大小,成为了一个重要的课题。
传统的JPEG、PNG和GIF等传统图像格式各有其优点,但也存在不足之处。
例如,JPEG虽然非常适合照片,但仅支持有损压缩且不支持透明度;PNG支持透明度但文件大小通常较大;GIF支持动画但色彩范围有限,且文件体积相对较大。
产生
WebP是一种由Google开发的图像文件格式,旨在提供更高效的图片压缩,适用于网络图像传输和展示。
-
「高压缩效率」:WebP采用了先进的压缩算法,可以提供比JPEG更高的压缩率而不会明显损失图像质量。这意味着使用WebP格式可以在不牺牲视觉体验的情况下显著减少图片文件的大小,从而加快网页加载速度。
-
「支持透明度」:与JPEG不同,WebP支持alpha通道(即透明度),这使得它在需要背景透明效果的应用场景中成为PNG的一个有力替代者,同时还能以更低的文件大小实现这一功能。
-
「动画支持」:除了静态图像外,WebP还支持动画,作为一种更加有效的替代GIF的方案。相比GIF,WebP能够以更小的文件尺寸提供更高品质的动画效果和更多的色彩支持。
-
「广泛兼容性」:虽然WebP最初由Google推出,但它逐渐获得了广泛的浏览器和其他平台的支持,包括Chrome、Firefox、Edge、Safari等主流浏览器,以及各种操作系统和图像处理软件。
使用
「在线格式转换」
-
SO JSON 在线格式转换 https://www.sojson.com/image/format.html
-
Convertio https://convertio.co/zh/image-converter/
-
ALL TO ALL https://www.alltoall.net/
「程序格式转换」
Python:可以使用Pillow库(PIL的一个分支)结合webp的支持来进行转换。
// 安装 pip install Pillow
from PIL import Image
im = Image.open("input.png")
im.save("output.webp", "WEBP")
也可以使用Node.js来转换(在下面的篇幅中详细写个例子)
// 安装 npm install sharp
const sharp = require('sharp');
sharp('input.jpg')
.webp({ quality: 90 })
.toFile('output.webp')
.then(info => { console.log(info); });
局限
- 「浏览器兼容性」:虽然大多数现代浏览器已经支持WebP格式,但仍有少数旧版浏览器可能不完全支持或根本不支持这种格式。在转换的同时也需要准备适当的回退方案(如提供JPEG或PNG版本的图像)。
- 「性能问题」:尽管WebP通常能提供更好的压缩率和质量比,但在某些情况下,转换过程可能会增加服务器负载,尤其是在需要实时生成WebP图像的情况下。
- 「特定需求和偏好」:一些网站可能基于设计、品牌或其他技术要求而选择特定的图像格式。例如,对于需要极高保真度的专业摄影展示,可能仍然倾向于使用TIFF或高质量JPEG格式。