核心网络重要信息:你需要的唯一指南

Wordpress大师

   Vanush Ghamaryan 2021年8月23日页面速度16分钟读     

在这一点上，你很可能听说过核心Web Vitals，谷歌的新页面体验测量工具。Core Web Vitals于2020年5月宣布，并于上个月被纳入排名算法，是谷歌接近网站提供的用户体验质量的另一个关键方法。Core Web Vitals的重点是一个整体的愉快的用户体验，即使你的网站目前排名第一，这篇文章仍将是有用的，以提高你的网站的转化率和减少跳出率。无论你是一个沉浸在代码开发中的开发者，一个想要在竞争中脱颖而出的机构，还是一个想要运营自己网站的小企业主，重要的是要注意这些新的更新，因为它们是谷歌微调其排名过程的方式。我们知道SEO（搜索引擎优化）对排名和转化率的重要性，了解谷歌的进化算法标准是至关重要的，无论你的背景或目标是什么。在这篇文章中，我们将分解所有关于核心Web Vitals的知识，这样你就可以采取必要的步骤来确保你的网站保持谷歌的良好声誉。需要90+的PageSpeed分数?使用10Web，您可以自动获得它!需要一个90+的网页速度分数?使用10Web，您可以自动获得它!

告诉我更多

什么是核心网络至关重要?

核心Web Vitals是谷歌将用于其页面体验评分的三个因素的一个子集。Core Web Vitals预计将于今年8月向全球所有用户推出，加入谷歌现有的搜索信号，如移动友好性、安全浏览、https安全性和侵入性插页指南。简短而简洁的定义如下，但不要担心——我们将在后面详细介绍:最大内容绘制（LCP）:最大内容绘制关注加载时间，特别是关于在屏幕上找到的最大元素。首次输入延迟（FID）:首次输入延迟侧重于交互性，特别是在网站的响应率方面。累积布局位移（CLS）:累积布局位移是最后一个指标，考虑到网站的视觉稳定性，特别是在布局位移方面。引入Core Web Vitals的原因并不新鲜;相反，它是谷歌自2010年以来一直在实现的扩展。网站性能，特别是页面速度评分，在十多年前就被宣布为桌面搜索的排名信号。



根据谷歌?简单:

“用户希望快速找到问题的答案，数据显示，人们真的很关心页面的加载速度。

谷歌并没有停止。在意识到“如果移动页面加载时间超过3秒，就会有超过一半的访问被放弃”后，谷歌于2018年7月将页面速度作为移动搜索的排名因素。页面速度已经成为谷歌算法的绝对优先级，你的网站的优化速度（每PageSpeed Insights结果）是谷歌如何计算页面排名的SEO。当你的站点由于页面加载速度低而跳转率高时，即使是战略性地放置在登陆页面上的广告也会变得无效。正如谷歌所指出的:

“广告和速度是相辅相成的，更快的登陆页面可以带来更好的投资回报率。

谷歌将低速度分数等同于“巨大的错失机会”，因为当用户遇到速度较慢的网站时，“他们不太可能在未来找到他们想要的东西或从你那里购买。”对于代理商、开发者和网站所有者来说，避免这种“错过的机会”可能是你在竞争中获胜或失败的关键。

谷歌推出了核心Web Vitals，以进一步提升用户体验N测量真实的人类经验。与已有的搜索信号相结合，Core Web Vitals使用一种更微妙和多方面的方法组成了页面体验排名因素。一旦我们深入研究了这三个指标，你就会开始理解为什么Core Web Vitals会被纳入排名算法中。谷歌如何使用核心Web Vitals?让我们更深入地了解一下每个核心Web Vitals。

最大内容涂料（LCP）    最大内容绘制（LCP）通过测量页面折叠上方最大元素完全出现所需的时间长度来近似计算页面的加载时间。在视口中发现的最大元素的一些例子是什么?它可以是图像、视频、横幅、背景，甚至是块级文本。



LCP有许多不同的计算方法—在现场（真实用户监视）或在实验室（合成）中。现场工具包括Chrome用户体验报告，PageSpeed Insights，搜索控制台和Javascript库。用于测量LCP的实验室工具包括Chrome DevTools、Lighthouse和网页测试。当最大的元素在2.5秒或更短的时间内加载时，就会获得良好的LCP评分，而且75%的情况下都是这样。当加载时间在2.5 ~ 4秒之间时，认为LCP需要改进，当加载时间大于4秒时，认为LCP较差。服务器响应时间较慢:浏览器从服务器接收内容所需的时间长度直接影响LCP。阻止渲染的JavaScript和CSS:这些文件阻止网站在加载之前呈现网页，延迟LCP。资源加载时间:加载诸如图像、视频等资源所需的时间长度也会影响LCP。客户端呈现:当构建一个主要在客户端呈现的站点时，一个未经过优化的大型JavaScript包可能会对LCP产生负面影响。除了解决上述常见问题外，还可以改进LCP的简单更改包括优化图像、减小WebFont大小、缩小CSS文件以及使用PRPL应用即时加载。第一次输入延迟（FID）

首次输入延迟（FID）主要关注网站的交互性或响应性。它通过测量页面处理用户输入（单击按钮、使用搜索字段等）所花费的时间来实现这一点。重要的是要注意，FID不是关于操作的可视化表示的加载时间，而是关于采取操作后的响应时间。它适用于最初采取的行动，强调网站的“第一印象”体验。与LCP不同，FID不能在实验室中真正测量，因为它依赖于人与页面的交互，或真实的用户数据。FID可以使用现场工具进行测量，包括Chrome用户体验报告、PageSpeed Insights、搜索控制台和JavaScript库。此外，Lighthouse也可以使用，即使它是一个实验室度量工具。原因是实验室指标总阻塞时间（TBT）与FID密切相关，可以通过网站上的Lighthouse性能审计来测量。审计对TBT的改进建议适用于FID的改进。FID的目标指标在75%的情况下是100毫秒或更短。当延迟时间在100 ~ 300毫秒之间时，表示FID需要改进，当延迟时间大于300毫秒时，则认为FID差。繁重的JavaScript执行:当浏览器在主线程上忙于执行繁重的JavaScript时，它将延迟响应用户操作。其他可以实现的改进FID的改变包括最小化主线程工作，减少有问题的第三方脚本对主线程的影响，保持传输大小较小。累计布局偏移（CLS）    累积布局Shift （CLS）衡量你网站的视觉稳定性。它关注的是在页面的整个生命周期中发生的每一次布局转移的最大爆发，而不是由用户交互引起的。良好的视觉稳定性被认为是一个没有任何布局的意外变化的网站——只是作为对用户操作的响应。布局移位分数是通过查看冲击分数（前后不稳定元素对视口区域的影响的测量）和距离分数（相对于视口不稳定元素移动的距离的测量）的乘积来计算的。与LCP一样，CLS可以使用现场和实验室工具进行测量。然而，重要的是要注意，在实验室环境中报告的CLS值可能比实际用户体验时要少。原因是前者是一个合成环境，它只能测量在初始页面加载期间发生的布局变化，而不是页面的整个生命周期，后者才是CLS的真正本质。现场工具包括Chrome用户体验报告，PageSpeed Insights，搜索控制台，和JavaScript库。实验工具包括Chrome DevTools、Lighthouse和WebPageTest。一个网站的CLS评分应该在75%的情况下为0.1分或更低。在0.1到0.25之间的CLS是需要改进的，而在0.25以上的CLS被认为是差的。关于CLS的好消息是，对于大多数网站来说，遵循一些简单的指导方针将有助于避免任何意想不到的布局变化。为广告创建静态空间:由于广告可以是动态的，可以对元素进行样式化或保留槽大小以减少移位。在所有图像和视频上具有大小属性:包括宽度和高度。这些元素上的维度确保浏览器分配了适当的空间量，避免了任何移动。不在现有内容之上插入内容:仅在响应用户操作时将内容插入到现有元素中，可以避免布局中的意外更改。使用转换动画:CSS transform属性允许元素的动画而不引起布局的变化。其他更改包括为嵌入使用占位符和使用预加载字体。在这里，我将为网站优化提供一个通用清单，以提高这些指标，加快您的网站加载速度。你可以在开发网站的早期阶段依赖它们，也可以将它们应用到现有的网站上。优化的全部意义是只加载必要的内容，缓存所有可以缓存的内容，并以最有效的方式提供文件。

让我们从图片开始:

图片检查使用过的图片格式（使用PNG, BMP, GIF，只有当你真的需要时）不同大小的图片为不同的屏幕分辨率优化你的图片将WebP图片服务到支持它们的浏览器使用CDN服务他们更快

这些是改善图片加载的步骤，但即使他们都是完整的，你有小尺寸的图片，你仍然可以面对一个大的网络负载，缓慢的网站，分数低是因为数量多。因此，一种名为“惰性加载”的技术就派上用场了。为了理解延迟加载，让我向您介绍它的相反技术，称为“急切加载”，这通常是默认使用的。瞬时加载是指网页上的所有资源（图片、视频、音乐等）在网页加载之前加载。因此，如果我们有一个包含100张图片的大型博客文章，我们将全部加载它们，然后将网页标记为已加载。当使用延迟加载时，我们加载没有资源的网页，只在需要时加载它们。在我们有100张图片的博客文章的例子中，我们将呈现没有图片的页面，只有当用户滚动到这些图片时才会逐一加载它们。有许多流行的现成使用库，或者您可以使用浏览器级的惰性加载。所以,我们的ore，以及我们的其他更新，已经符合良好的核心Web Vitals价值。图像优化:10Web提供的图像自动优化有助于快速加载图像（同时保持高分辨率），提高LCP时间。延迟加载:10Web的速度优化器允许你延迟加载图片、背景图片、iFrames和视频。启用延迟加载将导致只在用户向下滚动页面时加载所选元素，这有助于实现更好的LCP值。预加载视频:我们去年实现的一个更新是预加载视频选项，它可以下载和缓存数据，使您的页面加载更快。缓存:10Web包含了一个强大的缓存结构作为我们主机服务的一部分，使用了最快的缓存层之一（Nginx FastCGI），并允许你控制哪些页面被缓存。这不仅影响LCP，也影响FID。最小化JavaScript:最小化JavaScript有助于减少整个页面的加载时间，同时也是通过允许用户与页面实际交互来改进FID的关键。延迟所有JavaScript:我们的速度优化器最近更新了一个选项，允许在交互之前延迟所有JavaScript代码的执行，提高了页面速度评分，特别是FID。压缩CSS文件:缩小笨重的CSS可以帮助加快LCP时间。临界CSS生成:将CSS分为临界和非临界，并按此顺序加载。设置尺寸:最后，我们流行的Photo Gallery插件允许你设置媒体的最大宽度和高度尺寸，以确保最佳的加载速度和良好的CLS值，因为属性不会在页面完全加载时改变。无论您是用10Web托管您的网站，还是将已有的网站迁移到我们的平台，看看自动优化能为您做些什么!今天就开始使用10Web免费试用吧，让你的网站更上一层楼。

FAQs

谷歌将继续改进它用来衡量用户体验的指标，但如前所述，总体目标保持不变。也就是说，让我们来看看（并回答!）一些你经常问的关于核心Web Vitals的问题。Core Web Vitals和pagespescore之间的区别是什么?一般来说，它们几乎是一样的。有了PageSpeed Score，你不需要担心技术方面的问题。它更容易理解、测量甚至补救，因为它是一个从0到100的单一数字，我们知道如果数字是90+，那么一切都没问题。对pagespespeed Score的改进也将提高Core Web Vitals的价值，因为它们都有优化用户体验的共同目标。为什么10Web承诺90+的页面速度评分，如果它不再重要了?

这是非常重要的，我们很自豪能够继续提供90+的页面速度分数!谷歌巩固了一个好的90分或以上的pagespepescore的重要性，当你看到所有不同的组件，使我们的能力提供90分以上的分数，你会发现它们也是关于核心Web Vitals的重要组件。如果你的网站有90+的pagespeesscore，它将提高CLS和FID值，更好的核心Web Vitals值。我只有10个web插件，比如图片库，图像优化器等，我还能有90+的页面速度评分吗?

我们不能保证90+ PageSpeedScore通过我们的插件单独。虽然图片库和图像优化器等插件确实有助于创建一个更快、更优化的网站，但它们仍然只是整体拼图的一部分。为了保证90+的pagespescore，一定要移动到10Web平台!你喜欢这篇文章吗?传播这个词!留言取消回复

您的电子邮件地址将不会被公布。必填字段标记为*

您的电子邮件地址将永远不会被发布或共享。必填字段标记为*

COMMENT*

NAME *

EMAIL ADDRESS *

WEBSITE

将我的姓名、电子邮件和网站保存在此浏览器中以备下次使用omment。





相关帖子谷歌页面体验更新:新的谷歌排名因素为什么你的网站需要谷歌pagespe90 +顶级网站性能指标10个简单的方法加快你的WordPress网站#性能#网站速度