导航中的按钮而不是锚点?

问题描述 投票:2回答:4

我一直在阅读网页辅助功能,并且只有在用户被带到没有JavaScript的其他网址时才会使用锚标签。但是,只要发生其他行为,就应该使用按钮,例如打开模态。

所以我想知道是否可以或预期在导航中都有按钮和锚点。像这样的东西:

<nav>
  <a href="/">Home Page</a>
  <a href="/about">About Page</a>
  <button>Sign Up</button>
</nav>

假设在这种情况下,注册按钮启动模态或执行一些其他行为,这些行为不会将用户带到其他URL。可以在nav中同时使用它们吗?我并不关心造型,我会让这些看起来一致,但我想知道处理这样的事情最正确的方法是什么?

html hyperlink accessibility semantic-markup htmlbutton
4个回答
3
投票

从可访问性的角度来看,使用链接和按钮是语义上正确的方法。链接将您带到另一个页面(或当前页面上的其他位置),按钮执行操作。屏幕阅读器用户将理解他们在同一<nav>中听到“链接”或“按钮”时会发生不同的操作。


1
投票

是的,在导航栏中使用按钮,锚点或甚至div都是完全没问题,但是你想要它可以做到。你只需要习惯使用css和造型就可以了。那你应该没问题。这是否回答你的问题?


1
投票

flow content标签中允许使用任何nav元素,其中包括按钮。


0
投票

正如之前评论中所提到的,是的,在导航中使用它们都是完全正确的。

如果你真的想要,你可以使用<a>元素,但对于按钮,你将包括role="button"属性,它在语义上等同于使用<button>

<nav>
  <a href="/">Home Page</a>
  <a href="/about">About Page</a>
  <a role="button">Sign Up</a>
</nav>
© www.soinside.com 2019 - 2024. All rights reserved.