【问题标题】：Why are button's discouraged from navigation?为什么不鼓励按钮导航？
【发布时间】：2015-09-05 08:18:29
【问题描述】：

这可能是一个固执己见的问题，但我环顾网络，似乎网络开发人员喜欢将<a> 标签设置为看起来像按钮，而不是使用特定的<button> 标签。我在查看导航时明显看到了这一点

经过一番研究，我发现了这个：

按钮不适合搜索，因为其中的文本对搜索引擎不可见。

按钮比链接更难更新，每次更新都需要 Photoshop 和新图像。

按钮加载速度比链接慢，这对移动访问者尤其不利。

视觉障碍者不太容易使用按钮。

按钮是不必要的，即使您想使用非标准字体，这要归功于 TypeKit 等工具。 ~ 引用自here

但是，这些“原因”中的大多数似乎都非常站不住脚，并且“您需要 photoshop”之类的答案似乎……嗯……无效？

所以我想知道：

在创建导航菜单时不使用<button> 标记，而是将<a> 标记设置为看起来像按钮，是否有实际原因？ 为什么按钮不是常态？这不是他们的目的吗？

^{* 我不希望你在这里发表意见，也不希望有观点。仅关于为什么会这样的事实信息}

【问题讨论】：

When to Use Button
@Paulie_D：为链接欢呼。我知道这是临界点，但我有问题，但不知道答案。只是样式链接 like 按钮的导航数量确实让我感到困惑，因此我想看看开发人员不使用它们是否有“事实原因”。
还有w3c says:"如果a元素有href属性，那么它代表一个超链接（超文本锚点）。如果a元素没有href属性，那么该元素代表一个占位符，用于放置一个链接，如果它是相关的。”。另一方面，按钮不代表超链接。由于导航显然由超链接组成，而不仅仅是 GUI 元素，a-elements 将是您的选择。
@UsmanArshad 感谢您的链接。我想我开始明白什么时候用一个，什么时候用另一个。 doSomethingforme 和 takemesomewhere 之间似乎有明显的区别。

标签： html css navigation

【解决方案1】：

在阅读了 cmets 中发布的多个文档后，似乎确实有一个明确的事实原因，导航栏中没有使用按钮。

锚标记

当存在页面重定向或将用户带到网站的其他位置时使用这些。

如果它导航，它就是一个链接。使用具有有效超文本引用的链接标记

~Links are not buttons

按钮元素

当您想要doSomething() 即不重定向用户时使用这些。 IE。提交表单/等。

你需要问自己的问题是：

此控件是否用于启动即时操作或该操作是否导航到另一个页面？

如果您的问题的答案是第一部分，那么您应该使用button 元素。而如果您希望是后者，那么您应该使用a 元素。

进一步阅读：

【讨论】：