一旦谷歌宣布他们将推出移动速度更新，他们测量页面速度的方法也改变了。这一点在谷歌PageSpeed Insights工具中得到了特别的反映。现在，当您将一个URL粘贴到该工具中时，它将根据两个类别进行分级:页面速度和优化。页面速度评分的数据来自Chrome用户体验(CrUX)数据库的真实用户与网页的交互。这意味着这些数字不仅取决于你的网站的实际速度，还取决于用户的连接速度和他们的设备(可能很慢，过时)。这种从实验室数据到现场数据的转移使得不可能通过本地测试获得页面速度指标并直接影响它们。在谷歌宣布更新后，SEO PowerSuite团队开始了一项跟踪页面速度和排名之间的相关性的实验。关键词:~ 33500个职位在SERPs: 1-30搜索结果:1,000,000页指标:优化得分，中位数FCP，中位数DCL该实验仍在进行中，目前进行了两次测量:在更新发布之前，即2018年4月23日至27日，以及在更新发布之后，即2018年7月14日至16日。最重要的结果，在更新之前发现并在更新之后证明，是:
在移动serp中的位置与平均优化得分之间的相关性非常高- 0.97。
根据这些发现和谷歌最初的声明，更新“只会影响向用户提供最慢体验的页面”，在实验中进行了更多的测量。也就是说，将最慢的页面和最快的页面的进度分别进行比较，以查看这两类页面之间是否存在差异。发现1:在重新检查优化分数如何影响排名后，我们发现82%的优化分数较低的网站在更新后排名下降，只有14%的网站排名上升。
然而，要记住，具有高优化分数的网站在serp中上升的可能性是两倍，这是有用的。虽然不是每个页面，但几乎有30%的页面排名上升了。这实际上证明了谷歌所说的:如果你速度非常慢，你看到排名下降的几率非常高。
发现2:页面的速度评分是快还是慢没有太大的区别。在两组中，略多于60%的页面向下浏览，略少于30%的页面向上浏览。而速度分数对这些变化几乎没有影响。
这可能证明谷歌并不完全依赖其算法中的加载速度指标，对于SEO来说，拥有一个高的优化分数比一个真正高的速度分数更重要。这是一个好消息，因为完全可以通过调整和改进站点的技术因素来影响这个指标。首先，将您的URL插入PageSpeed Insights工具中，以测试页面的性能。谷歌将为您提供一个优化建议列表。下面你会发现这些建议被解释，扩展和添加了实用的技巧。
内容1。避免登陆页面重定向。2. 启用压缩。3.提高服务器响应时间。4. 利用浏览器缓存。5. 减少资源(HTML、CSS和JavaScript)。6. 优化图片。7. 优化CSS交付。8. 优先考虑可见内容。9. 删除render-blocking JavaScript。1. 避免登陆页面重定向。有多个从特定URL到最终登陆页面的重定向。重要原因:
重定向减慢页面呈现，因此否定影响桌面和移动体验。由于每个重定向添加了单个HTTP请求-响应往返(最好的情况)或许多额外的往返(最坏的情况)来执行DNS查找、TCP握手和TLS协商，所以呈现会延迟。
如何优化?1)创建一个响应式网站。
谷歌建议创建一个响应式站点，没有不必要的重定向，以提供良好的多设备体验。2)选择合适的重定向类型。除非绝对必要，否则建议完全避免使用重定向。如果仍然需要重定向，那么选择重定向类型，这是最适合您的需求的:
301或302重定向:当需要删除旧内容并重定向到新内容时，或者当没有可重定向用户的替代页面时，永久重定向(301)是最好的。临时重定向(302)最适合短期更改(如限时促销)或将用户重定向到设备特定的url。无论选择哪种重定向类型，都不会丢失链接能量。JavaScript或HTTP重定向:谷歌支持这两种重定向类型。它们之间的主要区别是，HTTP重定向会导致服务器端出现一些延迟，而JavaScript重定向会降低客户端速度(因为它们需要首先下载页面，然后在触发重定向之前解析和执行JavaScript)。2. 启用压缩。
建议触发:
可压缩资源不进行压缩。
重要原因:
更小的内容大小减少了下载资源的时间，减少了客户端数据的使用，并提高了页面的呈现时间。
如何优化?1)压缩前删除不必要的资源。虽然压缩资源非常重要，但首先，建议优先删除不必要的数据。最佳优化的资源是未发送的资源。在实际压缩之前，一定要检查站点资源，去掉不必要的数据。2) Gzip所有可压缩资源。
谷歌建议gzip所有可压缩内容。通过HTML5样板项目可以找到大多数流行服务器的示例配置文件，其中包含任何配置标志或设置的详细注释。
3)考虑替代编码技术。如果您因为某些特定的原因而不愿意使用gzip工具，那么有一些gzip编码的替代方案。例如，Brotli是一种无损压缩算法，所有现代浏览器都支持它，它具有优越的压缩比，可与gzip相媲美。然而，Brotli压缩非常慢，解压缩很快，所以你应该在最高级别用Brotli+Gzip预压缩静态资产，在1-4级用Brotli压缩动态HTML。4)对不同的资源使用不同的压缩技术。虽然压缩可以应用于HTML代码和页面所需的数字资产，但网页字体、图像、CSS等需要不同的压缩技术来实现更快的页面呈现。例如，如果您使用HTTP/2，那么针对HTTP响应报头的HPACK压缩将消除冗余的报头字段。
3。提高服务器响应时间。
建议触发:
服务器响应时间大于200ms。因为53%的手机用户会在不到3秒的时间内离开一个页面，所以更快的响应时间成为了一种必要条件。
如何优化?有很多因素可能会降低服务器的响应时间，比如应用程序逻辑慢、数据库查询慢、路由慢、框架慢、库慢、CPU/内存不足等。为了提高服务器响应，必须考虑所有这些因素。另外，考虑从共享主机切换到托管主机，因为整个服务器的加载能力将只专门用于您的站点。1)通过检查现有的p找出是什么使你的站点变慢了erformance数据。使用像网页测试，Pingdom, GTmetrix或Chrome Dev Tools这样的工具来收集性能数据，并找出是什么减慢了你的内容交付。请记住，即使您的响应时间指示为低于200 ms，在较老设备上或连接较慢的用户可能会体验到更高的响应时间。为了改善这样的用户体验，你必须瞄准第一次有意义的绘制< 1s, SpeedIndex值< 1.25s，交互时间<5s，重复访问<2s。2)以面向用户的方式配置服务器。使用HTTP/2(请记住您的cdn也支持HTTP/2)来提高性能。在服务器上启用OCSP订书机以加快TLS握手。支持IPv6和IPv4。IPv6的邻居发现(NDP)和路由优化可以使网站的速度提高10-15%。添加资源提示来预热连接，并通过更快的dns查找、预连接、预取和预加载加速交付。4. 利用浏览器缓存。
建议触发:
来自服务器的响应不包括缓存头或指定资源只在短时间内缓存。重要原因:
站点上缓存策略的缺失会在资源获取过程中触发客户端和服务器之间大量的往返。因此，它会导致延迟、页面呈现阻塞和访问者更高的数据成本。在实现缓存策略时，它帮助客户机确定是否以及何时可以重用过去获取的响应。
如何优化?1)确保每个资源都明确指定了一个缓存策略，回答:资源是否可以被缓存;谁能把它藏起来;缓存需要多长时间;如何在缓存策略过期时有效地重新验证它(如果适用)。
根据谷歌的建议，对于静态资产，最小缓存时间应该是一周，最多是一年。2)使用Cache-Control减少数据费用，消除网络延迟。
缓存控制指令允许你自动控制在什么条件下(例如，”no-cache”和”no-store”)和多长时间(例如，”max-age”， “max stale”和”mini-fresh”)浏览器可以缓存响应，而不需要与服务器通信。3)使用ETags来确保有效的再验证。服务器使用ETag HTTP头通信一个验证令牌，以确保如果资源自上次请求以来没有更改，则不会传输任何数据。它使资源更新检查的过程更加有效。4)检查谷歌的最佳Cache-Control策略的建议。
适用的一般规则是:可能发生变化的资源应该被缓存短时间，而静态资源应该被缓存不确定的时间，以避免重新验证。
5。减少资源(HTML、CSS和JavaScript)。
建议触发:
可以通过缩小一个资源的大小。
重要原因:
Minification有助于从交付给访问者的资源中去除冗余数据，而不会影响浏览器处理资源的方式。它可以对您的加载速度和站点性能产生切实的影响。
如何优化?1)从你的网页资产中删除所有冗余的数据。使用更短的变量和函数名，删除HTML中的代码注释或空格符号，CSS中的重复样式，不必要的图像元数据等。
2)使用缩小和压缩。
的缩小听起来像是压缩，但实际上，它的粒度要细得多。压缩算法可以很好地减少页面的总体大小，但是，大多数算法都不能消除来自(/*…*/)，HTML ()和JavaScript(//…)注释，分解CSS规则，或执行数十个其他特定于内容的优化活动。3)最小化其他资源。
除了缩小HTML、CSS和JavaScript等基于文本的资产之外，还可以根据需要缩小图像、视频和其他类型的内容。例如，在将图像发布到照片共享网站时，您可能希望保留图像中的某些形式的元数据，但所有其他类似的数据可能都是无用的，所以不要犹豫删除它们。
4)自动缩小。
有很多工具可以通过最小化站点上数以千计的不同资源来简化整个过程。例如，PageSpeed Module可以自动完成这一点，它可以与Apache或Nginx web服务器集成。此外，也可以使用第三方工具来满足这些需求，比如HTMLMinifier(用于HTML)、CSSNano或CSSO(用于CSS)和UglifyJS(用于JavaScript)。
6。优化图片。页面上的图像可以在不显著影响其视觉质量的情况下通过减小其大小进行优化。重要原因:
图像平均占页面大小的60%，而重的图像会显著降低网站的渲染速度。图像的优化有助于在不影响视觉质量的情况下减少整体文件大小，这意味着对客户端带宽的竞争更少，内容的下载和呈现速度更快。
如何优化?1)提供响应图像。
图像需要响应，以适应不同的视口大小和使用场景，以快速和同步加载，并看起来很棒。要实现这一点，可以使用图像的相对大小，当需要根据设备特征指定不同的图像时使用picture元素，并使用srcset和img元素中的x描述符通知浏览器何时使用特定的图像。2)找到图像优化的最佳设置。
由于图像通常占据页面中最沉重的部分，因此就高效性能而言，它们是最难优化的。原因是:对于如何最好地压缩图像没有明确的答案。有许多技术可以帮助减少图像，但是，最佳设置需要全面考虑格式功能、编码数据的内容、质量、像素尺寸等。
图像优化检查表:消除不必要的图像资源利用CSS3替换图像使用web字体而不是在图像中编码文本尽可能使用矢量格式缩小和压缩SVG资产以减少其大小选择最佳光栅格式(从选择正确的通用格式开始:GIF, PNG或JPEG，但也考虑为现代客户端添加WebP和JPEG XR资产)试验最佳质量设置调整服务器上的大小和服务图像缩放到它们的显示大小删除元数据增强img标签的srcset参数为高DPI设备使用图片元素指定不同的图像取决于设备特征，如设备大小，设备分辨率，方向，和更多使用图像spriting技术小心(与HTTP/2，考虑惰性加载非关键图像缓存你的图像资产自动化你的图像优化过程
更多的建议和提示，参考谷歌的图像优化指南。
7。优化CSS交付。一个页面包含渲染阻塞外部样式表，它会延迟第一次渲染的时间。一个页面需要在呈现之前处理CSS。当CSS被呈现阻塞的外部样式表填充时，这个过程通常需要多次往返，这推迟了第一次呈现的时间。
如何优化?1)内联根据上面的步骤，明智地设定你的目标，然后继续努力提高你的优化分数。
作者:Valerie Niechai