您的网站的累积布局偏移分数是否遇到了问题?或者您不确定 Cumulative Layout Shif 到底是什么意思?
累积布局偏移(CLS)是 Google 核心网络生命力计划的一部分。
简单来说,它衡量的是网页上“意外”移动的内容量。较高的 CLS 分数可能表明用户体验较差,也可能影响您网站的 SEO。
在本文中您将了解有关累积布
局偏移的所有知识以及它如 WhatsApp 筛查 何影响 WordPress 网站(以及整个网络)。
什么是累积布局偏移 (CLS)?
CLS 在意大利语中可以翻译为“累积布局偏移”,它衡量的是用户访问期间网站页面意外移动的程度,以布局不稳定性 API(一种用于性能测试的标准化 API)来衡量。
累积布局偏移 (CLS) 是 Google 核心网络生命力计划中的三个指标之一,另外两个是最大内容绘制 (LCP) 和首次输入延迟 (FID)。
要理解累积布局偏移的含义,有必要先讨论一下布局偏移的总体情况。
当您网站上的内容意外“移动”时,就会发生布局变化。
或者,从技术角度来说,就是视口中任何
可见元素在两帧之间改变其初始位置
一个常见的例子是,当你 语音聊天机器人示例 各行各业如何利用人工智能进行语音交互 正在阅读一段文本时……但突然出现了一个广告,加载延迟,并将文本内容推到了页面的下方。
以下是另一个展示此现象的 Google 图片示例:
从移动设备查看网站时出现的累积布局偏移现象。有两部手机并排放置:在第一个屏幕上,您可以看到 Lorem Ipsum 文本分为两部分,一部分为白色背景,一部分为绿色背景。在第二个屏幕上,您会看到相同的文本,但现在在灰色背景部分和绿色背景部分之间也出现了一个带有“Click Me”字样的橙色按钮;紫色箭头表示文本的第二部分正在向下移动。
谷歌累积布局偏移的一个例子。
您在浏览网页时几乎肯定会遇到布局变化,即使您不知道它们的名称。
一次访问可能会有多个单独的布局改变事件。因此,累积布局偏移指标旨在通过测量页面上意外布局偏移的总量来捕捉全貌*。
*经过 Google 的一些修改,精确的测量变得更加技术化,但基本思想仍然是一样的。如果您有兴趣了解更精确的细节,可以阅读此处。
为什么累积布局偏移不好?
累积布局偏移不好的主要原因是它会给您的网站带来糟糕的用户体验。
最好的情况是,它只会让访问您网站的人感到有点烦扰。最糟糕的是,它会导致人们做他们不想做的事情。
例如,假设用户想要点击“取消”,但却意外点击了“确认”,因为布局转换在用户 利用优质电话线索促进您的业务发展 点击时移动了按钮的位置。
除了影响人类访问者的体验之外,不良的累积布局偏移分数还会影响您网站的搜索引擎排名。
从 Google 的网页体验更新(于 2021 年 8 月结束)开始,Google 就将核心网络生命力作为其 SEO 排名因素之一。由于累积布局偏移是核心网络生命力的一部分,这意味着它会影响您网站的搜索性能。
实际上,修复网站上的任何累积布局偏移问题将有助于改善网站对访问者和搜索引擎的体验。
那么,累积布局偏移的原因可能是什么?让我们更深入地探讨这个话题。
什么原因导致累积布局偏移?
以下是累积布局偏移最常见原因的简要总结:
无法设置图像、iframe、视频或其他嵌入内容的尺寸。
加载自定义字体时出现问题,这可能会导致文本在加载自定义字体时不可见或改变大小。
提供不同尺寸的自适应广告(例如 AdSense)(并且不为此类广告预留空间)。
使用插件动态注入内容(cookie 同意通知、潜在客户生成表格等)
使用没有 CSS Transform 属性的动画。
我们将在本文后面深入探讨这些问题,向您展示如何解决每个常见问题。
如何测量累积布局