如何使用 Smush 在 Google 的图像 PageSpeed 推荐中获得王牌

Smush 拥有优化图片所需的一切,以及一系列方便的工具,可帮助您粉碎 PageSpeed Insights 与图片相关的建议.

这是一种在不牺牲图像质量的情况下加快网站速度的简单方法.

使用 Smush,您可以:

  • 一键式批量压缩图像
  • 自动调整大小并重新缩放您的图片
  • 启用延迟加载,这样您的服务器就可以专注于显示首屏内容
  • 将您的图像文件转换为更小且显示速度更快的格式.

超过一百万次安装和超过 500 亿张图片.

在图片方面有四个主要建议,Smush 可以回答所有这些建议.

"我不知道我的页面加载时间被图像拖慢了.该插件几乎将花费的时间减少了一半." – karlcw

本指南将向您展示 Smush 如何帮助您将 PageSpeed Insights 分数提高到绿色.

推迟屏幕外图像

您不想浪费服务器资源并牺牲页面速度来加载页面一半的图像,因此推迟屏幕外图像对许多网站来说都是有意义的.

当您安装 Smush 时,延迟加载是您应该检查的第一批功能之一.只需启用它即可修复"延迟屏幕外图像"PageSpeed 建议.

Smush 的延迟加载功能不仅仅是一个开关按钮.

您可以选择要包含的图像格式.

Screenshot of the media types, whocing jpeg, png, gif, svg and iframe which can all be excluded.
也许您希望您的 JPEG 延迟加载,但不是您的PNG?

以及您要排除的任何帖子类型.

Screenshot of the different pages you can exclude from lazy load including the front page, blog and posts.
还可以选择添加任何特定页面的 URL.

延迟加载很容易被撤消,因此请打开它,检查您的新 PageSpeed Insights 分数,最重要的是,检查它对您网站的影响.

有效编码图像

如果您想要一个完整而全面的图片优化指南,我建议您查看此博客,因为在这里,我们完全专注于 Smush 如何帮助您满足 PageSpeed Insights 审核要求.在本节中,特别是"有效编码图像"建议.

模糊您的图像可防止您的服务器被不需要的额外 MB 堵塞.

您可以通过多种方式进行 Smush,质量几乎没有差异.

Smush 上传

默认情况下自动压缩处于开启状态,用于有效地编码图像.这是一个影响大、风险低的功能,应该在大多数网站上使用.

Screenshot of automatic compression showing it enabled and ready to automatically compress images on upload.
您可以选择是否要将其应用于所有图像,或排除某些尺寸.

如果您不希望 Smush 自动压缩您的照片,您可以通过其他几种方式来进行管理:

批量粉碎

您可以使用 Bulk Smush 功能扫描您的网站以查找需要注意的照片并一次性将它们全部粉碎.

 

Screenshot of bulk smush showing that there are three images in need of smushing.
点击按钮,让插件完成所有工作你.

浏览媒体库

您还可以前往媒体库查看是否有可用于 smushing 的图片.

Screenshot of an image of a moon in the media library ready to be smushed.
您可以单独浏览媒体库或选择图像以被 autosmush 忽略.

粉碎其他目录

您不仅限于媒体上传-您还可以将非 WordPress 图像涂抹在上传目录之外.

Screenshot of the directory smush option showing the navigati9on to the wp-content folder to search for more images.
您可以轻松浏览您的文件夹以找到您想要的图像想要 Smush.

超级粉碎

如果您想进一步减小文件大小,Super Smush 是您的下一个选择.

与标准方法相比,它提供 2 倍的粉碎能力,因此如果您有大量吸收宝贵资源的图像,它会很方便.

即使确保您的图像正确编码不是 PageSpeed Insights 审核机会之一,只要您的图像没有明显差异,消除任何多余的膨胀仍然是有意义的.

利用 CDN

Smush 还提供超快的 45 点 CDN(仅限专业版),让您能够以下一代格式提供图像,并确保它们以极快的速度传送到您的浏览器.

让您的图像成为下一代

下一代图像格式,例如 WebP 和 JPEG 2000/XR,可以大幅减小您的文件大小.

以其中一种格式提供图像将节省您的服务器资源,并满足 PageSpeed Insights 要求之一.

启用 Smush 的 CDN 后,您可以以下一代 WebP 格式提供图像.

由于并非所有浏览器都支持 WebP 图像,Smush 会对浏览器进行超快速检查,如果支持 WebP 图像,那就太好了-这就是为您的访问者提供的服务.如果没有,Smush 可以简单地提供 PNG 或 JPEG,以确保没有人错过.

大小合适的图片

强制浏览器在图像显示给用户之前调整其大小会降低您的网站速度并降低您的 PageSpeed Insight 分数.部分建议是避免提供比访问者屏幕上显示的版本更大的图像.

Screenshot of the automatic resizing feature showing it currently turned on.
使用 Smush 的 CDN,这是最简单的 PageSpeed Insight 之一解决建议.

如果您想确保完全彻底地正确调整图像大小,请阅读此博客以找出一些替代技巧.

用 Smush 粉碎 PageSpeed Insights

虽然许多用户都在努力改进他们的网站优化,但 Smush 可以让您更轻松、更快速地加载图像,从而提高页面加载速度……只需点击几下即可完成这一切!

遵循上述建议,今天就让 Smush 为您的网站工作.此外,请密切关注我们的路线图,了解 Smush 即将推出的所有令人兴奋的新功能.

8

发表回复