难以设置一个按钮样式的链接吗？

Question

在我的情况下，在react-routerLink之后添加类似className: "btn btn-default"的内容。

像这样：<Link className="btn btn-default" to={linkUrl}>Go!</Link>

塔会绊倒谁使用辅助技术来查看网站的人吗？

Answer 1

何时使用<a href>与一个<button>或<input type="submit">的一般提示：

• 如果用户要一个新的页面（或锚在页面上），使用<a href>（spec）。
• 如果用户正在更改当前页面的状态，请使用<button>（spec）。
• 如果用户提交一个表单，使用<input type="submit">或<button type="submit">（spec）。

我告诫不要更改与role属性的元素的默认角色，因为这最终会导致一些辅助技术一些混乱和潜在的冲突。这些也违反了ARIA使用规则的first和second规则。

请考虑键盘体验。超级链接（<a href>）可以通过按回车键启动。但是按下回车键或空格键可以触发真实的<button>。当超链接具有焦点并且用户按下空格键时，页面将滚动一个屏幕。一些辅助技术的用户会期望基于使用的元素的行为。

我认为值得一提的是，当释放按键时，由空格键触发的事件只会触发，而使用Enter键会在您按下按键（释放按键之前）时立即触发事件。

因此，与使用上述列表中的任务权元素开始，那么它的样式但是你想看看。

Answer 2

TL;博士最好的做法是让事情看起来像他们的行为，但你可能不拥有的奢侈品，所以现在应该元素有什么作用？

您应该设计风格并扮演您的链接和按钮，以便将其传达给用户。这是一个很好的可用性实践。

但是，这只适用于品牌和营销人员没有发言权的世界。你有没有听过这样的论点：“我们需要让这个链接更加突出，让访问者更多地点击它......”这就是链接开始变成这些怪物的地方，这些怪物已经不再被它们的外观和行为所识别。

所以，现在你无意中发现了无障碍的大辩论的一个：应该有一些符合它的行为，还是应该有一个与之匹配的外观的角色的角色？

的链接是指导浏览器到另一个位置（或者其他网页，或在同一页上的另一个位置）的元件。这是它的设计。

另一方面，按钮被设计为与页面交互或提交数据。

复杂性是，当你有一个看起来像一个按钮和盲人用户手机支持的链接，并且支持人员说“单击X按钮”并且屏幕阅读器宣布Y链接（因为按钮的文本替代方案是错误的），那么盲人用户会非常沮丧，因为他们既找不到按钮，也找不到与X匹配的东西。

但是，如果您尝试以正确的方式执行辅助功能，并且您的链接文本与元素，那么国际海事组织，你应该始终在与它的行为方式相匹配的元素上扮演角色。

在你的具体的例子，一个人在使用语音识别系统，如龙恐难点击该链接，因为它们可能会使用如下命令“按钮”，列出所有的按钮，而不是看到他们期待的元素。然后这个用户必须猜测它实际上是一个链接，或者使用鼠标定位与元素进行交互。上述

Answer 3

通过aadrian和unobf提出的点是准确和良好说明。还有另一个无法避免的现实迫使开发者的手。

设计师经常deemphasize one or more actionable element in a group，例如删除按钮，因为它是用来较不频繁或灾难性如果在错误使用。使用这种策略可以减少灾难性错误。

由于许多经验丰富的专业人士要求的markup for the control matches the presentation，开发商的第一反应可能是标记删除控制为纽带。

为视障如颌辅助技术依赖于单一类型的控制列表。 Surveys表明该策略被视觉障碍者相当频繁地利用。

考虑到这些现实的可访问性，这是一个非常不好的做法来标记的行动为一些按钮与一个或多个环节的操作，如删除列表。视力受损的用户可能不会将链接与按钮相关联，并可能完全错过链接。

这个现实基本上迫使开发者手中。如果设计需要在按钮列表中调用删除链接，则开发人员必须将该链接标记为按钮，即使键盘导航不能完美地针对有视力的用户进行对齐。