屏幕阅读器用户(何时)使用选项卡



TIL,屏幕阅读器用户很少使用选项卡导航网页,而是使用屏幕阅读器软件中的特定键盘快捷键(例如VoiceOver中的CTRL+OPTION+箭头键)。这意味着优化选项卡导航并不总是有意义的。

然而,我看到一些网页将tabindex="-1"添加到它们的标题元素中,或者添加到由于overflow: scroll而无法直接查看的元素中。

所以我的问题是:什么时候优化选项卡导航有意义,什么时候没有意义?

例如,在我们当前的用例中,我们创建了一个问卷,基本上显示了一个问题(h2元素),该问题可以用2-5个答案(button元素)来回答。单击答案将进入下一个问题的新页面。激活VoiceOver时,最好将问题元素设置为tabindex="-1",并在打开问题时自动聚焦。但以上的学习似乎对这一点提出了一些挑战。

谢谢你的帮助!

因此,首先您会混淆选项卡和焦点。虽然屏幕阅读器用户可以使用箭头键导航,但他们也可以调出页面上的链接列表,或表单、区域、表格或(最常见的)标题,以便导航到他们感兴趣的部分/了解页面布局。

制表是有用的,因为有很多人不能、挣扎或不喜欢使用鼠标,但由于准确性问题,他们不需要屏幕阅读器的帮助,即脑瘫。

希望这能帮你解决问题。

至于将输入自动聚焦在多页表单上,这更像是一个用户体验问题。。。如果您自动聚焦表单,是否对所有用户都有良好的用户体验?

我会说是的,如果99%的人需要这样做,那么要求人们点击、标记或使用快捷方式来获取输入是不好的用户体验。

注意,我说的是<input>,而不是标题。

你想做的是研究如何在流程的第一页上表明这是一个多页多步骤的表单。

你还应该考虑把复选框作为第一步,上面写着";这个表单是多页的,你希望我们在加载新页面时自动聚焦第一个问题吗;并将其默认为选中。

这样,如果有人愿意,可以选择停止自动对焦。

此外(或者作为一种选择,如果您不想要复选框),您可以考虑在提交按钮附近添加一些文本(并将其与aria-labelledby和ID正确关联),以解释下一步加载新页面,第一个输入将自动聚焦。

另一件事是,假设你已经正确地为页面命名(表单名称或流程-第2步,共5步),那么屏幕阅读器用户可以很容易地确保它们在正确的页面上。

因此,如果这是一个多页表单,而不是标题级别1,请关注输入。

在导航后聚焦标题是单页应用程序(SPAs)的一个技巧,所以你可能已经看到了这一点,如果你通过AJAX加载页面内容,那么这是处理导航的推荐方法之一。您指示下一页";负载";这让我觉得这是一个多页应用程序,但我想我最好添加它,以防万一,作为一个一般提示。

请记住,所有这些建议都是一般性的。根据您的形式、网站设计、加载模式、用户基础(经验丰富的用户/内部系统与普通公众)等,最佳实践可能会有所不同。

所以长答案短-如果这是一个多步骤的表格,并且你认为输入将是下一个需要填写的内容,那么使用自动对焦输入

然后与使用屏幕阅读器的人一起测试,并获得关于它是否有意义、是否令人困惑或意外的反馈。

您混淆了屏幕阅读器用户

键盘用户患有阅读障碍但视力正常的人可能会使用屏幕阅读器,这样他们就可以大声听到文本,而不是自己努力阅读,但由于他们使用鼠标或触摸界面,所以他们不是键盘用户。

使用手有困难但视力正常的人可能无法使用鼠标或触摸界面。他们不需要屏幕阅读器,而是只使用键盘,或者可能使用其他特定的输入设备来模仿键盘中最重要的键(特别是制表符、箭头键、回车键和转义键)。某种形式的操纵杆可以是这样的设备。

考虑到上面所说的,设计一个合适的键盘导航并对其进行优化总是有意义的。它可能对一些屏幕阅读器用户没有重要用处,但对键盘用户来说非常重要,因为这可能是他们与应用程序/页面交互的唯一方式。

我是一名屏幕阅读器用户。与其他人一样,我认为对输入焦点的困惑与结构和上下文关注有关。关于何时"优化"TAB体验的第一个问题。它总是很重要的,因为键盘导航是我的工具箱中作为屏幕阅读器用户使用的支柱。此外,任何基于输入的非屏幕阅读器访问工具都可能使用这种访问方式。

作为一名开发人员,我一直给其他人留下深刻印象的一条准则是,你希望代码的自然结构和流为你完成大部分工作。其次,这个过程应该遵循目标受众的期望,而且你似乎想遵循"巫师"的风格。因此,让我详细说明一下在使用屏幕阅读器时对向导式问卷流的典型期望。

用户体验点:页面重新加载是完全改变还是动态改变?

这很重要,因为这对我当前的读者"光标"以及我将如何导航找到问题有直接影响。

根据以上陈述,我认为H2将被一致使用。因此,我自然会使用快速导航来转到第一个H2。

现在,我将使用屏幕阅读器工具来阅读问题(无论是TTS还是盲文输出)。

一旦我觉得我有了它的意义,我通常会使用TAB来找到第一个输入控件。按钮不是输入控件,因此违反了用户的期望。我正在查找复选框、单选框、文本字段和/或组合框。

如果勾选或单选框,那么我假设一个小组并希望分组(遗憾的是,很少出现),并将使用策略来处理我发现的情况。如果分组,那么我经常使用TAB来快速移动,并听到以输入为中心的特定框的"上下文"。

最后,一旦我回答了这个问题,我就在寻找下一个问题或前一个机制。这些通常显示为按钮。

希望我能展示如何使用基本结构构建约定/期望,而不是试图将过程强加给用户。第三,像a11y项目这样的网站在编码方面非常有帮助。

最新更新