Button 将链接样式设置为按钮是一种不好的可访问性做法吗?

Button 将链接样式设置为按钮是一种不好的可访问性做法吗?,button,reactjs,hyperlink,accessibility,react-router,Button,Reactjs,Hyperlink,Accessibility,React Router,在我的例子中,将类似于className:“btn btn default”的内容添加到react路由器链接 像这样:Go 使用辅助技术浏览网站的人会被绊倒吗?一些关于何时使用的一般提示) 如果用户正在更改当前页面上的状态,请使用() 如果用户正在提交表单,请使用或() 我警告不要更改具有role属性的元素的默认角色,因为这最终可能会导致某些辅助技术的混乱和潜在冲突。这些也违反了ARIA的使用规则 还可以考虑键盘体验。按enter键可以触发超链接()。但按下回车键或空格键可以触发真正的。当超链

在我的例子中,将类似于
className:“btn btn default”
的内容添加到
react路由器
链接

像这样:
Go


使用辅助技术浏览网站的人会被绊倒吗?

一些关于何时使用
的一般提示)
  • 如果用户正在更改当前页面上的状态,请使用
    ()
  • 如果用户正在提交表单,请使用
    ()
  • 我警告不要更改具有
    role
    属性的元素的默认角色,因为这最终可能会导致某些辅助技术的混乱和潜在冲突。这些也违反了ARIA的使用规则

    还可以考虑键盘体验。按enter键可以触发超链接(
    )。但按下回车键或空格键可以触发真正的
    。当超链接具有焦点且用户按下空格键时,页面将滚动一屏。一些辅助技术的用户会期望基于所使用元素的行为

    我认为还值得一提的是,空格键触发的事件只有在按键释放时才会触发,而使用Enter键会在按下按键(在释放之前)后立即触发事件


    因此,使用上面的列表从任务的正确元素开始,然后将其样式设置为您想要的样子。

    tl;dr的最佳实践是让事情看起来像他们在行动,但你可能没有奢侈,那么现在元素应该扮演什么角色呢

    您应该设置链接和按钮的样式和角色,以便它们将此信息传达给用户。这是一般的良好可用性实践

    然而,这只适用于品牌和营销人员没有发言权的世界。你有没有听过这样的观点:“我们需要让这个链接更加突出,让访问者点击它更多……”这就是链接开始变成这些怪物的地方,不再能通过它们的外观和行为来识别

    因此,现在您偶然发现了一个关于可访问性的大辩论:某个东西应该具有与其行为相匹配的角色,还是应该具有与其外观相匹配的角色

    链接是将浏览器指向另一位置(另一页或同一页上的另一位置)的元素。这就是它的设计

    另一方面,按钮设计用于与页面交互或提交数据

    复杂的是,当你有一个看起来像按钮的链接,一个盲人用户呼叫支持,支持人员说“单击X按钮”,屏幕阅读器宣布Y链接(因为按钮的文本替代项是错误的),然后盲人用户会非常沮丧,因为他们既找不到按钮也找不到与X匹配的东西

    但是,如果您试图以正确的方式实现可访问性,并且您的链接文本与元素的可见信息相匹配,那么在我看来,您应该始终在元素上拥有一个与其行为方式相匹配的角色


    在您的特定示例中,使用语音识别系统(如Dragon)的人很难单击链接,因为他们可能会使用类似“按钮”的命令列出所有按钮,而看不到他们期望的元素。然后,该用户必须猜测它实际上是一个链接,或者使用鼠标定位与元素交互。

    以上aadrian和unobf提出的观点是准确的,并且陈述得很好。还有另一个无法避免的现实迫使开发人员采取行动

    设计人员经常使用删除按钮,例如,因为它使用频率较低,如果使用错误,则会导致灾难性后果。建议使用此策略可以减少灾难性错误

    由于许多经验丰富的专业人员要求删除,开发人员的第一反应可能是将delete控件标记为链接

    针对视力受损者的辅助技术(如Jaws)依赖于单一类型的控制列表。表明视力受损者经常使用这种策略

    考虑到这些可访问性现实,将操作列表标记为带有一个或多个操作链接(如删除)的按钮是一种非常糟糕的做法。视障用户可能不会将链接与按钮关联,并且可能会完全错过链接


    这一现实本质上迫使开发人员采取行动。如果设计需要按钮列表中的删除链接,开发人员必须将该链接标记为按钮,即使对于视力正常的用户,键盘导航不会完全对齐。

    我同意所有这一切,但最后一句可能除外。正如您所指出的,按下按钮的预期行为通常不是页面导航,因此,通过使用锚并将其样式设置为按钮,您可能最终会让不依赖辅助技术的用户感到困惑(取决于按钮上的文本).屏幕阅读器的用户不会被混淆,因为视觉风格不会被传达。可以看到但移动能力受损的用户通常不会被混淆,因为状态栏显示它是锚。虽然我同意你的观点,不喜欢将链接设计成按钮的样式,反之亦然,但这总比使用错误的元素要好。这可能会给不使用点击设备的有视力的用户带来问题。如果他们在浏览,他们可能会认为它的行为像一个按钮,尽管我不能想象他们会感到困惑。我们不应该假设一个有视力的用户可以看到状态栏。使用屏幕放大镜可能会模糊这些信息,从而无法知道“按钮”将要导航到其他地方。