屏幕阅读器不解释标签导航?

时间:2014-03-13 20:27:06

标签: javascript html kendo-ui accessibility screen-readers

我有一个弹出式窗口,我通过tabindex=0启用了制表位。当我在没有屏幕阅读器的情况下与页面交互时,我可以使用tab键在窗口和它包含的表单元素之间移动。

当我使用我的屏幕阅读器客户端(Window Eyes 8.4)查看我的网站时,我无法一直显示在窗口中。

我是否应该考虑使用代码结构的特殊情况导致窗口失去焦点或阻止屏幕阅读器解释弹出窗口的标记?

供参考 - 我在ASP .NET MVC4网页应用程序(页面是HTML / CSS / JS)中,使用Kendo UI [Kendo]窗口生成弹出窗口。

2 个答案:

答案 0 :(得分:0)

03/17更新 - 屏幕阅读器会间歇性地弹出弹出窗口作为对话框,但弹出窗口加载后,我偶尔可以选择进入div并且焦点不会丢失。我无法一致地重现这一点,只有在按下按钮后快速按Tab键才能显示弹出窗口。

另一方面(当没有快速击中标签键时),焦点始终落在弹出窗口而没有焦点轮廓(屏幕阅读器宣布“Foo对话框”),但在第一个标签按键时,焦点跳回到页脚之前的最后一个可操作元素的底层页面。此时按Tab键将我移动到页脚UL元素。

答案 1 :(得分:0)

没有演示很难回答,但有几个方面需要研究。

我在the accessibility requirements for a content based pop-up上做了一个页面,即一个不是表单的页面。这还包括如何管理焦点的代码。

如果弹出窗口基本上是基于表单的,您可能需要尝试this one on dialogue boxes

您可以从这些示例中看到,将tabindex添加到容器只是其中的一部分,您还应该管理焦点,以便将焦点移动到弹出窗口。

该问题的零星性质可能是因为屏幕阅读器通常不会阅读display:none的内容,并且标签显示可能无法可靠激活的内容。

如果您可以发布示例,我可以更新此答案。