我正在开发一个客户项目，作为弱势群体的资源和支持系统。由于预期的用户，可访问性合规性被吹捧为此网站的绝对最高优先级，因此我们目前正努力尽可能地与WCAG 2.0 Level AA会面。
目前标题中登录/注册链接的代码如下所示：
<div class="profile-summary">
<a class="profile-summary__link" href="/login">Login</a>
or
<a class="profile-summary__link" href="/register">sign up</a>
</div>
另一位正在使用用户管理系统的开发人员想要将登录链接更改为包含提交按钮的表单。像（假设）这样的东西：
<div class="profile-summary">
<form action="/login" method="get">
<button type="submit">Login</button>
</form>
or
<a class="profile-summary__link" href="/register">sign up</a>
</div>
这并不适合我，看起来像屏幕阅读器和其他辅助软件会绊倒（例如，在总结页面时不会读取登录选项）。据我所知，当遇到一个表格时，其中一些会切换到“表格模式”，这种情况在这种情况下会很不稳定。
在此上下文中，在普通链接上使用表单和按钮是否会产生任何不利的可访问性影响？
谢谢！
答案 0 :(得分：4)
在此上下文中，与href="#"的链接正好。
添加表单可能比任何事情都更容易混淆，因为它意味着两个其他类似控件之间会发生不同的事情。没有字段且只有按钮的表单对于许多SR用户来说更加困惑。这可能是比链接更大的问题。
请记住not all screen reader users are blind，所以如果这些控件看起来相同但行为不同也是一个问题。
如果没有看到这两个控件的作用，就很难提供关于哪个元素是正确选择的具体建议。
以下是我处理这个问题的方式......
如果，当点击，点击或通过键盘或语音激活（或在此处插入新颖的互动方法）时，用户将被带到另一个URL（包括同一页面上的锚点），然后使用<a href="[URL]">。确保使用href属性并且它具有真实的URL，而不是“＃”（否则您可能依赖于JavaScript，这对于超链接来说根本不是必需的）。如果href只指向“＃”，那么你可能做错了。如果它指向一个命名锚点作为渐进增强工作的一部分，那么这是完全有效的。
如果，在激活时，用户不会从页面移动（或移动到页面中的锚点），而是显示新视图（消息框，布局更改等），然后使用{ {3}}。虽然您可以使用<input type="button">，但您更有可能与预先存在的样式和后续开发人员（例如我）发生冲突。
如果在激活时，用户输入的信息（通过手动输入或通过选择屏幕上的项目）将被发送回服务器，然后使用<button>。这最好住在<form>。如果您需要更多样式控件或不仅仅需要嵌入简单的文本字符串，请改用<button type="submit">。我倾向于选择<input type="submit">，因为我发现它与开发人员之间的冲突（精神上和风格上）都较少。
想一想键盘用户。按Enter键可以触发超链接。但是按下回车键或空格键可以触发真正的按钮。当超链接具有焦点并且用户按下空格键时，该页面将滚动一个屏幕。如果没有更多要滚动，那么用户只会遇到任何事情。给定一组看起来相同的界面元素，如果某些界面元素使用空格键而某些界面元素没有，那么您不能指望用户对页面的行为有信心。
我有一个CodePen演示，其中显示了这一点：<input type="submit">
我认为值得一提的是，空格键触发的事件仅在释放键时触发，而使用Enter键会在您按下键时（在释放键之前）立即触发事件。