如何使用 Chrome Lighthouse 进行网站审核?

谷歌浏览器是最好的浏览器之一,具有许多隐藏的功能。 尤其是开发人员工具具有缩小 CSS 和 JS 文件的漂亮视图等功能。 现在,您可以使用集成了 Lighthouse 的 Chrome 开发人员工具对您的网站进行全面审核。 Lighthouse 是一个开源软件,用于进行自动化测试以提高网站和应用程序的性能。 在本文中,让我们解释如何使用 Chrome Lighthouse 功能进行网站审核。

Chrome 审核入门

打开您要执行审核的网页。 转到菜单“查看 > 开发人员 > 开发人员工具”或右键单击并选择“检查”选项。 如果您在 Windows 笔记本电脑上运行 Chrome,则只需按 F12 即可在 Chrome 中打开开发人员工具。

  • 转到开发人员工具上的“审核”选项卡
  • 单击“执行审核…”按钮开始审核。
  • 您可以通过按“+”按钮添加站点以执行新审核。
  • 审核后,点击下载按钮,在您的计算机上获取审核报告。
谷歌 Chrome 灯塔 SEO 审核

谷歌 Chrome 灯塔 SEO 审核

执行网站审核

Chrome 将显示一个弹出屏幕,其中包含以下审核类别。

  • 表现
  • 渐进式网络应用
  • 最佳实践
  • 可访问性
  • 搜索引擎优化

选择所需的类别,然后单击“运行审核”按钮。

灯塔审计执行

灯塔审计执行

网站审核结果

审核将需要几分钟时间,具体取决于网站。 您可以使用每个选定部分的记分卡在开发人员工具中查看结果,如下所示。 您可以在屏幕上查看结果或下载报告以供日后检查。

灯塔审计报告

灯塔审计报告

滚动浏览不同的部分以查找通过的结果和您的网站所需的改进。

表现

性能部分显示了加载交互式可视站点所花费的时间以及许多其他有用的指标,例如第一次有意义的痛苦、第一次交互等。

灯塔绩效审计报告

灯塔绩效审计报告

除了指标之外,“性能”部分下几乎没有其他可用的子部分。 机会部分将显示提高页面加载速度的可能选项。 例如,您可以获取页面上未使用的 CSS 规则,您可以删除这些规则以改善加载。 表现。

“诊断”部分将显示以最高优先级发出的请求,称为关键链请求。 您可以减少关键链请求的加载时间以提高页面加载速度。

渐进式网络应用

Chrome Lighthouse 工具将检查页面 渐进式网络应用指南. “Progressive Web App”部分显示失败、通过和需要手动检查的项目。 渐进式 Web 应用程序检查的一些因素包括 3G 连接的加载速度、视口内的内容加载、HTTPS 的使用以及 HTTP 到 HTTPS 的重定向。

Lighthouse 渐进式 Web 应用报告

Lighthouse 渐进式 Web 应用报告

可访问性

“可访问性”部分显示了您网站可访问性改进的机会。 例如,您可以检查指定的有效语言和结构元素。 由于无法自动测试所有可访问性功能,该工具还将建议需要手动检查的项目。

灯塔无障碍报告

灯塔无障碍报告

最佳实践

该工具将测试应用程序或网站的现代世界推荐做法,并在“最佳做法”部分显示结果。

灯塔最佳实践

灯塔最佳实践

搜索引擎优化

SEO 是 Chrome Lighthouse 审核中添加的新功能。 搜索引擎优化对于任何网站都很重要,以确保 Google 和 Bing 等搜索引擎可以索引网站并显示在搜索结果中。 SEO 审核将检查所选站点的元描述、替代标签、页面标题、规范标签。 移动友好性和页面的可索引性。

灯塔搜索引擎优化审计报告

灯塔搜索引擎优化审计报告

灯塔报告查看器

您可以使用记事本或 TextEdit 查看下载的审核报告。 但内容不会是您在 Chrome 开发人员工具中看到的可读格式。 您需要一个额外的报告查看器才能阅读报告的内容。 去 灯塔报告查看器 页。

灯塔报告查看器

灯塔报告查看器

将从 Chrome 下载的报告拖放到框中。 您将在 Chrome 中看到与在开发人员工具中看到的格式相同的报告。

查看 Chrome 灯塔报告

查看 Chrome 灯塔报告

Chrome 灯塔扩展

Chrome 也有一个单独的灯塔扩展来进行网站审计。 这本质上与 Chrome 浏览器的开发者工具中集成的工具相同。 因此,如果您不喜欢使用开发人员工具,可以使用该扩展程序。

您可以前往 Chrome 网上商店并安装 灯塔扩建 在您的 Chrome 浏览器上。 它将在 Chrome 的地址栏旁边添加一个灯塔图标。 点击“选项”选择审计类别,然后点击“生成报告”按钮运行网站审计。

"<yoastmark

审核完成后,网站审核报告将在新窗口中打开。

您可以查看以下视频以获取 Chrome Lighthouse 的完整详细信息。

最后的话

现在您无需查看多种工具来检查您网站的性能。 Chrome Lighthouse 工具可以在浏览器的开发人员工具部分进行完整的网站审核。 这是开发人员和站点所有者进行审核并采取改进措施的好选择。

查看  什么是百度自动 Ping 服务?

类似文章