Core Web Vitals - 它们是什么以及如何改进它们？

谷歌在 2020 年推出了一项名为 Web Vitals 的新计划。 这是指提供质量信号指导的技术。 据谷歌称，这些指标对于在网络上提供出色的用户体验至关重要。 2021 年 5 月，谷歌开始使用 Core Web Vitals 作为其平台上搜索排名的指标。

什么是核心网络生命力？

Core Web Vitals 是衡量网站用户体验的指标。 他们衡量用户与网站交互的速度以及他们根据搜索获得的结果。 Core Web Vitals 用作评估网站访问者浏览网站的难易程度和无缝程度的信号。

当您改进您的网站和用户体验时，您的页面体验将使用 Core Web Vitals 的指标得分更高。 Google 确定了网站所有者必须了解和纳入的三个核心 Web Vitals 指标。 这些列举如下：

加载：也称为最大内容绘制 (LCP)，加载测量最大元素在站点上加载和显示的速度。 这些元素包括动画、视频、文本、图像等。

交互性：Google 将此称为累积布局转换 (CLS)，它确保网站上的页面没有任何意外功能或令人困惑的动作，可能会在使用您网站的内容时分散或打扰用户。

视觉稳定性：这在技术上称为首次输入延迟 (FID)，它反映了网站访问者首次与其交互时网站页面的响应水平。 FID 还测量浏览器为您网站上的用户生成结果的速度。

如何改善您网站上的核心网络生命力

首先要做的是运行快速的网站性能分析，以了解您的网站在核心网络生命力指标方面的表现如何。 您可以使用不同的工具进行此分析，包括 Google Search Console 和 Page Speed Insights 等。 运行分析后，您可能会发现需要实施以下一些技巧来帮助您改进网站。

• 减少 JavaScript 执行

较差的 FID 评级意味着您的网站页面与访问者的交互时间超过 300 毫秒，当您减少和优化 JavaScript 执行时，它会缩短浏览器执行 JavaScript 代码之间的时间间隔。 这样做的结果是缩短了执行时间。 Google 建议推迟未使用的 JavaScript 以减少执行。 要了解您的网站是否有任何未使用的 JS，请按照以下步骤操作：

• 转到您的站点并右键单击任意一侧，然后选择“检查”

• 单击“来源”选项卡并检查底部的三个点。 添加“覆盖”工具并单击加载功能。 等待加载完成，您可以在页面上看到未使用的 JS 的数量。

有了这些知识，你就可以开始减少 JS 的执行了。 减少执行的一种方法是使用代码拆分。 这是如何运作的？ 将 JavaScript 包分解成更小的部分。 捆绑的 JS 是捆绑在一起的组合文件，以防止加载网页所需的过多 HTTP 请求。

压缩和优化图像

对于许多网站来说，图像是其页面上最大的元素。 为确保您的网站通过加载指标，您应该考虑优化您网站上的图像。 这样，您的网页变得更轻，加载速度将显着提高。

更轻的页面还将改善用户体验、LCP 分数和搜索引擎结果的排名。 要减小页面大小，请使用 Tiny JPG 等工具压缩图像。 减小页面的整体大小不会影响分辨率和质量，但会改善站点的 LCP 结果。

我们建议您对图形使用 PNG 格式，对风景图像使用 JPG 格式。 除了压缩图片，您还可以为您网站的图片激活 CDN（内容分发网络）。

内容交付网络是世界各地的一组服务器，用于存储来自网络的内容。 这些服务器分布在不同的位置； 图像可以从离用户最近的服务器以更快的方式传送。

实现延迟加载

在您的网站上显示图像时，实施延迟加载非常重要。 当您使用此技术时，您网站上的核心 Web Vitals 得分和用户体验不会受到负面影响。 那么，什么是延迟加载？ 延迟加载使您的网站能够在用户向下滚动页面的同时加载图像。 这可确保您网站的加载速度不会受到影响，并且您可以获得最高的 LCP 分数水平。 延迟加载有很多好处。 他们包括：

• 提高网站性能

• 带宽使用限制

• 改进了网站的 SEO

• 留住网站的访问者并最大限度地降低跳出率

如果您运营的网站包含许多视频、动画、图像和其他重元素，那么使用延迟加载非常重要。 实施此技巧后，您可以将之前的 LCP 分数与实施延迟加载后获得的新分数进行比较。

为嵌入和图像使用适当的尺寸

大于 0.1 的 CLS 分数被认为是差。 造成如此低分的主要原因是重元素，例如嵌入、广告和没有维度的图像。 要提高您网站的 CLS 分数，请注意维度。 当您为图像和嵌入使用准确的宽度和高度时，浏览器在加载过程中更容易在页面中分配正确的空间量。 在将 YouTube 视频插入您的网站时，请确保为图像和嵌入设置正确的尺寸。 以下是如何调整 YouTube 视频的大小以显示在您的网站上。

• 前往 YouTube 并打开您想要嵌入您网站的视频。

• 寻找共享按钮并选择<> 嵌入选项。

• 您将看到有关视频的所有详细信息，包括尺寸。 复制代码并将其粘贴到您网站的后端。 这会将其更改为正确的宽度和高度，以正确适合您的站点。

最后的想法

这些是您可以用来改善您网站上的核心网络生命力的重要提示。 在这篇文章中，我们研究了核心网络生命力的基础知识以及您可以用来提高分数的技巧。 提高分数意味着您的排名将在搜索结果中增加，并且您网站上的跳出率将显着提高。