如何提高您的 Google PageSpeed Insights 分数

提高 pagespeed insights 转化率的最简单方法可能与改进标题或更改 CTA 按钮的颜色无关。 相反，它是关于提供更快的用户体验。

谷歌的研究发现了转化率和加载时间之间的联系。 它还表明您可能会因为滞后的点击后登录页面而失去一半的潜在客户。 幸运的是，您可以使用一种工具来确定是什么减慢了速度。

谷歌对页面速度的研究

在点击了 900,000 个广告后，谷歌的研究人员发现移动点击后登录页面的平均加载时间令人尴尬，只有 22 秒。 这比大多数不耐烦的互联网用户在放弃页面之前等待的时间长 7 倍多——准确地说是 53%。

如果您的页面加载时间超过 3 秒，则超过一半的潜在客户甚至在看到它之前就离开了。 好像这还不够糟糕，研究发现，每过一秒，页面就不会加载，更多的访问者会跳出：

借助 SOASTA 的机器学习技术，研究人员发现了加载时间、页面权重（数据大小）和转化率之间的相关性。 基本上，“更重”意味着更慢。 具体来说，当页面上的元素（文本、图像等）数量从 400 增加到 6,000 时，您转换访问者的机会会下降 95%。

但是，如果您的页面加载缓慢，查明问题并不总是那么容易。 虽然文本的数量和图像的数量一目了然，但诸如过多的 JavaScript 和过多的重定向之类的问题却不是。

幸运的是，有一个免费工具可以用来准确找出导致页面加载时间变慢的原因。

什么是 Google PageSpeed Insights？

Google PageSpeed Insights 是一款可让您快速轻松地测试网页速度的工具。

输入一个 URL 并点击“分析”，您将很快得到一份基于两个参数的导致该网页变慢的详细报告，以及有关如何修复它的建议。

• 参数 1：首屏加载时间。 这是在用户请求新页面后页面显示首屏内容所花费的时间。

• 参数 2：整页加载时间。 这是浏览器在用户请求后完全呈现页面所花费的时间。

根据谷歌的说法，它是这样工作的：

Page Speed Insights 衡量页面在移动设备和桌面设备上的性能。 它两次获取 url，一次使用移动用户代理，一次使用桌面用户代理。

PageSpeed Insights 得分范围为 0 到 100 分。 分数越高越好，85分以上表示页面表现良好。

但是，当人们希望页面立即加载时，“好”就足够了吗？ 不是每一秒都很重要。 要获得尽可能高的分数，以下是您需要做的……

获得较高的 Google PageSpeed Insights 分数

如果您在报告中看到大量红色和黄色，那是因为您的页面存在一些明显的加载问题。

该工具会通知您这些问题，但错误消息可能有点难以理解。 以下是您可能会看到的内容以及解决方法：

1.避免点击后登陆页面重定向

如果您的页面没有设计成响应式的，结果可能是许多重定向到针对不同设备优化的页面。 据谷歌称，一些常见的重定向模式：

• example.com 使用响应式网页设计，无需重定向 - 快速且最佳！
• example.com → m.example.com/home – 移动用户的多次往返惩罚。
• example.com → www.example.com → m.example.com – 非常慢的移动体验。

每次必须重定向用户时，页面呈现都会停止——这会增加页面加载时间的宝贵秒数。 通过使用响应式设计构建页面来完全避免重定向——无论您的潜在客户使用什么设备，这种方法都能确保高质量的用户体验。

（所有 Instapage 模板都是响应式的，因此您的用户永远不必捏合来缩放。）

2.启用压缩

今天的浏览器能够为互联网用户提供一个较小的替代版本的页面。 启用压缩器 gzip 后，这些页面的大小可以缩小 90%。

在他的网站 Better Explained 上，Khalid Azad 很好地描述了 gzip 如何优化 HTTP 请求和响应过程：

但是，当启用压缩时，过程看起来更像这样：

浏览器无需为用户提供整个页面，而是可以获取一个指数级缩小的压缩版本，只需很短的时间即可加载。 在此处了解有关使用 gzip 进行优化的更多信息。

3. 压缩 CSS、HTML、JavaScript

“缩小”是指在不影响浏览器处理页面的方式的情况下，删除不必要或冗余的数据。 糟糕的编码可能是导致此问题的原因，可以通过几种不同的方式解决。

除了手动调查页面的源代码外，Google 建议尝试使用以下资源：

• 用于缩小 HTML 的 HTML 缩小器。
• CSSNano 和 csso 来缩小 CSS。
• UglifyJS2 和 Closure Compiler 来缩小 JavaScript。

当然，另一种选择是利用 Google 的 AMP 和 AMP for ads 框架。 这两个程序都允许开发人员使用精简版的 HTML、CSS 和 JavaScript 构建页面。 结果是在几分之一秒内加载页面和广告。

4.优先考虑首屏内容

这看起来很奇怪，页面加载时间不仅仅与页面加载的速度有关。 它还与“感知性能”有关。 来自 KeyCDN 的 Brian Jackson 解释道：

感知性能可以简单地描述为“您的网站加载时感觉有多快？” 这可能与您网站的实际加载速度略有不同。 感知性能都是从用户的角度来看的，而不是来自网站速度测试工具。

为了提高感知性能，优先加载对用户重要的内容至关重要。 例如，折叠上方的页面文本应在第三方小部件之前加载。

但是，当代码结构不正确时，结果可能会降低用户心目中的感知性能。 如果页面上最后要加载的元素是用户点击查看的元素，则页面会感觉加载时间更长。

5.加快服务器响应时间

服务器响应时间——你的服务器开始为用户加载页面内容所花费的时间——根据谷歌的说法，它可能会因多种因素而变慢：

• 数据库查询
• 路由慢
• 构架
• 图书馆
• 资源 CPU 饥饿
• 内存不足

对于 Raelene Morey 的网站，糟糕的托管是速度的主要杀手。 她告诫读者：

提供每月 3.95 美元套餐且无限制页面浏览量和无限空间的廉价网络托管服务商似乎很划算，但代价通常是网站速度较慢，并且在高流量期间经常停机。

如果您希望您的网站快如闪电并确保您的网站运行良好，您需要投资一个像样的虚拟主机。 如果您真的希望您的网站速度更快，您可能需要查看不在共享服务器上的托管包。

在决定使用 WP Engine 之前，她测试了许多主机，这帮助她达到了 Google 推荐的低于 200 毫秒的服务器响应时间。 考虑做同样的事情，或者将您当前的网络托管包升级到功能更强大的计划。

6. 消除渲染阻塞的 JavaScript

除其他外，JavaScript 支持一些强大的第三方工具和交互式页面元素。 问题是，它还会停止 HTML 代码的解析。

当您看到一条错误消息“eliminate render-blocking JavaScript”时，这意味着有一段 JavaScript 代码正在暂停页面上折叠部分的加载过程。 第三方脚本尤其可能是造成此问题的罪魁祸首。 三种方式应对：

• 对加载过程不重要的脚本应该有意延迟——在页面完全呈现后获取和执行。

• 异步加载的脚本应该优先于同步加载的脚本。 同步脚本暂停页面呈现过程，而异步脚本允许浏览器同时加载其他元素。

• 考虑内联脚本——将小型外部 JavaScript 资源直接插入 HTML 文档——以减少浏览器必须发出的请求数。

7.利用浏览器缓存

在为用户完全加载页面之前，它可以在服务器和浏览器之间接受多个请求。 就时间而言，每一个加起来。

缓存允许您的浏览器以某种方式“记住”最近加载的某些元素——标题、导航、徽标等。浏览器可以缓存的元素越多，在用户进行访问时加载的元素就越少。请求，最终，页面加载速度越快。

谷歌建议至少一周的缓存策略，对于基本不变的元素，一年是更可取的。

8.优化图片

在博客文章中，谷歌测试人员特别警告图像对页面速度构成的威胁。 “图标、徽标和产品图像等图形元素很容易占到页面总重量的三分之二，”他们说。

当发生这种情况时，对页面加载时间，特别是转化率的影响是巨大的。 根据这项研究，转化访问者的页面包含的图像比没有转化的页面少 38%：

幸运的是，优化图像很容易。 用 JPEG 图像文件替换 PNG 可以轻松节省页面大小和加载时间。 Google 的 Guetzli 和 Zopfli 等图像压缩器也可以。

但在使用这些之前，问问自己是否真的需要页面中包含的所有图像。 它们是否真的在增加价值，或者你可以没有它们吗？ 如果答案是后者，则完全废弃它们以节省数据和时间。

通过 Google PageSpeed Insights 查看您的立场

您的 Google PageSpeed Insights 得分是多少？ 你达到推荐的85+了吗？

要达到该阈值，我们建议您查阅我们的指南以优化点击后登陆页面体验：

然后，开始提供更好的用户体验并改进点击后登录页面。

立即注册 Instapage Enterprise 演示。