如何充分利用 Smush 图像优化

手动优化图像需要大量调整大小、大量编码和大量时间.幸运的是,Smush 为您完成了所有繁重的工作,此外还有更多其他工作,您将在本指南中找到所有这些内容,以帮助您充分利用插件.

Smush 提供了丰富的功能来帮助您控制图像.

例如,虽然 Smush 可能以压缩图像(不损失质量)而闻名,但它还可以通过延迟加载功能帮助延迟屏幕外图像,将图像转换为下一代格式 (WebP),以及从我们超快的 CDN 中提供您的图像.

幸运的是,当您安装了 Smush 时,您无需为图像投入太多时间或精力.大多数功能可以一键激活.

无论您是新用户还是只是希望发现您可能错过的一些很酷的功能,本指南都将帮助您充分利用此插件.

我们看看如何:

  1. 批量处理所有图片
  2. 自动压缩新上传的内容
  3. 双倍压缩的 Super-Smush
  4. 显示全尺寸图片
  5. 将您的 PNG 转换为 JPEG
  6. 来自媒体库的 Smush
  7. 延迟加载图像以提高速度
  8. 利用 Smush 的 CDN
  9. 提供正确的图像尺寸
  10. 将您的图像转换为下一代格式

事不宜迟,以下是如何充分利用 Smush:

1.批量处理所有图像

当您第一次安装 Smush 时,您可能会有大量需要您注意的图像.

Bulk Smush 功能会扫描您的网站,以查找可从压缩中受益的任何图像.

Screenshot of the bulk smush feature which shows 7 images which need smushing.
每次添加新图片时,Smush 都会将它们添加到这个总数.

您只需点击按钮即可-Smush 为您完成所有繁重的工作,并在工作完成时通知您.

Screenshot showing the bulk smush successfully completed.
比自己压缩要快得多.

如果需要,您可以从 Bulk Smush 中排除某些图像尺寸.但是,由于 Smush 可以在不牺牲质量的情况下进行压缩,因此将它们全部粉碎可能是有益的.

Screenshot of the various image sizes which are available to exclude.
从要排除的图像尺寸中删除勾号被压缩.

2.自动压缩新上传的内容

一旦您使用 Bulk Smush 功能来赶上您的图像压缩积压,您将很少需要再次使用它.

这是因为方便的自动压缩功能.如果您启用此功能,Smush 会在您将图片上传到您的网站后立即对其进行压缩.

Screenshot showing the various image sizes that you can include when bulk smushing if you didn't want to select 'all'.
日常图像修剪的日子很容易成为过去.

3.Super-Smush 双倍压缩

如果您的主要关注点是网站的速度,您可能需要进一步压缩图片.

Super-Smush 通过去除所有不需要的数据,在不降低图像质量的情况下提供两倍于常规 smushing 的压缩.

Screenshot of the super-smush button.
试一试——我们挑战你注意到不同之处质量!

如果您不想采用 Super-Smush,则可以从图像中去除不必要的元数据,只留下 SEO 所需的元数据.照片通常将相机设置存储在文件中,例如焦距、日期、时间和位置-删除这些设置会减小您的文件大小.

如果您是一名摄影师,您可能希望保留此信息,但它在大多数网站上几乎没有用处,因此通常可以安全删除.

4.显示您的全尺寸图像

如果您上传的图片的宽度或高度均大于 2560 像素,WordPress 会自动将其缩小以生成"网络优化"的最大图片尺寸.

如果您有意添加更大的图像并想要覆盖它,您可以使用图像大小调整选项.

Screenshot of the resize my full size images button
您可以设置自己的新最大图像尺寸.

请记住,您的主题也可能有自己的最大图像尺寸-在启用此功能之前,您需要检查这一点.

如果您要上传全尺寸图片,您还可以选择是否将这些图片包含在 Bulk Smush 中.

Screenshot of the settings for smushing original images.
另外几个简单的一键式功能.

如果您想存储所有全尺寸图像的副本,请确保启用底部选择,以防您想将它们恢复为预先压缩的形式.

通过查看此博客了解有关 WordPress 如何处理图像的更多信息.

5.将您的 PNG 转换为 JPEG

在某些情况下,这两种文件类型中的一种比另一种更合适.但是,如果您对网站的主要关注点是内存使用和速度,那么使用 JPEG 而不是 PNG 应该是有益的.

如果您将图片上传为 PNG,Smush 可以检查将它们转换为 JPEG 是否会减小文件大小.

Screenshot of the png to jpeg button
如果没有减少,文件将保留为 PNG文件大小.

当然,您可以在 WordPress 之外进行相同的转换.但是,使用 Smush 可以消除麻烦,并一次性转换所有文件.

6.来自媒体库的 Smush

如果您更喜欢选择单个图像进行压缩,请选择您自己的媒体库.

在这里,您会发现一个标有"Smush"的新列.

Screenshot of the column which appears in the media library upon activation of smush.
您可以一张一张地压缩您的图片.

如果您关闭了自动压缩,您上传的任何照片都应该准备好从您的媒体库中删除.

您可以单独对图像进行模糊处理,也可以从批量模糊处理中挑选出要忽略的图像.

7.延迟加载图像以提高速度

如果您有包含大量照片的页面,一次显示它们会给服务器带来很大压力.

推迟屏幕外图像是让服务器专注于加载网站元素的好方法,这样您的访问者就可以直接进入.

Screenshot of the lazy loading feature activated.
发现不对可以一键关闭为您的网站.

如果您希望从延迟加载中排除某些类型的图像或某些输出位置,您可以在此处轻松添加它们.

Screenshot of the different media types and output locations you can exclude.
从您不做的任何选项中删除勾号'不想包括.

您还可以排除某些不同的帖子类型、特定 URL 以及 CSS 类和 ID.

基本上,如果您想启用延迟加载,您可以精确调整启用的方式和位置.

选择延迟加载哪些图像后,您就可以决定预加载图像的显示方式.

Screenshot of the display animation options.
如果你不想要任何形式的动画,只需选择"无".

8.利用 Smush 的 CDN

您离提供内容的服务器越近,加载速度就越快.CDN(内容分发网络)是分布在全球的一系列服务器,当浏览器发出 HTTP 请求时,内容会从距离其位置最近的服务器提供.

Smush Pro 拥有 45 分的 CDN,还有一些额外的技巧.它可以自动调整您的图片大小,并将其转换为 Google 自己的下一代格式 WebP.

观看下面的视频,详细了解我们的 CDN.

如果您只想从 CDN 提供图像,则无需深入研究这些内容.

但是,有一些有用的工具可以对您的网站有益,因此值得一试.

要激活 Smush Pro Image CDN,请从您网站仪表板中的 Smush Pro,转到 CDN 选项卡并单击蓝色按钮.

Screenshot of the CDN just before activation.
激活CDN后,您将看到更多选项在 Smush 中.

这将存储和提供来自 Smush 边缘服务器的所有 JPG、PNG 和 Gif 图像的副本——显着提高速度.

不要遗漏你的背景图片

作为标准,只有在您的帖子和页面上使用的图片才会通过 CDN 提供.

如果您希望从与其他图像相同的快速 CDN 提供背景图像,Smush 可以满足您的需求.

Screenshot of the background images option.
如果通过我们的服务,您的背景图片将更快地到达您的访问者手中CDN.

您需要确保在主题文件中使用 CSS 正确声明了背景图片.

9.提供正确的图像尺寸

理想情况下,您提供的图片永远不应大于用户屏幕上显示的图片.使用原始图像或全尺寸图像,当较小的图像可以使您的页面在浏览器等待图像呈现时需要更长的时间来加载.

Smush 的 CDN 包含一个方便的功能,可以调整图像大小以适合容器,而无需接触任何代码.

Screenshot of the automatic resizing option.
由于调整大小是从 CDN 完成的,您的原始图像将保持全尺寸.

10.将您的图像转换为下一代格式

JPEG 2000、JPEG XR 和 WebP 是具有卓越压缩能力的现代图像格式.这意味着它们生成的图像文件要小得多,因此您可以大大提高页面速度.

以 WebP 格式提供的图像可以从 25% 以上的压缩中受益,当您考虑网站上的图像数量时,可以节省大量空间.

Smush 的 CDN 提供了一个选项,只需单击一下即可将您的图像转换为 WebP.

Screenshot of the webp conversion button.
所有的跑腿工作都由 Smush 处理.

并非所有浏览器都支持下一代格式,您在决定进行转换时通常必须牢记这一点.

但是,如果您启用了 WebP 转换功能,Smush 会自动检查浏览器是否支持这种格式,如果不支持,则会以原始格式提供.这可确保您的任何访问者都不会受到损害.

触手可及的支持

现在您了解了这个小插件的来龙去脉,是时候深入了解您的网站如何受益了.

Smush 是一个非常用户友好的插件,因此您应该可以轻松管理您的图像.

但是,如果您发现自己需要一些友好的建议,成员应该看看我们 24/7 全天候可用的出色支持团队.

您还可以查看插件文档,并在我们的路线图.

9

发表回复