(LCP) (FID) (CLS)是什么：掌握SEO关键Google网页核心性能指标

阅读模式 · 学习于 2024-5-13 12:04:41

作为探究网站性能系列文章的延续，我们将在本篇文章中探讨Google网页核心性能指标，我们也将在文中介绍Web开发人员应该了解的另外11项指标。

了解什么是Google网页核心性能指标
在评估网站的性能和识别问题时，开发人员需要在他们的工具包中使用多个指标。仅靠一个指标并不总能奏效。例如，由于网络问题或低效的初始化过程，屏幕上的表单可能加载缓慢。查明真正的罪魁祸首需要对至少两个性能指标进行研究。

使用的最佳指标取决于网站的具体性质；重型单页应用程序需要与仅显示静态文档的轻型站点采用不同的方法。

为了帮助开发者选择正确的指标，Google提出了三大网页核心性能指标：

最大内容绘制 (LCP)
首次输入延迟 (FID)
累积布局偏移 (CLS)
这三个指标对整个前端进行监控，但网络除外。为了获得最佳的用户体验，网站应该做到：

快速加载 (LCP)
互动化；用户点击应提示可见结果 (FID)
布局不会改变，不会分散用户阅读文本的注意力 (CLS)
网页核心性能指标为Web性能领域的新手提供了一个极好的起点。跟踪每个指标可以让您很好地了解用户如何看待您的网站。

在本篇文章中，我们将详细了解三个网页核心性能指标，以及与下一次绘制的交互 (INP)，它可能会在未来取代 FID。最后，我们将检查首次内容绘制(FCP)，虽然它不是网页核心性能指标之一，但与 LCP 密切相关。

将网页核心性能指标与搜索排名关联在一起
2020 年 11 月，Google宣布从 2021 年 5 月开始，网站在三个网页核心性能指标(CWV) 指标上的得分将纳入其Google搜索排名。这意味着在这些指标上得分较低的网站在 Google 搜索页面上的排名较低。

尽管量化 CWV 分数的好坏对网站搜索排名的影响是很有说服力的，但这在实践中是不可行的。 Google没有提供有关其排名算法的确切细节，因为它们是Google的核心知识产权，而且 CWV 的相对权重和影响可能会随着时间的推移而发生变化。

尽管如此，人们还是做了一些研究。

· 低 LCP 与高搜索排名之间的相关性
2022 年 5 月，Advanced Web Ranking 从前 20 个Googe搜索结果中的 300 万个网页中发现低 LCP 和高搜索排名之间存在轻微关联。

这种相关性并不大，因为没有一个页面的 LCP 小于 2.5 秒，这意味着他们的用户在网站完全可见和可用之前等待 2.5 秒，而 2.5 秒是 Google 认为 LCP 得分高的最大值。搜索排名与 FID 和 CLS 之间的关系不太明晰，因此研究人员谨慎地决定无法证明相关性。

2022 年 6 月，SEO 专家 Norbert Hires 在报告中提到：“网页核心性能指标的网站上有很大的改进，网站的规模和流量都相当大，但到目前为止，我从未证明优化页面体验与增加有机点击之间有任何关联。”

然而，Google通常会慢慢推出这些更改，以便让每个人都有充足的时间来调整他们的 SEO 策略。 CWV 指标很可能在搜索排名中仍然扮演次要角色，但它们的权重会随着时间的推移而增加。因此，可以安全地假设 CWV 将成为一个重要的 SEO 指标。众所周知，CWV 指标对于实现出色的用户体验非常重要，因此改进它们没有任何不利之处。

· 对FID、LCP 和 CLS 进行改进
erficient 测量了六个行业前 20 名排名的 CWV，发现从 2021 年 6 月到 2021 年 9 月，FID、LCP 和 CLS 都有很大改善。除了对搜索排名有任何影响外，网站速度的提高也很重要，因为它们可以让客户更快乐并愿意在您的商品和服务上花费更多。

针对内容绘制的解释
我们将讨论的前两个指标是最大内容绘制 (LCP)，这是一个 CWV 指标，以及首次内容绘制 (FCP)，它不是 CWV。由于两者密切相关，因此将它们放在一起讨论是有道理的。但是，首先，什么是内容绘制？

绘制过程是浏览器呈现要在屏幕上显示的页面时执行的最后一步。（本系列的后续文章将更详细地描述这个过程。）

FCP 和 LCP 指标衡量整体渲染过程速度。当浏览器接收到 HTML 的第一个字节时，两个时钟都开始计时。 FCP 会考虑网站的任何部分出现在屏幕上的时间。该网站不需要完全加载和可见，但应该显示一些图像、文本或链接，让用户有一种进度感。

相反，LCP 衡量网站填满整个浏览器窗口并显示可以使用所需的时间。

当用户单击链接时，他们希望在屏幕上看到一些东西。他们等待的时间越长，他们就会变得越不耐烦，他们就越有可能放弃一个网站。

· LCP 为何比 FCP 更重要？
LCP 比 FCP 更重要，因为它测量整个站点变得可见所需的时间。因此，只有 LCP 被视为 CWV 指标。但是，好的 FCP 仍然很重要。

本系列文章的第一部分中我们用餐厅的比喻解释了这一重要性，服务人员可以给顾客留下优质服务的印象，而实际上，他们正在拖延时间给厨房工作人员必要的食物准备时间。

FCP 的操作非常相似。在 FCP 阶段，用户会在屏幕上看到重置他们不耐烦计时器的内容。因此，即使 LCP 阶段最多需要 3 秒，战略性的 FCP 阶段在 1.5 秒左右也可以使这个等待时间看起来比实际更短，从而减少站点放弃。

FCP是什么？
含义定义别名用途
首次内容绘制从第一个字节到完整呈现内容的第一个位的时间首次绘制首次有意义绘制重置用户的不耐烦计时器
FCP 是一种衡量从导航开始到第一个位内容在屏幕上可见（理想情况下可用）的时间的指标。这种立即下载的内容会因网站而异。这可以是标题、导航栏、搜索表单或源代码顺序中最先出现的任何其他内容。

新加载的内容也应该是功能性的，具有工作的 HTML（尽管这不是 FCP 标准明确要求的）。例如，链接应该是可点击的，应该可以通过 ACTION 属性和提交按钮使用表单。

LCP是什么？
含义定义别名用途
最大内容绘制第一个字节与视口最大可见图像或文本块的渲染时间之间的时间视觉准备时间可视化完成前端时间 CWV 符合性和衡量站点可用性速度
LCP 是一种 CWV 指标，用于测量从导航开始到最大内容块加载的时间。最大的内容块可以是最大的图像、仅包含海报图像的视频、具有 url() 背景的元素或文本段落等块级元素。此块必须出现在浏览器窗口中以供使用。

Google将 2.5 秒以内的任何时间视为高 LCP 分数，将 2.5 到 4 秒之间的任何时间视为“需要改进”的分数。超过 4 秒的分数被认为是不佳的并且应该改进的。

一旦大型内容块完全呈现，LCP 测量过程就会开始。如果有多个候选者，则选择最大的一个。浏览器将持续检查合适的候选者，即使一个区块已经可见。

此时，页面不一定可以使用。它只是看起来准备好了，这会重置用户的不耐烦计时器。当然，一些用户会期望能够做一些对他们有用的事情，所以站点的所有脚本都应该准备好使用。或者与 FCP 一样，所有 HTML 回退都应该到位。

FID是什么？
含义定义别名用途
首次输入延迟第一次尝试的互动反应如何 N/A CWV —— 衡量用户与网站交互的速度
FID 是一种 CWV 指标，用于测量从用户第一次尝试交互到页面对该交互做出反应（例如，通过添加新内容或显示“正在加载”微调器）的时间。

用户可能会在页面出现的那一刻起就尝试与该页面进行交互；换句话说，一旦 FCP 或 LCP 阶段发生。如果他们的第一次尝试没有反应，用户会很快变得不耐烦。他们可能会认为页面没有响应并决定离开。

Google 将任何不超过 100 毫秒的时间都视为良好的 LCP 分数，将 100 到 300 毫秒之间的任何时间视为“需要改进”的分数。任何超过 300 毫秒的时间都被认为是不佳的，并且应该加以改进。

FID不统计用户反应的执行时间，只统计反应开始的时间。例如，如果事件处理程序在单击后 0.1 秒触发并需要 2 秒执行，则 FID 为 0.1 秒。同样，如果在触发事件处理程序之前需要 2 秒，但该事件在 0.1 秒内执行，则 FID 为 2 秒。

这可能看起来很奇怪，因为在这两种情况下用户总共等待了 2.1 秒。这就是为什么 FID 被认为是一个不完美的指标并且可能被 Interaction to Next Paint 所取代的原因之一，我们将在本文后面讨论。

· FID 是一个真正的由用户驱动的指标
FID 是一种由用户驱动的指标，只能在现场进行测量。可以创建合成用户交互，但每次测试运行时这些交互都是相同的，并且不会泄露真实用户遇到的问题的任何数据。

接下来要了解的其他性能指标
我们将在下一篇文章将更详细地讨论真实用户指标和合成指标之间的区别。在那之前，您可以参考 NitroPack 撰写的这篇优秀文章，并开始改进您的 FID。

CLS是什么？
含义定义别名用途
累积布局偏移最终加载和安排后的布局偏移量 N/A 在 LCP 之后测量页面变化
简而言之， CLS 是一种 CWV，用于衡量有多少内容因其他内容变化而发生变化。然而，它的严格定义更加复杂，并且考虑了添加或删除的内容块的大小以及偏移使用的浏览器窗口的百分比。

内容所使用的视口越多，由此产生的布局偏移就越令人懊恼，因此 CLS 得分越高。 Google认为 CLS 分数高达 0.1 是好的，而从 0.1 到 0.25 的任何东西都“需要改进”，任何高于 0.25 的东西都是表现不佳的。

例如，假设一个页面加载文本很快但加载图像很慢。结果，当最上面的主图最终出现时，用户可能已经在阅读第三或第四段。为了适应这种迟到的情况，所有其他页面内容都会被丢弃，包括用户正在阅读的文本。这会使用户感到困惑并且对内容产生孤立感，他们可能会因为糟糕的用户体验而离开网站。

· 测量CLS的各种方式
CLS 在页面可见时不断测量，表示所有布局偏移的累积总和。根据指标的标准，一个大的布局转变可能不如许多小的布局转变那么糟糕。

CLS 仅自动测量布局偏移。也就是说，它是无需用户输入的。如果用户单击了预期会添加或删除内容的链接，并且这种转变正确发生，则 CLS 指标不会受到负面影响。更准确地说，在用户操作后 500 毫秒内发生的任何布局变化都不会改变最终的 CLS 分数。

· 提升您的CLS分值
提高 CLS 分数主要是调整 HTML 和 CSS 代码的问题，而不是资产大小、加载顺序或 JavaScript。这里的技巧是在 HTML 本身中手动设置资产（例如图像或视频）的宽度和高度。例如：

<img src="/template/comiis_mi/img/comiis_mini_logo.png" class=-"heroImage" width="750" height="500”>
width 和 height 属性告诉您的浏览器为图像保留多少空间，因此图像可以稍后加载而不会突然发生布局变化的风险。

图片的确切尺寸可能事先是未知的，例如当一个站点有许多不同高度或宽度的主图时。在这些情况下，请在 CSS 中设置最小的可用宽度和高度。例如：

img.heroImage {
min-width: 750px;
min-height: 500px;
}
和以前一样，浏览器为主图保留了这个空间，所以当加载的图像稍微大一点时，产生的布局变化相当小。

· 提升 CLS 的技巧
Barry Pollard和Nic Jansma 提供了很多能够更好的提升与控制 CLS的技巧。

INP是什么？
含义定义别名用途
与下一次绘制的交互从用户交互到第一个视觉结果的时间 N/A 快速吸引用户
INP 是Google目前正在测试的作为 FID 的潜在 CWV 替代品的一项实验指标。

FID 测量从用户交互到事件处理程序开始运行的时间，而 INP 测量从交互到第一个视觉结果的时间。最终得分是页面生命周期中记录的最差测量值。对于交互较多的页面，最差的 1% 或 2% 将被忽略；第 98 或第 99 个百分位成为最终的 INP。

· INP 为何会优于FID ？
INP 可能是一种比 FID 更合适的指标，因为它衡量的是对用户重要的东西：点击某个地方并获得视觉反馈的能力，例如加载微调器。

INP 仍在开发中，并随着时间的推移可以根据Google的真实结果进行微调。所以说INP 或类似的指标似乎有可能在未来取代 FID 作为网页核心性能指标（ CWV）指标。

总结
在本文中，我们探讨了 Google 的网页核心性能指标（ CWV），这是一种出色的默认性能指标，能够衡量网站的明显加载时间、响应能力和布局变化情况。

我们还讨论了网站的总体 CWV 得分如何影响其 Google 搜索排名。 Yoast很好地概述了如何在实际项目中使用 CWV 指标来获得更好的排名结果。

在某些情况下，以这些指标为目标可能正是您改进网站所需要的。但在其他情况下，您也需要关注其他一些性能指标。

请继续关注本系列文章的第三部分：更多 Web 性能指标

我们本系列的下一篇文章将探讨另外 11 个性能指标以及您如何从中受益。

拐棍摄像机 · 学习于 2024-5-13 12:04:42

山西省太原市网站优化公司费用

微信网页版 · 学习于 2024-5-15 05:10:48

常州网站优化公司

潜江劫持 · 学习于 2024-5-16 08:53:16

无棣网站排名优化公司

臭脚米线 · 学习于 2024-5-16 17:41:43

晋中做网站优化哪个公司好www.wscar.cn

亚马逊 · 学习于 2024-5-17 15:37:14

合肥网站优化快排公司

双色球 · 学习于 2024-5-17 16:03:10

名山网站seo优化公司

且行且珍惜 · 学习于 2024-5-17 22:27:30

优化公司提升网站转化率有诀窍

中国好舞蹈 · 学习于 2024-5-17 23:35:23

昆明网站排名优化公司技术哪家强

电影天堂 · 学习于 2024-5-18 08:50:48

创意网站优化公司

(LCP) (FID) (CLS)是什么：掌握SEO关键Google网页核心性能指标

精彩评论20

网站优化案例

关键词排名

精彩图文

网站优化的注意事项（从SEO到用户体验

客服中心

重庆百度优化公司提供网站SEO优化、降权分析恢复等服务,分享网站SEO优化技术细节思维,解答SEO问题,让新手从零基础开始学习网站的优化

重庆SEO优化公司致力于SEO优化外包、网站建设、网站优化公司、整站优化、网站运营、危机公关、SEO外包、网站推广等;SEO服务电话:400 050 4004

(LCP) (FID) (CLS)是什么：掌握SEO关键Google网页核心性能指标

精彩评论20

网站优化案例

关键词排名

精彩图文

网站优化的注意事项（从SEO到用户体验

客服中心

重庆百度优化公司 提供网站SEO优化、降权分析恢复等服务,分享网站SEO优化技术细节思维,解答SEO问题,让新手从零基础开始学习网站的优化

重庆SEO优化公司致力于SEO优化外包、网站建设、网站优化公司、整站优化、网站运营、危机公关、SEO外包、网站推广等;SEO服务电话:400 050 4004

重庆百度优化公司提供网站SEO优化、降权分析恢复等服务,分享网站SEO优化技术细节思维,解答SEO问题,让新手从零基础开始学习网站的优化