Google 的 Core Web Vitals 以及您需要做些什么来避免流量丢失

去年网站流量突然下降？ Google 的 Core Web Vitals 更新可能是罪魁祸首。

在 2021 年夏季搜索引擎更新之后，许多网站的搜索流量急剧下降。 这是他们从未见过的流量，让手心出汗的营销经理们四处寻找想法。

听起来有点熟？ 如果这描述了您的体验，或者您想保护您的网络流量免受未来核心网络生命 (CWV) 更新的影响，请继续阅读。

本文基于我们最受欢迎的网络研讨会之一。 查看视频并下载幻灯片：

Google 的 Core Web Vitals 更新如何改变了 SEO 游戏

说到SEO，有很多事情是你无法控制的。 你无法控制谷歌。 您无法控制访问您网站的用户或访问的页面。

但是，您可以控制网站的架构、工程和速度。

什么是核心网络生命力？

Core Web Vitals (CWV) 是 Google 衡量搜索引擎认为对网站性能、速度和响应能力重要程度的一种方式。 有三个要素：

1. 最大内容绘制 (LCP) - 加载页面需要多长时间？ 通常以秒为单位，或者，如果您的网站异常缓慢，则以数十秒为单位。
2. 首次输入延迟 (FID) - 网站响应用户点击或交互需要多长时间？ 通常以毫秒为单位。
3. Cumulative Layout Shift (CLS) - 网站在加载时会发生多少变化？ 通常以秒为单位。

谷歌以两种方式衡量这些元素。 实验室数据，您可以在其中将网页输入到软件或测试工具中（稍后会详细介绍）。 和字段数据，它基于您网站上的真实用户操作。

Google 不会拥有或使用每个页面的字段数据，但会根据流量确定其衡量的内容。 量越大，就越有可能有实际的现场数据。 而且，谷歌可能会在整个网站上汇总这些数据。 这种聚集会导致很多恶化。 为什么？ 如果您有很多来自连接不良的人的访问者，例如具有 3G 连接的手机或世界上还没有光纤的地方，那么这种流量可能会扭曲数据。 因此，对于 Google 来说，您的网站可能看起来很慢，即使对于其他用户来说这很好，并且实验室数据显示您拥有一个高性能的网站。

为什么 CWV 很重要？

这是一个受到 CWV 更新打击并在三个月内失去一半流量的网站示例。 哎哟。 此数据来自 Google Search Console（稍后会详细介绍）。

谷歌惩罚慢站点，因为用户不喜欢慢站点。 谷歌试图用 CWV 做的是让网络更加以用户为中心，这是一件好事。 当你卖东西时，用户体验很重要。 加载时间每增加一秒，转化率就会下降最多 5 秒，然后下降4.42%。 简而言之，如果您的网站加载时间为 6 秒，而您的竞争对手的网站加载时间为 1 秒，那么他们将看到比您更好的转化率。

在涉及 SEO 游戏时，Core Web Vitals 更新只是优先考虑了这些因素。 如果你想继续玩，你必须接受规则已经改变。 然后，适应。

如何衡量您网站的核心网络生命力

看到问题是解决问题的第一步。 不幸的是，没有一种工具可以解决您测量和优化 CWV 的所有问题。

您正在尝试做的是测试修改您网站上的某些内容是否会对流量产生任何影响，对吗？ 所以你做出改变，等待真实用户数据积累一两个月以上（实验室数据只能预测这么多），然后等待谷歌通知。

你需要从不同的角度来看待问题，才能得到全貌。 这意味着多种工具。 经过多次试验和错误，这是我们推荐的工具包：

1.谷歌搜索控制台

Google Search Console **** 是一个免费工具，如果您想要整个网站的 CWV 的真实数据，您绝对必须使用它。 有多少页面得分高？ 有多少需要改进？ 有多少成绩不好？ 绿色，黄色，红色。 这是您在此级别上获得 Google 自己的报告的唯一地方。

您可以通过单击“重新验证”要求 Google 正式审核您的网站，Google 将在数周内收集或审核现场数据。 他们说最多需要28天。

是的，你没听错。 数据需要一个月才能刷新。 这是一个非常缓慢的反馈循环。

2.点击

Clickio 提供了最接近您可以获得的 Core Web Vitals 上的实时数据。 它要求您在您的网站上放置一个跟踪器，具有讽刺意味的是，这会增加一些页面重量，但只要您根据从中获得的数据采取行动，它就足够有用了。

Clickio 将为您提供随时间变化的反馈。 上个月我们在特定国家/地区提供给移动设备的所有网站页面的累积布局转换是多少？ 本季度，有多少用户从我们桌面设备上的博客页面获得了超过四秒的最大内容绘制？ 您可以通过多种方式对数据进行切片和切块，以获得所需的信息。

健康警告：该工具显示 Clickio 对 Google 数据的解释。 它不会向您展示 Google 看到的内容。 这是我们发现的用于解决潜在 CWV 问题的最佳领先指标，无需等待数月才能获得任何反馈，并且它提供了大量的粒度，例如逐个国家/地区的数据。 但这不是实际的 Google 数据。 而且它是实时数据，您必须留出一些时间来积累足够的有意义的数据，然后才能确定您所做的更改是否有效。 它不是即时的，但您也不必等待整整一个月才能刷新。

3.谷歌分析

谷歌分析将获取一些具有代表性的数据点，并在此基础上告诉你页面性能统计数据，随着时间的推移，你可以看到流量下降或上升的地方。 如果您的访问者不多，那么这些数据可能对您没有多大用处，但它是随着时间的推移跟踪此信息并突出显示需要您注意的慢页面的好方法。

4.谷歌数据工作室

Google Data Studio 会显示您网站中每个 Core Web Vitals 的性能百分比。 从本质上讲，它是随时间变化的历史。 改进，理想情况下。

如果它是实时的，这将是惊人的。 如果您可以滚动查看过去 28 天，工作完成，您就会知道您所做的事情正在产生影响。 不幸的是， Google 会在下个月中旬拖欠本月更新。 这是一个比 Google Search Console 更慢的反馈循环。 因此，它是追溯数据的快照。 用于监控进度，但速度较慢。

5. Web.dev - 灯塔

Web.dev 是 Google 拥有的网站，提供了一个名为 Lighthouse 的开源工具。 该工具为您提供各个页面上的实验室数据。 您输入一个 URL，它会告诉您性能可访问性、最佳实践、SEO 分数等 - 如果您在应用程序上单击“查看树形图”，您可以看到更多数据。

数据存在一定的波动性，因为数据可能会根据您的浏览器、一天中的时间、缓存或其他类型的“互联网天气”而有所变化。 但是，它仍然很不错。

6. Web.dev - PageSpeed Insights

Google PageSpeed Insights 是您获取页面级字段数据的地方。 同样，您输入一个 URL，它将为您提供 LCP、CLS、FID 等的字段数据。 但是，您需要一定量的页面流量才能获得体面的现场数据。

7.GTmetrix

GTmetrix解构一个网页并说明每个文件有多大，正在加载多少东西，它是如何构建的等等。 对于开发人员来说，这是一个很好的 QA 页面工具，可以检查他们是否添加了巨大的图像文件或会减慢加载时间的臃肿小部件。

我们建议将此工具和 web.dev 工具结合使用，以逐页衡量哪些更改有效。

8.调试熊

DebugBear 获取有关 Core Web Vitals 和其他一些指标的页面和报告列表。 它作为健康监控工具而不是诊断工具很有用。 您可以使用它来监控20 个左右的“煤矿中的金丝雀”页面。 因此，如果任何活动增加了您网站的重量，那么您可以在此处查看。

如何优化您的网站以改善 Core Web Vitals

现在，让我们谈谈您可以做哪些活动来改进 Core Web Vitals。 你会从上面的工具中获得很多关于问题所在的信息，所以这些只是我们为自己和客户所做的一些事情，我们知道这些事情会产生影响。

1. 重新托管您的网站

这不是重建或重新设计您的网站。 它只是将它移动到其他地方。 通常，我们看到从 WordPress 迁移到 HubSpot 的网站的性能提高了大约 30% 。

如果您坚持使用 WordPress，则将您的网站转移到像 WP Engine 这样真正了解性能的专门托管公司会产生很大的不同。

通过在 HubSpot（或 WP Engine）上重新托管您的网站，您将受益于：

• 缓存 - 这使网站在第一次访问后加载得更快。 一个通用的 WordPress 网站需要一个缓存插件，但 HubSpot 已经内置了它。
• 内容交付网络 (CDN) 例如 Akamai - 即使您的网站托管在其他地方，它也会从本地服务器向用户交付文件。
• CloudFlare DNS - 基本上，这有助于加快域名服务器端的速度。

2.关闭HubSpot的社交分享代码

如果您已经在 HubSpot 上，那么最快的胜利就是在您的博客上关闭 HubSpot 的社交分享代码。 HubSpot 让这些按钮默认处于打开状态，这很烦人。 这将从您博客的每个页面中删除大约450 KB 的 JavaScript 代码。

在 GTmetrix 和 web.dev 中对页面速度和加载时间进行前后快照。 这真的很令人满意。

3. 压缩图片

当您第一次启动您的网站时，您的开发人员很可能已经避免使用大量图片。 我们希望。 我们希望他们对图像使用延迟加载，就像一般原则一样。

但后来，善意的营销人员会突然将特色图片添加到博客和页面中。 巴姆。 您的网站因 40MB 的图像文件而变慢，该文件可能会为大型喷气式飞机的侧面增光添彩。

将图像压缩到 <250KB，最好是 <100KB。 将图像转换为 jpg，或尽可能使用 svg。 对徽标要格外小心，尤其是页脚中的徽标，因为这些徽标位于您网站的每个页面上。

同样，如果你有 HubSpot，Articulate 制作了一个名为 Fizz+Ginger 的工具来压缩 HubSpot 中博客文章和网站页面上的图像。

4. 避免嵌入

这是我们网站页面的屏幕截图，其中包含嵌入式演示文稿、嵌入式 YouTube 视频、弹出窗口、图像和一些实时社交媒体。 所有这些东西加起来只有六兆字节……东西。 尽可能多地去除这些内容会使页面加载速度更快。 例如，我们用链接的缩略图替换了嵌入式视频。

5. 简化您的营销工具

营销工具增加了页面权重。 诸如监控页面使用情况的 Hot Jar 或 Lucky Orange 之类的东西，或跟踪号召性用语，或 Google 跟踪代码管理器 - 在您的网站上安装这些工具很有用，但它们是有成本的。 成本就是性能。 因此，您必须谨慎而明智地使用它们。

6.打开AMP

Google 有一个标准，称为加速移动页面或 AMP。 使用 AMP，您可以获得闪电般的快速加载时间。 如果用户在 Google 浏览器上点击搜索结果，它将为他们提供来自 Google 服务器的 AMP 版本的页面。

但是，在此过程中，您无法控制谁为该页面提供服务以及它的外观。 他们在样式方面将其剥离到最低限度。 这是一个权衡。

7.优化你的代码

这是网站优化的漫长而艰难的过程。 您不能只是即插即用。 你需要优化你的代码。 为此，您必须拥有一支由专家开发人员组成的优质团队，他们将实施以下内容：

• 最小化 Javascript 和 CSS
• 延迟加载 Javascript
• 默认延迟加载
• 自我放大（例如不在移动设备上显示博客特色图片）
• 开发管道中的良好编码实践
• 最少使用插件和外部代码

用户体验是未来网站的衡量标准

在接下来的几年里，Core Web Vitals 的重要性只会越来越大。 企业现在需要调整他们的网站以适应性能和用户体验，以避免在下一次重大更新中受到惩罚。

当然，我们很乐意提供我们的 SEO 和网站开发服务，以帮助您到达您需要去的地方。 我们已经了解了很多关于 Core Web Vitals 的知识，并将这些知识嵌入到我们的流程中，使我们的网站高度优化和轻量级。

联系我们以获得您的用户希望您拥有的网站。