一项案例研究,衡量了 Core Web Vitals 高性能得分对用户体验的全面影响和益处。
RebelMouse 是一款基于云的 CMS,提供数据驱动型工具和发布商所需的创意策略,可为新老受众群体提供尽可能出色的体验。我们为 Upworthy、Narcity、Raw Story、Brit + Co 和 The Independent 等媒体公司以及 Penske Trucks、Vault12、Gaingels 等高价值网站提供高流量网站资源。
仅在美国,我们的平台每月触达的用户就超过 1 亿。该公司成立的初衷是,开放 Web 需要达到消费者的最高预期才能蓬勃发展,而 Google 核心网页指标所设定的标准与这种以用户为先的愿景相符。
十多年来,我们的全球团队一直在打造一个 CMS,致力于打造积极而直观的用户体验,从而带来有意义的业务成效。核心网页指标是一项基准,可确保我们为每种新网站提供支持时,这种共生循环能够持续下去。
为何优先考虑效果有助于提升业务成效
许多发布商都怀疑,是否值得为获得 Core Web Vitals 的出色分数而付出努力。他们还担心,即使提供优质的用户体验,也无法带来他们所需的读者人数增长。幸运的是,RebelMouse 在优先考虑效果方面取得了成效,我们有数据可以证明,Core Web Vitals 是吸引新流量和建立用户忠诚度的绝佳方式,这对企业取得成功至关重要。
为了说明这一点,我们分析了我们托管的多个网站的受众群体行为,并对优化 Core Web Vitals 以获得高性能得分前后进行了对比。具体而言,我们定义了用户类型,以便将受众群体划分为以下主要类别:
- 新访问者:首次访问某个网站的用户。
- 回访者:进行过至少两次会话的用户。
- 回头客:至少完成了 3 次会话的用户。
- 粉丝:至少完成了 4 次会话的用户。
- 超级粉丝:至少完成过 5 次会话的用户。
参考文献: - https://www.hotjar.com/google-analytics/glossary/users - https://databox.com/new-vs-returning-visitors
Google Analytics 收集的现场数据非常清晰。在重点关注“忠实访问者”“粉丝”和“超级粉丝”类别时,我们发现,用户更有可能在核心网页指标得分较高的网站上停留更长时间、消耗更多内容,并且更频繁地回访。下面列出了一些醒目的示例:
不过,内容消费量和每位用户的观看时长并非唯一飙升的指标。同一类别的访问用户数和访问网页数也随之增加:
从普通网站到高效网站:RebelMouse 如何改造网站
好消息是,通过对您网站的代码库进行深思熟虑的战略性更改,您可以取得良好的 Core Web Vitals 效果。RebelMouse 可通过以下几种方式助力您打造效果出众的网站:
渐进式 Web 应用
RebelMouse 会优化渐进式 Web 应用中的所有第三方调用,以便先传送最重要的内容,然后根据读者需要看到的顺序排列其余调用。
我们提供了一种在 Largest Contentful Paint (LCP) 事件完成后立即加载 JavaScript 的方法。我们为用户提供了三种不同的优先级级别来加载 JavaScript:
- 优化最适合希望采用最新前沿方法的用户。我们会在自己的开发工作中使用它。此优先级会暂停 JavaScript 的触发,直到网页完全加载完毕之后,从而为您提供最高性能。
- 加载屏蔽用于立即执行 JavaScript,通常会对性能得分产生负面影响。此优先级级别会在网页加载完成后立即触发 JavaScript。这可能会使您的效果得分下降 10-40 分,具体取决于额外的调用次数。
- LCP 后是将出色的性能得分与极快的加载速度相结合的最佳选项。此优先级级别会导致 JavaScript 在 Largest Contentful Paint 事件完成后立即加载。(仅建议将此设置用于广告,因为在这种情况下,向仅在网页上停留 5 秒左右的用户投放广告可以提高收入。)
优化社交媒体嵌入
为了保护累积布局偏移 (CLS) 和 LCP 得分,所有社交媒体嵌入内容都需要设置为延迟加载。
如需保留 CLS,您必须使用服务器端技术动态查找嵌入内容的大小,并将其插入您自己的嵌入内容属性存储空间。然后,需要将嵌入内容提交到您的前端,以防止布局在加载时发生偏移。如果您有兴趣深入了解此主题,我们提供了专门介绍 Twitter 和 TikTok 示例的文章,其中包含更多详细信息。
超轻量、智能的 HTML 和 CSS
网站 HTML 和 CSS 的构建方式必须允许在页面其余部分之前预加载上方显示的图片和文本。
- 糟糕的 HTML 结构会迫使浏览器处理许多不必要的折叠下网站元素,以便在第一个视口中渲染折叠上的内容。
- 您可以参阅以下文章,详细了解我们如何在 RebelMouse 上实现这一点:
- 如何改进 Core Web Vitals 的详细说明。
- 完整指南:如何实现快速网页速度,同时包含第三方脚本。
- 有关针对 LCP 进行优化的深度指南。
以效果为先的思维发布
自 Core Web Vitals 发布以来,开发者已经感受到了其发布平台与 Google 建议的阈值相比所产生的影响。
HTTP Archive 是一个开源项目,用于识别数百万个网址的趋势并记录历史模式。该项目在其Core Web Vitals 技术报告中揭示了各大内容管理系统在 Google 的网页体验标准方面的表现。自推出以来,在 2022 年,RebelMouse 在 Google 最重要的指标方面始终表现优于其他主要 CMS 平台:

性能不受影响
现在,对于发布商和品牌而言,制作优质内容只是成功的一半。优质内容必须由能够跟上当今网络速度和标准的现代技术提供支持。我们之所以能够提供符合要求的核心网页指标,是因为网站性能不仅仅是我们的目标,更是根植于我们文化中的公司支柱。我们非常注重效果,致力于在不牺牲用户体验的情况下,帮助客户通过提高流量和增加收入来充分利用开放网络。
如需详细了解我们如何帮助您的网站在 Core Web Vitals 方面超越业界标准,请点击此处立即详细了解 RebelMouse。