CLS提分小技巧大放送

CLS提分小技巧大放送

CLS对网页体验有什么影响？累计布局偏移Cumulative Layout Shift(CLS)是Core Web Vitals用来衡量网站视觉稳定性的三个指标之一。

简而言之,如果页面的主要内容加载到页面上,然后由其他内容(比如图片)驱动,那么布局就会发生变化。

很多时候,当访客点击按钮或链接(如“阅读更多内容”按钮)时,版式发生改变,可能链接转移,访问者最后点击了其他内容或广告。

这无疑会破坏用户体验。

谷歌认可的最佳CLS标准<0.1？Google把影响评分描述为受手机内容影响的部分。

若将一半(50%)屏幕内容移至一半(25%),则屏幕受到75%的影响。

它表示效果分数是0.75,而且距离分数是0.25,因为内容移动了视口的25%。

最后的结果是0.75*0.25=0.1875。

按照谷歌官方的说法,超过0.1的CLS分数将影响用户体验,应该降低。

也就是说,当CLS指标小于0.1时,有助于确保页面具有用户体验。

CLS提分小技巧大放送：1、创建硬编码的单一尺寸广告发布者可以在页面顶部创建单一大小的广告位置,只适用于硬编码的广告。

使用这种占位符可以确保布局没有改变,但是以每个广告位置都只有一个大小为代价。

2、推迟发布加载广告一个发布者应该考虑一个最佳做法,那就是延迟加载广告,在实际需要之前不要载入广告。

举例来说,如果一个页面有三个视窗,那么第三个视窗上的广告将不会被载入,直到访客到达第二个视窗。

但是这个缺点是没有考虑到用户的行为,如果滚动速度比较快,超过占位符,则广告载入太迟,延迟加载的广告仍然会导致布局偏差。

另外,要注意延迟加载会破坏可视性。

3、利用实时数据优化用户体验利用实时数据为每一个访客优化个性化广告体验。

有了数以百计的匿名数据点,发布者可以个性化应该放置什么样的广告,以及在页面上的时间和地点。

这样做不仅可以提高CLS得分而不会影响用户体验,而且还能改善站点延迟。