Lighthouse HTML 审计

Lighthouse 是内置于 Chrome DevTools（审计标签页）中的自动化审计工具，可以从性能、无障碍、最佳实践、搜索引擎优化和 PWA 五个方面为页面评分。它会在浏览器中运行并审计页面，进行测量，并生成可执行的改进建议。

在 Chrome DevTools 中切换到 Lighthouse，选择类别，选择桌面设备或移动设备，然后点击“分析页面加载”。该工具会在干净的环境中重新加载页面，并在一分钟内生成报告。

性能衡量核心网页指标和其他速度指标。无障碍检查符合 WCAG 的规则。最佳实践涵盖安全性和现代网页标准。搜索引擎优化检查标记是否可供爬取。PWA验证是否可安装以及是否支持离线使用。

无障碍审计可以发现：缺少替代文本、缺少表单标签、颜色对比度过低、缺少语言属性、标识符重复、缺少地标、可聚焦元素没有键盘支持。每个问题都链接到详细的修复指导。

最大内容绘制（LCP）、累计布局偏移（CLS）、总阻塞时间（TBT）和速度指数。每项指标都会获得评分，并按权重计入总体性能评分。Lighthouse 会显示对每项指标贡献最大的 DOM 元素。

检查 HTTPS 的使用情况、控制台错误、图像宽高比、已弃用的接口和混合内容。最佳实践审计可以发现大量应当现代化改造的旧式或不安全模式。

可以发现缺少元描述、缺少或重复的 <title>、robots.txt 问题、链接缺少描述性文本、缺少视口元标签以及语言和地区标记问题。将 Lighthouse 搜索引擎优化审计与真正的搜索引擎优化审计工具（Ahrefs、Screaming Frog）结合，用于内容层面的分析。

检查是否满足可安装的每项要求：HTTPS、包含最少必要字段的有效清单、已注册的服务工作线程、视口标签和图标。作为可安装应用发布前，请修复 PWA 审计中的所有失败项。

Lighthouse 命令行工具和 Lighthouse CI 工具可以将审计集成到持续集成/持续交付中。每个 PR 都会在已部署的预览版本上运行 Lighthouse；如果评分低于阈值而出现回归，该操作就会失败。这样可以防止无障碍、性能或搜索引擎优化方面的无声回归。

Lighthouse 报告可以保存为 JSON，并以编程方式进行比较：持续跟踪 LCP 评分以发现回归，比较两个 PR 以了解哪个 PR 改变了哪个指标，在跨过阈值时发出警报。这些数据已经结构化，便于工具处理。

Lighthouse 是一种合成测试——它在受控环境中运行，而不是在真实用户的设备上运行。请结合跟踪实际用户体验的真实用户监测（RUM）工具。合成测试可以尽早发现回归；RUM 则能确认用户确实感受到了改进。

某些审计会标记在特定情境下无法避免的模式。请记录有意保留的例外，将其加入 Lighthouse CI 的忽略列表，并随着平台的发展定期重新评估。避免使用“一律忽略”——那会使自动化审计失去意义。

应将 Lighthouse 评分视为持续改进的目标，而不是一次性修复任务。建立在每个 PR 上查看评分、立即处理回归并逐步改善基线的团队文化。大多数团队在数月坚持这样做后，评分都会稳步提升。

为什么 Lighthouse 的合成审计应当与真实用户监测（RUM）结合？

Lighthouse 会从性能、无障碍、最佳实践、搜索引擎优化和 PWA 五个方面审计页面。一次性检查可以从 Chrome DevTools 运行，持续集成则使用 Lighthouse CI。每个 PR 都应处理回归，建立以测量结果驱动改进的文化，并将合成审计与真实用户监测结合，以验证实验室环境中的改进是否能转化为真实用户的收益。