就我而言，将className: "btn btn-default" 之类的内容添加到react-router Link。
像这样：<Link className="btn btn-default" to={linkUrl}>Go!</Link>
会绊倒使用辅助技术查看网站的人吗？
【问题讨论】：
标签： button reactjs hyperlink accessibility react-router
上述 aadrian 和 unobf 提出的观点是准确且表述清楚的。还有一个无法避免的现实迫使开发人员动手。
设计师经常deemphasize one or more actionable element in a group，例如删除按钮，因为它使用频率较低，或者如果使用错误会造成灾难性的后果。 Research 建议使用此策略可以减少灾难性错误。
由于许多经验丰富的专业人士要求markup for the control matches the presentation，开发人员的第一直觉可能是将删除控件标记为链接。
Jaws 等视障人士的辅助技术依赖于单一类型的控件列表。 Surveys 表示这种策略被视障人士相当频繁地使用。
考虑到这些可访问性现实，将操作列表标记为带有一个或多个操作链接的按钮是一种非常糟糕的做法，例如删除。视障用户可能不会将链接与按钮相关联，并且可能会完全错过链接。
这个现实本质上是迫使开发人员动手。如果设计要求在按钮列表中删除链接，则开发人员必须将链接标记为按钮，即使键盘导航无法完美对齐有视力的用户。
【讨论】：
tl;dr 最佳实践是让事情看起来像他们在行动，但你可能没有那么奢侈，那么现在该元素应该扮演什么角色？
您应该设置链接和按钮的样式和角色，以便它们与用户交流。这是一般的良好可用性实践。
但是，这只适用于品牌和营销人员没有任何发言权的世界。您是否听过这样的论点：“我们需要使该链接更加突出，以便访问者更多地点击它......”这就是链接开始变成这些怪物的地方，这些怪物不再通过它们的外观和行为来识别。
所以现在您偶然发现了关于可访问性的重大争论之一：某物应该具有与其行为方式相匹配的角色，还是应该具有与其外观相匹配的角色？
链接是将浏览器引导到另一个位置（另一个页面或同一页面上的另一个位置）的元素。这就是它的设计方式。
另一方面，按钮旨在与页面交互或提交数据。
复杂之处在于，当您有一个看起来像按钮的链接并且盲人用户打电话支持并且支持人员说“单击 X 按钮”并且屏幕阅读器宣布 Y 链接时（因为该按钮的替代文本是错误），那么盲人用户会非常沮丧，因为他们既找不到按钮也找不到与 X 匹配的东西。
但是，如果您尝试以正确的方式实现可访问性，并且您的链接文本与元素的可见信息相匹配，那么 IMO 您应该始终在元素上拥有与其行为方式相匹配的角色。
在您的具体示例中，使用像 Dragon 这样的语音识别系统的人在点击链接时会遇到困难，因为他们可能使用“按钮”之类的命令来列出所有按钮而看不到他们期望的元素。然后，该用户必须猜测它实际上是一个链接，或者使用鼠标定位与元素进行交互。
【讨论】：
关于何时使用<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 键将在您按下键时触发事件（在释放之前）。
因此，使用上面的列表从任务的正确元素开始，然后将其设置为您想要的样式。
【讨论】：