2018 年 5 月，谷歌推出 灯塔3.0，他们的开源工具的更新版本，用于审核网页的质量和速度。 Lighthouse 3.0 为报告带来了新的输出选项，但也对它测量站点速度和性能的方式进行了一些更改，例如引入了 First Contentful Paint 作为性能和速度指标以及用于性能审计的新权重。
自 2018 年 5 月以来？ 谷歌发布了更多的变化。 这就是为什么我们今天分享五种优化网站的方法。
让我们开始吧。
为什么现在优化您的网站速度？
自 3.0 发布以来，Lighthouse 在这一年里一直在不断发展。 谷歌最近宣布它是 致力于“平台包” 对于 Lighthouse，测试人员可以接收特定于 CMS 和在其站点上使用的代码库的速度优化提示。
因此，例如，如果您在 WordPress 中使用 Angular JavaScript，那么您很幸运，但在 GitHub 社区的帮助下，更多的 Platform Packs 变体已经在开发中。
自 2016 年首次引入移动优先索引以来，Google 一直在逐渐提高网站速度作为搜索排名标准的重要性，因此关注这些指标和趋势是明智的。 谷歌推出 大约 62 个算法调整更新 在平均过程中 星期 在 2018 年，因此确保您的排名成为一种越来越动态的做法。 鉴于移动优先指数的相对新颖性，以及它对网站流量的不成比例的影响，大多数算法改进将集中在移动端是有道理的。
密切关注 Lighthouse 的最有力论据可能是，这是谷歌首次构建自助速度测量工具，该工具试图复制真实网站访问者所经历的滞后时间，而不是机器人。
“您从 Lighthouse 中查看的许多这些指标主要是针对面向用户的方面呈现给您的，”网站管理员趋势分析师 John Mueller 在 2 月份在 办公时间环聊问答 会议。 “从我们的角度来看，从搜索的角度来看，我们将各种这些指标结合在一起，以确定我们应该如何看待这个网站的速度。”
考虑到所有这些，我们收集了五个技巧来帮助您以网站速度取悦 Google 之神。
1.实现延迟加载
高分辨率图像可以显着减慢网站的加载时间，并增加内存和页面重量。 您可以将它们完全从您的站点中删除，但您可能需要或确实想要保留它们。延迟加载是一种加快页面加载时间的方法，而无需摆脱任何资源密集型内容。
使用延迟加载，一次只加载网页的一部分——查看者当时正在查看的部分，因此您将推迟加载下一部分，直到访问者向下滚动到它。 这减少了达到第一次有意义的绘画和第一次内容绘画等指标所需的时间，这是 Lighthouse 用来衡量网站速度和性能的两个指标。
如果你已经实现了“无限滚动”，那么延迟加载是必须的，这在内容繁重的网站中很流行，但它可以帮助所有类型的网站。 事实上，Duda 网页设计平台发现，在 Duda 支持的网站上实施延迟加载后，这些属性的平均 灯塔分数提升 10 分——没什么好动摇的
2. 充分利用下一代图像格式
导致 First Contentful Paint 时间缓慢的最大罪魁祸首之一是您的图像。 问题是，在营销和销售方面，一张图片真的值一千字，所以你拒绝摆脱那些偏爱大英雄形象的设计是正确的。 除了延迟加载， 下一代图像格式 提供解决方案。
下一代格式包括 JPEG 2000、JPEG XR 和 WebP。 这些格式压缩和转换图像以使它们比传统的 PNG 和 JPG 小得多，但它们不会对图像质量产生负面影响。 当您使用下一代格式时，您可以显着加快页面加载时间，即使对于具有更大像素尺寸的视觉效果，也不会牺牲图像质量。 查看 来自 Insane Lab 的数据 拍摄了比 PNG 文件小得多的 WebP 文件：
谷歌 特别鼓励 网站管理员使用 Chrome 和 Opera 浏览器支持的自己的新 WebP 格式。 WebP 生成的图像比 PNG 格式小 26%，比 JPG 格式小 25-35%。
3. 使用内容交付网络
内容交付网络，或 内容分发网络是加快页面加载速度的绝佳解决方案， 第二重要的 Lighthouse 3.0 中良好性能评级的指标。
基本上，CDN 是分布在世界各地的服务器网络，它们一起工作以交付您的内容。 因为 CDN 中的服务器在地理上分散，所以总是有一个离几乎每个用户最近，从而减少了您的内容到达他们的浏览器所需的时间。
CDN 也经常使用高级压缩策略，例如缩小和文件压缩，这可以帮助您的内容资产更快地传输，提供更好的内容可用性和冗余性，这样大流量就不会中断您的网站性能。 面对硬件故障，CDN 不太可能出现故障。 依赖超快加载时间的主要内容密集型网站，如 Netflix、Facebook 和亚马逊，都使用 CDN。
4.摆脱不必要的插件
如果您有一个在 WordPress 或类似平台上运行的站点，该平台依赖于插件来获得额外功能，那么这些插件可能会降低您站点的响应能力，影响其交互性指标并降低您的 Lighthouse 3.0 性能分数。
某些插件可能对您的网站至关重要，例如您的支付处理器，但其他插件可能不再有太大作用。 许多插件会向第三方服务器查询信息，这可能会进一步减慢速度。 在一个 DigWP 最近的调查，超过 900 名 WordPress 专业人士表示他们通常将插件数量视为“太多”的门槛，75% 的受访者同意 25 个是限制。 超过三分之一的受访者建议将 10 作为限制。
额外的插件会导致数据库膨胀，无缘无故地增加网站的重量，使其加载速度变慢，所以你拥有的越少越好。
5.删除你不使用的CSS规则
您网站的 CSS 规则在 main.css 文件中定义。 它也称为外部样式表，因为它与站点 HTML 分开存储。 为了让您的站点加载 First Contentful Paint（根据新的 Lighthouse 版本对性能有很大影响），浏览器必须首先检索、解析和处理每个 CSS 样式表以确定内容的显示方式。
因此，每个额外的 CSS 文件都不可避免地会减慢页面加载时间并进一步影响性能。 对于每个文件，浏览器必须访问它、下载它，然后才能呈现页面。
使用像这样的插件来缩小你的 CSS 文件 快速缩小 可以为您的 Lighthouse 分数提供很大帮助，但您可以做更多的事情来确保 CSS 加载时间不会阻碍您。 删除所有未使用的 CSS 定义可以进一步加快速度并简化您的网站性能以获得更好的 Google 评级。
遵循 Google 的速度标准可提高性能
Lighthouse 3.0 的推出和持续开发应该被视为再次提醒您根据 Google 的最新速度标准优化您的网站的重要性。 通过摆脱您不需要的 CSS 规则和插件，使用 CDN 和下一代图像格式，并充分利用延迟加载，您可以简化您的网站，减少页面加载时间，并提高性能以留在 Google 的好书。
关于作者
位于特拉维夫的顾问、社交媒体专家和博主， 加布里埃尔·萨德 帮助品牌通过强大的数字营销策略分享他们的声音并扩展他们的业务。 与她取得联系的最佳方式是通过她 领英个人资料.
