Web可访问性 - 缺少<h2>的标题顺序规则

Question

我们继承了一个网站，目前我们正在努力使WCAG2.0 AA符合

其中一个页面未通过标题订单规则，因为它包含<h3>和<h4>标记，但之前没有<h1>或<h2>

我们正在添加<h1>代码（因为所有网页都应该有），但不需要<h2>代码并修改<h3>和{{ 1}}将涉及各种jQuery代码和CSS

的大量重构

是否有任何技巧可以访问该页面？我讨厌放入一个隐藏的<h4>标签，因为屏幕阅读器可能会选择这个标签。或者他们是否忽略隐藏的标签，然后页面变得合规？

Answer 1

您是否正在尝试满足WCAG 2.0 AA或者您是否尝试使该页面可访问？

这些通常是相同的，但有时不一样。

隐藏的<h2>会通过WCAG，具体取决于您隐藏它的方式。但是，这不会使页面更容易访问。

虽然这可能很糟糕，但最好，最正确的方法是将<h3>和<h4>修正为正确的级别（这是我的答案，其余部分是绒毛）。如果您提供一些代码示例并询问有关如何编写正则表达式或在整个继承系统中编写这些替换脚本的提示，那么您的问题可能更合适。

如果您被告知您没有时间做正确的事情，那么代码示例（或示例网站）可能仍然有助于获得一些指导。

Answer 2

我之前确实看到过这种情况，实际上我自己陷入了这个陷阱。通过将样式应用于h3和h4，可以使页面看起来很好，某种方式。 然而，从标题标签的角度来看，它们的目的是为文档添加语义，我们都知道。因此，有一个h3但没有h2的文件大纲是否有意义？屏幕阅读器和其他辅助工具使用此标头信息，有些可能会混淆。 我最有影响力的决策点是，＆＃34;用户将如何使用这些信息？＆＃34;他们能够消费吗？跳过标题级别是否有意义？我最初想不到，但请告诉我你的不同意见！

Answer 3

If you really do care about accessibility, giving an empty h2 (even implicitly which is the case when you omit it) might give no clue, in some screen readers, of the announced section to users when they will navigate the outline of the document (1).

That being said, I can't find anywhere (neither WCAG or HTML5 documentation) where it's said that you can't omit one level of headings.

The only official (for HTML5.1) requirement is to use "headings of lower rank" to start new subsections, which should mean that you could use a h3 directly below a h1 but can't use another h1

Even the WCAG is giving an example using omitted ranks saying this example does not intend to prescribe the level for a particular section.

(1) HTML5.1 provides an outline algorithm where we can read about "implied headings" or about the use of the rank when there is an heading content element

Answer 4

我想说确保合规性的最佳方法是重构javascript / CSS中的代码。要隐藏元素，您可以使用hidden属性或aria-hidden。

https://www.paciellogroup.com/blog/2012/05/html5-accessibility-chops-hidden-and-aria-hidden/