百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

什么是核心网络生命力?为什么它们如此重要?

zhezhongyun 2025-01-08 18:42 40 浏览

在这个问题上:

  1. 核心网络生命力是什么?
  2. 如何测量 CWV?

101 号

核心网络生命力是什么?

核心网页指标 (CWV)是一系列与网站用户体验相关的指标。它们衡量网页的加载性能、交互性和视觉稳定性。用户体验越好,网页在搜索中的表现就越好。

核心网页指标是 Google 用来决定网站整体用户体验的“网页体验”排名信号的一部分。理论上,良好的核心网页指标将有助于提高搜索排名。

CWV 于 2020 年 5 月推出,包含三个信号——最大内容绘制 (LCP)、首次输入延迟 (FID)和累积布局偏移 (CLS)。2024年 3 月,Google 添加了下一次绘制交互 (INP)并删除了 FID。与首次渲染相比, 这个新指标更好地体现了整个页面的用户体验。

这些指标中的每一个都在 Google Search Console 中提供报告。监控这些指标,看看“较差”或“需要改进”的 URL 分组中是否有峰值。这表明您的网站存在问题。


关于 CWV 你需要了解什么

努力实现真正好的核心网络生命力,但要知道它们永远不会完美

拥有完美的 CWV 几乎是不可能的,尤其是在新闻 SEO 中。我们的网站还面临着互动新闻、广告投放和 CTA 的额外挑战——所有这些都是必要的, 但会减慢页面速度。让所有东西在每次互动中都无缝衔接是非常具有挑战性的。

专注于良好的用户体验,为您的读者提供他们需要的信息,而不是挑剔您的 URL 的细节。

页面体验图表来自 Ahrefs

核心 Web Vitals 指标

最大的内容涂料 (LCP)

最大内容绘制(LCP) 测量相对于页面首次开始加载时间的主内容加载时间。主内容是视口内可见的最大图像或文本块(即屏幕上加载的内容)。超出屏幕的任何内容均不计算在内。

良好的 LCP 分数应为2.5 秒或更短。

以下是LCP 所 考虑的元素:

  • <img> 元素;
  • <image><svg> 元素内的元素;
  • <video> 元素(使用海报图像);
  • 通过url()函数加载背景图像的元素(与CSS 渐变相反);
  • 包含文本节点或其他内联级文本元素子项的块级元素。

如何知道我的网站是否符合 LCP 要求:通过Google Lighthouse运行您的网页或使用SEO Pro Extension查看 LCP 分数。如果您网页上的内容和图片立即加载,然后是其他所有内容(视频、广告、CTA),则您可能处于有利位置。但如果内容没有显示或延迟,则表明您需要改进加载时间。

下一次绘画互动 (INP),原先的首次输入日 (FID)

交互到下一次绘制 (INP)是衡量用户整个旅程中页面整体交互延迟的指标。它评估页面对用户交互(例如点击下拉菜单或按播放视频)的响应速度。INP 取代了首次输入延迟 (FID),后者是之前仅衡量首次用户交互的指标。INP 衡量用户旅程的所有影响。

(对 FID 的支持将于2024 年 9 月 9 日结束。站点应该已经切换到 INP。)

  • 良好的 INP 分数应为200 毫秒或更少
  • INP仅通过以下方式测量:
    • 用鼠标点击;
    • 点击带有触摸屏的设备;
    • 按下物理键盘或屏幕键盘上的某个键。
  • 不测量悬停、缩放和滚动。

如何知道我的网站是否适合 INP:确保在应该有事件的地方有事件!例如,导航中的项目是否可点击?单击下拉菜单时是否需要一些时间来加载?视频是否立即播放?在读者输入时,是否立即在表单中输入内容?

累积布局偏移 (CLS)

您是否曾尝试取消订阅某些内容,然后页面布局突然发生变化,导致您意外地又订阅了一周的盒装餐食?累积布局偏移(CLS) 就是用于测量这一点的指标 — 页面的视觉稳定性及其变化频率。

CLS 关注的是“布局偏移”的最大爆发(即内容从一个渲染位置移动到另一个渲染位置的次数)。字体加载、图像、视频、联系表单、按钮等通常会导致 CLS。

  • 良好的 CLS 分数应为0.1 或更低。
  • 动画和过渡是造成这种情况的罪魁祸首,因此请检查您网站的 CSS、JavaScript 或任何其他特殊组件如何影响此分数。

如何知道我的网站是否适合 CLS:确保页面加载后读者所看到的内容没有变化。

每个指标的基线

通过 Ahrefs 为每个指标设定基准


诀窍

如何衡量核心网络指标

拥有优质的页面体验不仅对 Google 排名至关重要,还有助于确保访问您网站阅读新闻的读者能够轻松访问他们所需的一切并获得良好的体验。这是建立牢固品牌关系的基础 — 促使人们订阅或支持您的出版物。

有许多工具(来自 Google 和第三方)可以报告您在 CWV 指标方面的表现。

Google 工具:

  • Google Search Console有自己的 Core Web Vitals 报告。这是最好的起点。但是,此报告仅显示 28 天的滚动平均值。
  • Google Lighthouse :一种开源自动化工具,可审核页面在服务过程中的性能、可访问性、SEO 等。
  • Page Speed Insights:同样由 Google 运营,可让您了解导致网站速度变慢的原因(未压缩的图像、未使用的 JavaScript 等)。它还会告诉您网站可能存在三种 CWV 中的哪一种问题。
  • Chrome UX (CrUX) 报告:反映现实世界的 Chrome 用户如何体验网络上热门目的地的数据集。

第三方工具:

  • SEO Pro Extension直接在浏览器中提供 CWV 分数。
  • Core SERP Vitals Extension在 Google 上提供 CWV 分数,因此您可以与其他网站进行比较。
  • Search Engine Journal 上 列出了其他用于测量 CWV 的工具。

这些内容都会为您提供大量信息,帮助您了解 CWV 以及应该将重点放在哪里。首先要压缩图像,减少未使用的 CSS,并确保网页上的加载体验达到最佳。并且尽可能少用 JavaScript。


关于 CWV 的警告

核心网络生命力应该是您的新闻编辑室持续努力的一项工作,但不是您的首要任务。

大量“不良” URL 值得关注;但是,多少才算大量取决于您网站的规模或性能不佳的原因。对于小型网站来说,1,000 个“不良” URL 绝对值得关注,但对于大型发布商来说,可能并非如此。

与您的网站团队密切合作,找出并了解 CWV 分数的原因。不要惊慌。您的重点仍然是优质内容、引人入胜的页面和技术完善的网站。


底线:核心网络指标是整个新闻 SEO 组合的重要组成部分。确保您的 CWV 指标处于健康水平,但不要花太多时间试图获得完美分数。整体良好的用户体验是最重要的。

相关推荐

字体缩放(方式一)(字体缩放150%怎么做)

通过元素宽度和字数计算得到缩放简单实现如下:/***字体最大为视觉要求大小(maxFontSize);超出缩小字体显示,最小为minFontSize;最小字体时超出部分使用圆点(...);*p...

网页世界隐藏的神秘代码语言,竟能这样改变布局

CSS基础:选择器与属性CSS(CascadingStyleSheets)是用于控制网页外观的一门样式表语言。它通过定义HTML元素的显示方式来增强网页的表现力。CSS的选择器允许开发者精确地定位...

CSS属性值计算过程详解(css属性用来定义元素计算)

在CSS中,即使某些属性没有显式声明,浏览器也会通过**属性值计算过程**为每个元素的所有属性赋予最终值。这一过程分为四个关键步骤,以下将逐一解析。1.确定声明值浏览器首先检查所有**直接应用**到...

软网推荐:找回调整Windows 10字号功能

之前的系统,从WindowsXP到早期版本的Windows10,均有字体大小调整功能,但从创意者版Windows10以来,取消了之前的设置选项,取而代之的是自定义缩放比例设置。使用这个功能调整过...

Excel中如何设置文本框属性,实例代码讲解

Excel不仅可以对数据进行处理,而且也可以图形化数据,直观显示数据表达的内容。本节介绍一个很重要的对象,Characters,字符对象,使用Characters对象可修改包含在全文本字符串中的任...

CSS 字体样式(css中字体)

本节我们来讲字体样式,之前我们学习HTML的时候学过一些用于字体加粗、倾斜的标签,但是使用标签来实现的效果肯定没有我们通过CSS中的样式来的方便。接下来我们会给大家介绍下面这几个属性的使用:通...

PC网站建设必备代码知识:HTML基础与应用技巧

在PC网站建设的相关课程里,代码扮演着至关重要的角色。只有熟练运用正确的代码,我们才能打造出功能完善、用户体验出色的PC网站。接下来,我会详细讲解在PC网站建设环节中必须了解的代码知识。HTML基础代...

让你大跌眼镜的疯狂 HTML 和 CSS 技巧

今天,分享一个让你大开眼界的技巧。通过使用这个技巧,你可以将整个网页变成一个CSS编辑器。没错,你从未见过这种方法。当我第一次尝试时,我完全被震惊到了。现在,让我们开始吧!步骤1首先,创建一个基础的...

jQuery EasyUI使用教程:创建一个链接按钮

jQueryEasyUI最新版下载>本教程主要为大家展示如何使用jQueryEasyUI创建一个链接按钮。通常情况下,使用“button/”元素来创建一个按钮;使用“a/”元素来创建链接按钮...

React 19 有哪些新特性?(react100)

如果你对React18还不熟悉,欢迎阅读之前的文章《React18全览[1]》最近React发布了V19RC版本,按照惯例,我们对React19的新特性进行一次深度的体验学习...

Java注解探秘:为什么@PostConstruct能解决你的初始化难题?

你是否在Spring项目中遇到过这样的困扰:明明依赖注入已经完成,但某些配置就是无法正常加载?手动调用初始化方法又容易引发空指针异常?这就是@PostConstruct注解大显身手的时候了!@Post...

AI驱动的表单自动填写(ai置入表格)

我们都同意,填写表格是一项枯燥且耗时的任务。如果我们可以创建一个可以为我们填写表格的AI助手,让我们将时间投入到更有建设性的任务中,那会怎样?AI助手将能够通过调用以表单字段为参数的函数来填写表...

从零到一:小程序设计新手如何快速上手?

开发环境搭建对于小程序设计新手而言,搭建合适的开发环境是首要任务。以小程序为例,其官方提供了功能强大的开发工具——开发者工具。首先,新手需前往官方开发者平台,在页面中找到“工具下载”板块,根据...

JavaSwingGUI从小白到大神-6(续)(java从小白到大牛怎么样)

接上一篇《JavaSwingGUI从小白到大神-6》,因本篇文章3万多字,头条一篇发不完,只能分开发。同事查询面板:CompanyFind.javapublicclassCompanyFind{...

C# winform界面假死(c#程序假死)

针对C#WinForm界面假死问题,以下是分步解决方案:1.使用异步编程(async/await)将耗时操作移至后台线程,保持UI线程响应。步骤:将事件处理函数标记为async。使用Task....