如果你想加快 WordPress 网站的速度,寻找减少图像大小的方法可以为你带来丰厚的投资回报。平均而言,图片约占网页文件大小的一半,因此即使是很小的改进也可以取得很大的效果。

WebP 是一种现代的图像格式,可以帮助你减小图像的大小而不改变其外观。平均而言,学习如何将图像转换为 WebP 可以将其尺寸缩小〜25-35%,而不会造成明显的质量损失。

什么是 WebP?

简而言之,WebP 是 Google 开发的一种图像格式。例如,你具有 JPEG 或 JPG 和 PNG 等图像格式,对吗?嗯,WebP 是图像的另一种文件格式。WebP 专注于提供相同的图像文件,只是文件尺寸较小。通过减少图像文件的大小,你仍然可以为网站的访问者提供相同的体验,但是网站加载速度更快。

例如,在 Google 的 WebP 压缩研究中,Google 发现一个 WebP 图像文件平均...

  • 比同类 JPEG 图像小 25-34%。
  • 比类似的 PNG 图像小 26%。

那么 Google 的 WebP 格式如何实现文件大小的这些减少?WebP 支持有损和无损压缩,因此确切的减少取决于你使用的是有损还是无损压缩。通过有损的 WebP 压缩,WebP 使用一种称为 “预测编码” 的方法来减小文件大小。预测编码使用图像中相邻像素的值来预测值,然后仅对差异进行编码。它基于 VP8 关键帧编码。

哪些 Web 浏览器支持 WebP?

为了使 WebP 图像起作用,访问者的 Web 浏览器需要支持它们。不幸的是,尽管浏览器支持增长了很多,但 WebP 兼容性仍然不是通用的。流行的浏览器支持 WebP 图像,例如:

  • Chrome(台式机和移动端)。
  • Firefox(台式机和移动端)。
  • Edge。
  • Opera(台式机和移动端)。

但是,值得注意的是 Safari。在撰写本文时,Safari 的桌面版和移动版均不支持 WebP 图像。苹果在 2016 年短暂地尝试了对 Safari 的 WebP 支持,但此后没有再进行任何进展。

Internet Explorer 也缺少 WebP 支持(但是 Edge 确实支持 WebP,因为它基于 Chromium)。

总计,大约 77%的 Internet 用户使用支持 WebP 的浏览器。因此,尽管它确实获得了多数支持,但 23%的份额太大了,不容忽视(在下面的 WordPress WebP 教程中,我们将向你展示如何处理此问题,以便所有访问者都拥有很好的体验):

“WepP”格式在各种浏览器中的兼容性

WebP,JPG,PNG 大小比较

根据 Google 的测试,WebP 图像为:

  • 比同类 JPEG 图像小 25-34%。
  • 比同类 PNG 图片小 26%。

如何在 WordPress 上使用 WebP 图像

由于并非所有浏览器都支持 WebP 图像,因此你不能像在 JPEG 和 PNG 中那样,仅在媒体库中上传 WebP 图像文件并直接在 WordPress 中使用它们。同样,23%的人(包括所有 Safari 用户)使用不支持 WebP 的 Web 浏览器。如果你转换 WebP 图像并直接在你的内容中使用它们,则这些访问者将无法看到你的图像,这将破坏他们的浏览体验。

你可以使用 WordPress 插件,而不是将 WebP 图像直接上传到 WordPress,而是将你的原始图像转换为 WebP 格式,并且还可以在访问者的浏览器不支持 WebP 时提供原始图像作为后备。

例如,如果你将 JPEG 文件上传到你的网站,则该插件将:

  • 将 JPEG 文件转换为 WebP,并使用 WebP 版本供访问者使用 Chrome,Firefox 等浏览。
  • 向使用 Safari 和其他不支持 WebP 的浏览器浏览的访问者显示原始 JPEG 文件。

这样,每个人都可以看到你的图像,并且每个人都可以获得最快的体验。

WebP 插件

ShortPixel

ShortPixel 是一个流行的 WordPress 图像优化插件,可以帮助你自动调整大小并压缩上传到 WordPress 网站的图像。

作为其功能列表的一部分,ShortPixel 还可以帮助你自动将图像转换为 WebP 并将这些图像提供给支持 WebP 的浏览器。ShortPixel 有一个有限的免费计划,可让你每月免费优化约 100 张图像。之后,付费计划的最低价格为每月 4.99 美元,或一次订购 9.99 美元。

ShortPixel 会将你优化过的每个 WordPress 图像尺寸计算在内。因此,如果你要优化多个图像缩略图的大小,则可以想象一张图像可以使用多个字幕。图像没有文件大小限制。你可以在不限数量的网站上分配你的 ShortPixel 积分 - 没有针对每个站点的限制(并且你的所有网站都可以使用相同的 ShortPixel 帐户)。

要使用 ShortPixel 在 WordPress 上提供 WebP 图像,你需要从 WordPress.org 安装插件并添加你的 API 密钥(你可以通过注册免费的 ShortPixel 帐户获得)。

在 “ 常规” 选项卡中,你可以设置图像优化工作方式的基本设置。例如,使用哪种压缩级别以及是否调整图像大小:

初始化 ShjortPixel 插件

要启用 WebP 图像,请转到 “ 高级” 选项卡,然后:

  1. 选中 “ WebP 图像 ” 框
  2. 选中提供 WebP 版本的框。(选中第一个框后出现)
  3. 选择使用 <PICTURE> 标记语法的单选按钮(在选中上一个框后显示)
  4. 保留默认的 “ 仅通过 WordPress 挂钩” 选择

然后,保存你的更改。

WordPress 网站的图像在平均页面的文件大小中占很大一部分。如果你找到减小图像大小的方法,则可以在不改变访问者体验的情况下加快网站速度。WebP 是一种现代图像格式,与比较的 JPEG 或 PNG 文件相比,可以将文件大小减少约 25%。 大多数现代浏览器都支持 WebP,大约 77%的 Internet 用户使用的浏览器支持 WebP。但是,某些浏览器(尤其是 Safari)仍然不提供 WebP 支持,因此你不能为所有访问者提供 WebP 图像。