在 JavaScript 不可用时不提供后备内容

渐进式增强是一种 Web 开发策略,可确保尽可能多的受众群体能够访问您的网站。核心原则是,基本内容和页面功能应仅依赖于最基础的网络技术。增强型体验(例如使用 CSS 的复杂样式或使用 JavaScript 的互动功能)可在支持这些技术的浏览器的顶部分层。但基本内容和页面功能不应依赖于 CSS 或 JavaScript

Lighthouse 回退内容审核如何失败

在 JavaScript 不可用时,Lighthouse 会标记不包含某些内容的网页:

Lighthouse 审查显示当 JS 不可用时,页面不包含某些内容

Lighthouse 停用页面上的 JavaScript,然后检查页面的 HTML。如果 HTML 为空,则表示审核失败。

如何确保您的网页包含不包含 JavaScript 的内容

渐进式增强是一个很大的话题,而且颇具争议性。其中一派认为,为了遵循渐进式增强的策略,网页应该进行分层,以便基本内容和网页功能只需使用 HTML。如需查看此方法的示例,请参阅 Smashing 杂志的《渐进式增强功能:简介及使用方法》。

另一阵营认为,对于许多现代、大型 Web 应用来说,这种严格的方法不可行或没有必要,并建议在文档 <head> 中针对绝对关键的页面样式使用内嵌关键路径 CSS。

考虑到这些因素,此 Lighthouse 审核会执行一项简单的检查,确保您的网页在停用 JavaScript 后不为空。您的应用遵循渐进式增强的严格程度是一个争论的话题,但人们普遍认为,停用 JavaScript 后,所有网页都应至少显示一些信息,即使这些内容只是提醒用户需要使用 JavaScript 才能使用网页。

对于绝对必须依赖 JavaScript 的网页,一种方法是使用 <noscript> 元素来提醒用户该网页需要使用 JavaScript。这比使用空白页面要好,因为空白页面会让用户不确定是页面、浏览器还是计算机存在问题。

如需查看停用 JavaScript 后网站的外观和性能,请使用 Chrome 开发者工具的停用 JavaScript 功能。

资源