3

我们继承了一个网站,我们目前正在尝试使 WCAG2.0 AA 兼容

其中一个页面不符合标题顺序规则,因为它有一个<h3><h4>标签,但没有先验<h1><h2>

我们正在添加一个<h1>标签(因为所有页面都应该有一个),但不需要<h2>标签并修改标签,<h3>并且<h4>将涉及对各种 jQuery 代码和 CSS 的大量重构

是否有任何技巧可以使页面可访问?我不愿意放入隐藏<h2>标签,因为屏幕阅读器可能会选择它。或者他们是否忽略了隐藏标签,然后页面变得合规?

4

4 回答 4

4

您是要满足 WCAG 2.0 AA 还是要使页面可访问?

这些通常是相同的,但有时不是。

隐藏<h2>会通过 WCAG,具体取决于您如何隐藏它。但是,这不会使页面更易于访问。

虽然这可能很糟糕,但最好、最正确的方法是将<h3>s 和<h4>s 修复为正确的水平(这是我的答案,其余的都是绒毛)。如果您改为提供一些代码示例并询问有关如何编写正则表达式或以其他方式在整个继承系统中编写这些替换的提示,您的问题可能更合适。

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

于 2016-09-29T17:14:56.717 回答
1

这种情况我真的见过,自己也真的掉进了这个陷阱。通过对 h3 和 h4 应用样式,可以使页面看起来,嗯,某种方式。然而,看看标题标签的要点,我们都知道,它们的目的是为文档添加语义。因此,有一个有 h3 但没有 h2 的文档大纲有意义吗?屏幕阅读器和其他辅助工具使用此标题信息,有些可能会感到困惑。我最有影响力的决策点是,“用户将如何消费这些信息?” 他们能消费吗?跳过标题级别有意义吗?我最初认为不是,但请让我知道您的不同意见!

于 2016-09-29T14:59:34.157 回答
1

如果您确实关心可访问性,h2则在某些屏幕阅读器中,给一个空白(即使是隐含的,当您省略它时也是如此)可能不会向用户提供已宣布部分的任何线索,因为他们将导航文档的大纲(1 )。

话虽如此,我找不到任何地方(WCAG 或 HTML5 文档)都说不能省略一级标题。

唯一的官方(HTML5.1)要求是使用“较低级别的标题”来开始新的小节,这应该意味着您可以在 a 的h3正下方使用 ah1但不能使用另一个h1

甚至 WCAG 也给出了一个使用省略排名的例子,说这个例子并不打算为特定部分规定级别。

(1) HTML5.1 提供了一个大纲算法,我们可以在其中阅读“隐含标题”或在有标题内容元素时使用排名

于 2016-10-04T14:44:16.877 回答
0

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

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

于 2016-09-29T15:56:50.153 回答