改善 WordPress 网站核心网络生命力的技巧

已发表: 2021-09-13

谷歌有办法在网页设计师和网站所有者之间制造恐慌。 当他们对搜索算法进行更改时,人们开始争先恐后地追赶。 很容易理解为什么。 没有人希望他们的 SEO 排名受到影响。

因此,当宣布 Core Web Vitals 指标时,反应是可以预见的。 由于这些更改基于站点性能,我们的注意力已转向确保加载时间快如闪电。

但这并不总是那么简单。 运行 WordPress 等内容管理系统 (CMS) 的网站尤其具有挑战性。 有很多因素在起作用。 因此,提高性能需要多管齐下。

从哪儿开始? 查看我们的指南,以提高您的 WordPress 网站的 Core Web Vitals 分数。

实施缓存

提高 WordPress 网站速度的最简单方法之一是实现缓存。 在许多情况下,通过这一步,以前缓慢的站点将变得更快。 即使在相对便宜的主机上也是如此。

默认情况下,WordPress 页面和帖子必须从站点的数据库中检索内容和设置。 这需要时间。 另一方面,缓存将以静态 HTML 文件的形式提供内容 - 消除了对数据库调用的需要。 没有中间人(即数据库)后,加载时间会更快。

一些托管软件包,特别是托管的 WordPress 托管,将包括基于服务器的缓存。 这通常是最好的选择,因为它对网页设计师的要求很少,而且性能很好。 它可能需要经常清除。 否则,这是一种不干涉的体验。 并且可以与插件有效结合,进一步提升速度。

即使您的主机不提供服务器级别的缓存,您仍然可以通过插件优化性能。 缓存插件的范围、复杂性和定价各不相同。 但在改善加载时间方面,它们确实提供了切实的成果。 反过来,这也是对 Core Web Vitals 的积极推动。

一辆跑车。

延迟加载渲染阻止脚本和样式

在 Google PageSpeed Insights 中测试您网站的性能时,呈现阻止资源的主题似乎出现了很多。 这些是不被认为是“关键”的脚本和样式——这意味着它们不需要呈现“首屏”页面内容。

这些资源可能会妨碍更快的加载时间。 具体来说,它们会影响 Core Web Vitals 中的“最大内容绘制 (LCP)”分数。 这是页面主要内容区域加载所需的时间。 降低 LCP 是至关重要的。

改善这种情况的一种方法是延迟(或推迟)各种内容元素(图像、视频、块级文本)的加载。 这确保了只有需要的脚本和样式首先加载,而其他所有内容都在之后加载。

除了缩小之外,许多 WordPress 缓存/优化插件也恰好包含这种类型的功能。 然而,这可能需要一些实验,因为推迟错误的资源可能会出现问题。

请务必测试您所做的任何更改并检查浏览器控制台是否有错误。 一旦找到正确的配置,页面上的渲染阻塞资源的数量应该会显着减少。

街道上的“让步”标志。

优化图像

大型英雄图像和复杂滑块的广泛使用只会增加性能优化的挑战。 这些资产可能看起来不错,但可以轻松添加高达数兆字节的数据。 这不会让您获得 Core Web Vitals 的及格分数——尤其是在移动设备上。

值得庆幸的是,有几种方法可以减轻负担。 首先,删除您认为不必要的任何图像。 即使删除一张大图像也会产生影响。

可以优化其余图像。 这将减少它们的文件大小并减少它们对加载时间的影响。

如何进行图像优化取决于您。 您可以下载最严重的违规者的副本并使用您最喜欢的图像编辑器对其进行压缩,然后将它们上传回您的网站。 或者,您可以使用有用的 WordPress 媒体插件自动化该过程。

响应式图像

对于移动用户,WordPress 包括通过srcset提供响应式图像的能力。 事实上,它会自动为您处理放置在您的内容中的图像。 这是非常有价值的,因为它可以防止大量桌面大小的媒体降低移动用户体验。 对于主要内容区域之外的图像,您可能需要做一些自定义工作来实现此功能。

现代图像格式

还值得查看您正在使用的文件格式。 例如,Google 的 WebP 格式通常可以在保持图像质量的同时减小文件大小。 请注意,旧版浏览器(嗯,IE)不支持某些新奇的格式,因此可能需要后备版本。 插件也可以提供帮助。

一个人使用照片编辑软件。

延迟加载所有东西

延迟加载功能仅在项目位于浏览器的视口中时才加载它们。 通过延迟加载图像、iframe 和其他第三方内容(例如社交媒体小部件),您可以将资源集中在用户将首先看到的元素上。

WordPress 已经实现了对图像的原生、基于浏览器的延迟加载。 当您将图像添加到页面或帖子时, loading="lazy"属性放置在<img>标记中。 也就是说,只要图像包含高度和宽度属性。

这很棒——但是其他元素呢,比如视频或 iframe? 当从一开始就加载时,这些项目也可以压低页面。

iframe 现在默认是延迟加载的——所以不用担心。 一些更复杂的元素可能需要自定义代码或插件来实现此功能。

一条狗在长凳上休息。

清除杂乱

随着时间的推移,即使是维护良好的 WordPress 网站也会变得杂乱无章。 数据库堵塞、未使用的插件仍然处于活动状态、臃肿的主题以及您不使用的功能——这些都会发生。 它还可以拖累您的核心网络生命力。

这就是为什么一次又一次地整理是很重要的。 您的站点数据库可以手动优化或设置为定期优化。 未使用的插件可以被停用和丢弃。 主题可以变得更精简或用更好的东西代替。

研究使您的网站变慢的原因,找到罪魁祸首并处理它们。 您可能会惊讶于这会带来多大的不同。

拼出“保持简单”的字母拼贴。

改善您网站的核心网络生命力

Core Web Vitals 使优化 WordPress 网站性能的本已棘手的过程复杂化。 即使是在其他性能指标上得分很高的网站,也可能在这方面仍有不足。 这在移动测试中最为突出。

好消息是设计师可以做很多小事来迎头赶上。 实施缓存奠定了良好的基础,并提供了立竿见影的推动力。 从那里开始,这是一个减小文件大小并按重要性顺序加载样式和脚本的问题。

更进一步,考虑到 Core Web Vitals 来调整网站的 CSS 也是有意义的。 这可以帮助解决可怕的累积布局偏移 (CLS) 分数并减少臃肿。

一般来说,对性能有益的东西对 Core Web Vitals 也有好处。 分数可以很快提高。 只需知道,要解决其中的一些个别缺点,需要进行一些反复试验。

首要目标是确保在用户访问您的网站时只加载必需品。 这样做会让访问者和谷歌都非常高兴。