ShortPixel 评论:如何通过图像压缩优化您的网站性能

已发表: 2021-05-19
短像素图像优化器
关注@Cloudways

自 2014 年以来,已有超过 50 万用户尝试了 ShortPixel 出色的图像优化。 预见到网络速度优化在未来的重要性,这家总部位于罗马尼亚的公司推出了 ShortPixel Adaptive Images,这是一个非常易于使用的插件,只需点击几下即可解决与 GTmetrix 或 Google PageSpeed Insights 报告的图像相关的所有警告。 这可以提高您的 SEO 和网站的加载速度。

短像素图像优化器插件

但是插件是如何做到这一切的呢? 让我们在 Shortpixel Adaptive Images(简称SPAI )的详细评论中找到答案

  • ShortPixel 自适应图像有什么作用?
  • ShortPixel 自适应图像如何工作?
  • 安装和设置 ShortPixel 自适应图像
  • 价格和计划
  • 为什么要选择 ShortPixel 图像优化器?

ShortPixel 自适应图像有什么作用?

以下是 ShortPixel 主要做的 4 件事:

  • 它提供来自 CDN 的图像:ShortPixel Adaptive Images 获取网站访问者查看的所有图像,并从 ShortPixel 的 CDN 提供这些图像。 什么是 CDN? 它是一个内容分发网络。 简单来说,它是一组分布在世界各地的服务器,其中包含特定网站的副本。 因此,任何用户都将拥有良好的加载时间,无论他们位于哪个国家或地区。通过从 ShortPixel 的 CDN 加载图像,您正在做的是提高页面的加载速度(因为很可能 CDN 加载速度比平均托管服务提供商,除了在世界各地拥有服务器之外)并从服务器节省一些资源,因为不会从那里请求图像,而是从 ShortPixel 的 CDN 请求图像。
  • 它压缩图像:从 ShortPixel CDN 提供的图像使用 ShortPixel 强大的优化算法进行优化,该算法提供 3 个优化级别,有损、有光泽和无损。 稍后再谈。
  • 它提供自适应图像:这就是插件名称的来源。 假设您上传了一张图片,并将其以全尺寸版本添加到页面上。 从智能手机访问页面的用户不需要看到与使用笔记本电脑的用户相同大小的图像。 该插件负责处理,以设备请求的确切尺寸提供图像。 您是否曾经使用过 GTmetrix 并收到“正确大小的图像”错误? 它正是在抱怨这一点。 ShortPixel Adaptive Images 只需点击几下即可消除该消息!

短像素自适应图像

  • 它解决了您可能需要的所有与图像相关的问题:除了压缩图像并以正确的尺寸提供它们之外,图像还可以在许多方面进一步改进。 ShortPixel Adaptive Images 也会处理这个问题,只需点击几下,您就可以执行以下操作:
    • 删除EXIF信息
    • 以 WebP 格式提供图像
    • 延迟加载图像
    • 巧妙地裁剪图像
    • 从延迟加载中排除图像(用于预加载图像)

ShortPixel 自适应图像如何工作?

就像我们解释的那样,每次访问网站的一个页面时,ShortPixel Adaptive Images (SPAI) 都会分析其代码,并用大小合适和优化的图像替换每个未优化的原始图像。 每个替换的图像都来自 ShortPixel CDN。

SPAI 不接触服务器上的任何文件; SPAI 即时优化图像,这意味着如果您想返回原始图像,只需停用它们即可。 这是详细的过程,对所有用户完全透明:

1. 用户访问包含图像的页面。

2. 在页面加载时,SPAI 会查找代码中的任何图片 URL,例如:

短像素图像代码

3. 检测到图像 URL 后,它将该图像发送到 ShortPixel 的服务器,服务器对其进行优化并将其存储在 ShortPixel 的 CDN 上。 此步骤仅在第一次请求特定图像大小时执行。

4. 然后,SPAI 用新的 URL 替换 URL,该 URL 指向包含优化和适当大小图像的 CDN:

短像素图像优化器图像重命名

5. 页面加载完成,图片已从 ShortPixel 的快速 CDN 提供!

安装和设置 ShortPixel 自适应图像

安装

这是最简单的步骤,它像安装任何其他插件一样安装。 这是您需要查找的页面:ShortPixel Adaptive Images – WordPress.org

设置它

入职向导

如果这是您第一次使用 ShortPixel Adaptive Images,您现在将被重定向到 Onboarding Wizard:

短像素安装

这个 4 步向导将帮助您正确配置 SPAI,以便从优化的 CDN 提供所有图像。

例如,如果您已经在使用 SPAI 并更新到新版本,则可以通过转到“设置”>“ShortPixel AI”并单击“帮助”菜单右上角的“设置向导”按钮来重新启动向导:

短像素向导

请注意, ShortPixel 自适应图像不需要 API 密钥即可开始工作(与 ShortPixel 图像优化器相反)。 您只需将您的网站/域与您的帐户相关联,以便使用您的 ShortPixel 积分,这将由入职向导自动完成。

完成入门向导后,请务必清除站点的缓存,以便显示优化的图像!

设置

ShortPixel Adaptive Images 非常易于使用,因为它在使用 Onboarding Wizard 激活和设置后立即开始发挥它的魔力; 无需单击任何 ON 按钮或类似按钮。 但是,SPAI 还提供了一些设置来调整图像优化。 要访问,只需登录您的 WordPress 管理区域并转到设置 > ShortPixel AI。 我们将介绍最重要的设置,因此我们从“压缩”选项卡开始。

短像素自适应图像压缩选项卡

  • 压缩级别:在这里我们可以选择我们希望图像具有的压缩级别。
    • 有损是大多数用户的最佳选择。 用有损算法处理的图像是可以得到的最小的优化图像。 因此,如果您的网站速度至关重要,并且您希望在优化和图片质量之间取得最佳平衡,我们建议您使用有损优化。
    • 如果您仍然关心 GTmetrix 或 Google PageSpeed Insights,Glossy 是最佳选择,但您认为页面速度的轻微损失是一流图像质量的可接受妥协。
    • 使用无损,图像与原始图像逐像素相同,但与有损或有光泽处理的文件相比,它们提供的尺寸减小更小。 如果您希望图像保持不变,请选择此选项。
  • WebP 支持:WebP 格式是由谷歌创建的一种图像格式,可以在几乎不损失图像质量的情况下获得出色的压缩结果。 WebP 行为的快速示例:我们从互联网上拍了一张照片,并使用随机的在线 JPG 到 WebP 转换器,我们从 1.05 MiB 到 344 KiB,减少了 67.93%,并且图像质量几乎相同! 因此,通过选中“WebP 支持”选项,我们告诉 SPAI,只要浏览器兼容,从 ShortPixel 的 CDN 提供的图像应该是 .webp 格式。

shortpixel jpg 到 webp 转换器

  • 删除 EXIF :该插件允许删除嵌入在图像本身中的“额外”信息,例如位置、作者、相机型号等。这些信息通常不是必需的,删除它有助于减轻图像的权重一点点。 建议启用它。

现在我们转到行为选项卡。 在许多其他调整中,我们可以找到以下内容:

短像素自适应图像

  • 智能裁剪:插件将识别未显示所有图像的情况并相应地裁剪。
  • 已登录用户:默认情况下,即使您已登录,ShortPixel AI 也会提供和优化图像。但是,如果您想节省一些 CDN 流量和信用,您可以简单地禁用此选项,然后 SPAI 将仅适用于登录 -出用户(访问者)。
  • LQ 图像占位符:LQIP 代表低质量图像占位符。 它们是非常低质量的图像(因此非常轻),将在初始页面加载时加载,一旦页面完全加载,它们将被替换为完整质量的图像。 这有助于增加感知加载时间。

接下来,在区域选项卡中,我们将找到所有类型的设置来告诉 SPAI 应该解析和优化哪些图像:

  • SVG图像(这些不会被优化,只存储在 CDN 上)。
  • CSS 中的图像 在这种情况下,CSS 文件本身也将存储在 CDN 上。
  • JS块中的图像
  • JSON数据中的图像

最后,在排除选项卡上,我们找到了一些可以从优化中排除图像的字段:

  • 排除的选择器:在这里我们可以编写我们希望 SPAI 从优化中排除的 CSS 选择器。
    • 如果你在“不要延迟加载”中编写它们,这样的选择器不会被延迟加载,但它们仍然会被优化和调整大小。
    • 如果您将它们写在“不调整大小”中,SPAI 将优化此类图像但不会调整它们的大小。
    • 如果您将它们写在“完全离开”中,SPAI 将完全忽略它们,不进行优化或调整大小。
  • 排除的 URL :如果您希望 SPAI 通过 URL 忽略某些图像,这就是我们排除它们的地方,使用正则表达式(例如排除所有 GIF 或所有 PNG)或路径(例如排除单个图像) . 该插件很好地解释了如何使用此字段,请务必查看!

短像素图像检查器

完成所有设置后,请务必查看新的图像检查器工具,这是一个用于检查网站任何页面上优化图像状态的简单工具。 只需在登录时访问您的任何页面; 在工具栏上,您会注意到著名的 ShortPixel 机器人:

单击该图标,您将打开图像检查器。 每个图像都会出现一个标签:“CDN”或“ORIGIN”。 “CDN”表示图像是从 ShortPixel 的 CDN 优化提供的,“ORIGIN”表示它是从服务器提供的,换句话说,ShortPixel Adaptive Images 没有处理它。

短像素CDN

此外,光标将变为十字 (⌖),当我们单击图像时,我们将获得其他信息和操作:

短像素优化图像

价格和计划

在谈论定价之前,我们需要记住 SPAI 是即时工作的。 它仅处理从前端至少查看过一次的图像。 在此之前,图像将保持未处理状态,因此不会花费任何信用。

处理图像意味着智能裁剪(如果选择)、调整大小和优化它。 处理完图像后,它会存储在 ShortPixel CDN 服务器上,并且可以使用您购买的 CDN 流量配额将其提供给每个人。 只要有足够的 CDN 流量配额可用,优化的图像将从 ShortPixel 的 CDN 提供。

ShortPixel 提供转换为 CDN 配额的积分。 规则很简单:5 MB CDN 流量 = 1 credit 。 一次性和每月信用都可用于处理图像。

月度计划

  • 免费计划= 100 积分 = 500 MB CDN 流量 = ~500 次访问/月
  • 4.99 美元/月计划 = 5,000 积分/月 = 25 GB CDN 流量 = ~25,000 次访问/月
  • 9.99 美元/月计划 = 16,000 积分/月 = 80 GB CDN 流量 = ~80,000 次访问/月
  • 29.99 美元/月计划 = 55,000 积分/月 = 275 GB CDN 流量 = ~275,000 次访问/月
  • 99.99 美元/月计划 = 220,000 积分/月 = 1 TB CDN 流量 = ~1,100,000 次访问/月

一次性计划

  • 9.99 美元– 10,000 积分 = 50 GB = ~50,000 次访问
  • 19.99 美元– 30,000 积分 = 150 GB = ~150,000 次访问
  • 29.99 美元– 50,000 积分 = 250 GB = ~250,000 次访问
  • 99 美元– 170,000 积分 = 850 GB = ~850,000 次访问
  • 249 美元– 500,000 积分 = 5 TB = ~2,500,000 次访问

示例:假设您拥有一个拥有 5000 多张图像的中等网站,每月访问量达到 10,000 次。

每月 4.99 美元的月度计划将允许 25 GB 的 CDN 流量,根据我们的测试,这意味着每月大约有 25,000 次访问。

在此处了解有关计划和定价的更多信息。

这值得么?

考虑到网站最重要的部分始终是图像,并且网站加载的每一秒都会导致用户流失和转化,这绝对是值得的。 它是一个安装即忘的插件,如果您想返回原始图像,您只需卸载它即可。

此外,他们的支持团队非常出色,数十名用户可以在 wordpress.org 上对此进行担保。

这是一个强烈推荐的插件,有助于提高您网站的速度,增加您在 Google 中的位置和访问者数量。 如果您将其与 Cloudways 等优质托管服务相结合,结果将更加令人兴奋。

我们希望这篇对 ShortPixel Adaptive Images 的评论将帮助您使您的网站超快!