屏幕阅读器解析html,HTML表中隐藏的咏叹调标签(屏幕阅读器可访问性)

在我的网页中,我需要创建一个表,该表具有根据某些用户配置可见或隐藏的标题行.此表还需要完全访问(具体来说,由于表可能很长,我希望读取行/列标题的快捷方式将起作用).我只有ChromeVox要测试(我会从我发现的博客帖子中详细介绍与其他读者的行为).

我目前的布局看起来与此类似：

CSS：

.table-header-show {

}

.table-header-hide {

display: none;

}

HTML：

NameValue 1Value 2

John DoeValue 1aValue 2a

当标题可见时,根本没有问题.当标题被隐藏时,这取决于屏幕阅读器是否读取这些标签：

>我想使用屏幕阅读器使用常规导航*时跳过标题行,但使用标题行来通知列标签

>使用ChromeVox,第一个作品(跳过导航),但第二个失败(隐藏的行不用于标记列)

>再次使用ChromeVox,移动隐藏声明为astyle属性而不是类,导致所需的行为工作

>根据博客发表,我发现screen readers somtimes ignore display: none为了说出内容,有时候他们没有 – 所以我不知道我可以依靠这种隐藏来为我的目的可靠(隐藏导航,用于标签)

那么,如何以跨浏览器读取方式实现我所期望的行为？

> AFAIK,屏幕外/ 1px大小的隐藏(如建议here)的问题是,如果我为标题行执行此操作,则所有列标题将始终被读出…