至少可以说,这是一次令人沮丧的经历:我们开始在线阅读内容时,突然,页面跳过了数百或数千个像素,使我们完全迷失了方向,或者我们尝试点击一个按钮,然后在其位置上出现了一个按钮。弹出窗口似乎是我们不由自主地按下的,将我们带到了一个我们不想要的页面,我们拼命地试图返回。这是两个(可怕的)布局变化的例子,网页布局变化可能会给用户体验带来困难:Google 在核心 Web Vitals指标中包含累积布局变化或 CLS 并非巧合,现在有衡量指南并优化该指标以改善我们页面的使用。 内容索引 什么是 CLS,累积布局偏移 累积布局偏移或 CLS 是 Google 指标,通过分析用户体验事件(即页面仍在加载时网页元素的意外移动)来衡量视觉稳定性。 CLS 可翻译为意大利语,意思是布局的累积变化,是 Google 的三个原始核心 Web Vitals之一,因此,为了拥有高性能网站并保证积极的用户体验,它是一个不可忽视的元素,尊重搜索引擎的指示和愿望,因为它也是页面体验中评估的排名信号的一部分。
与其他两个基本网络信号(LCP-最大内容绘制和FID-优先输入延迟)不同,它的参考衡量单位不是时间,而是空间,并且 Google 创建了一个特定的分数来识别页面时布局的变化程度。正在加载,这可能会影响用户体验。 布局变化的问题 当页面内容在没有用户自愿输入或事 WhatsApp 号码数据 先通知的情况下发生变化时,就会发生 CLS:往往会导致更改的页面元素包括字体、图像、视频、联系表单、按钮和其他类型的内容。 在最常见的情况下,访问页面的用户准备点击某个元素,但与此同时,加载改变了其位置并导致用户“犯错误”并点击其他内容,通常甚至是广告或弹出窗口。 累积布局变化或 CLS:该指标的含义 Google 开发者倡导者Patrick Kettner更深入地解释了这个主题,他在YouTube上管理了一系列致力于优化 Core Web Vitals 的技术。 谷歌的帕特里克·凯特纳 关于 CLS,Kettner 表示,这个指标可以帮助我们了解页面的稳定性,或者更准确地说,页面的使用情况的可预测性。