[h6 aria level=“7”]是创建[h7]元素的可靠方法吗?

虽然 <div role="heading" aria-level="7"> 似乎是定义H7元素的有效方法,屏幕阅读器并不普遍认为它像H1-H6。 我至少可以确认它对下巴不起作用。对于大白鲨,情况更糟,它被视为H2!

在firefox、chrome和IE11上使用Jaws进行测试。 还测试了8级、9级、10级、11级和12级。指定 aria-level="X" 具有 X>6 总是把它变成H2。

所以,不要用这个技巧来制造H7元素。它并没有得到普遍支持。

你最好重新考虑一下你的页面结构。你真的需要7级标题吗? 人们常说,一份好的文档不应该超过3级,对于一份很长或很重的技术文档,可能是4级,但例外的是5级。鉴于H1的特殊状态,让我们添加一个。所以,6个级别就足够了。

你没有跳过一些关卡吗? 跳过标题级别在语义上是不正确的,你不应该仅仅因为视觉外观就这样做。

事实上 the ARIA specification 永远不要明确表示允许指定高于6级的级别。 aria级别的默认值为2。这解释了Jaws在遇到aria级别的无效值时的合法行为。

[h6 aria level=–7–7]是创建[h7]元素的可靠方法吗?

不

这违反了法律 second rule of ARIA :

不要改变本机语义,除非你真的必须这样做。

如果要定义新的标题级别,应该使用

<div role="heading" aria-level="7">

参见以下示例:

This example demonstrates how to implement a level 7 heading using role="heading" and the aria-level attribute. Since HTML only supports headings through level 6, there is no native element to provide these semantics.

编辑: WCAG规范中的另一个示例 ARIA12: Using role=heading to identify headings (感谢do@Daniel tonon指出这一点)

有没有坏音符的支撑 aria-level 6以上,无论你是否使用 h6 或 div (见@QuentinC-answer)