- 原文地址：Buttons vs. Links, No, they are not the same.
- 原文作者：Eric Eggert
- 译文出自：掘金翻译计划
是有些超链接看起来像按钮，还是有些按钮看起来像超链接？Twitter 本周对此进行了激烈的讨论。让我们看看这两种页面元素分别是什么，他们的功能是什么，在页面上是什么样的。
什么是超链接
超链接通常是链接到另一个页面的一种交互元素，比如，点击这个超链接去跳转到 Knowbility 官网。它还会有一些额外的功能，比如在一个“frame set”中指向不同的 frame 或者下载一个文件。
从本质上讲，超链接改变了浏览器所指向的内容，然后以网页或文件的形式呈现在浏览器中。如果浏览器不能打开文件，它将会被下载到本地。
当你鼠标右键点击菜单时，超链接还会给你提供一些额外选项：在新标签中打开页面，链接另存为，复制链接地址等。当你把鼠标浮在超链接上，你会在浏览器状态栏看到超链接的地址。
此外，有一些超链接会跳转到当前页面的不同锚点，如导航到页面底部！
什么是按钮
按钮会触发一个动作。之前，当他们作为 <input> 元素的变种被页面引入时，它们的作用是提交表单。至今仍然有效。此后，HTML 引入了 <button> 元素，允许在表单外使用更多功能的按钮。
虽然现在你可以在表单提交后进行重定向，但在之前，提交成功后网页会依然停留在同一个页面，展示一个成功的提示。有了 <button> 元素，按钮可以作用于整个站点而不是引导用户去其他地方。
网页上加个计算器？可以使用按钮。展开导航？可以使用按钮。展示隐藏模块？还可以使用按钮、基本上，按钮总是在表单或者 JavaScript 中使用。没有了 JavaScript，按钮的用处将会很受限。
超链接和按钮之间的不同
首先，它们有不同的定位，所以辅助技术对它们的定义也不同。超链接（非常准确地）被称为“超链接”，按钮（你或许已经猜到了）被称为“按钮”。
不同的角色意味着不同的用户体验。并不是说 超链接只是跳转到一个地方，按钮只是触发了一个行为，它们还有特殊的互动行为：
- 只按返回键可以出发超链接
- 按钮可以被返回键 或 空格键激活
- 屏幕阅读器可以列出页面中所有的超链接。而按钮不会这么轻易地列出来
- 按钮使用正常的鼠标指针箭头，然而超链接使用的是手指指针箭头
作为一名程序员，最重要的是了解并且拥抱这种差异，这样你才能更好地满足用户的期望。
超链接和按钮的样式
同样的规则也适用于超链接和按钮的样式。用户通常期望
- 带下划线的文字可以跳转到别的页面
- 直角或圆角矩形中的文字可以触发一些操作
也就是说，在网页上这两者的区别远没有桌面操作系统端大。CSS 的魔力使得每个元素看起来像模糊了线条一样差不多。
Call-to-action links（CTAs）通常有一个按钮状的形状。与此同时，我们会有一些超链接，这些超链接看起来和导航栏的文本或者标签中的文本完全不同。
这通常不是一个问题，因为文本可以帮助用户去分辨执行的操作。在一个运营推广页面，如果有一个胶囊形状的按钮上面写着点我阅读全文，人们就不会对这个按钮的行为产生困惑。
想象一个按钮如果样式看起来像超链接，但是它有一个铅笔的图标配有“编辑”的文字。当用户触发了内联的编辑模式，他们并不会感到惊讶，因为他们知道内联编辑模式不会引导他们去另一个页面编辑。
结论
按钮和超链接的功能是不同的，但是他们的样式可以看起来类似。选用合适的元素去实现功能，并记住 超链接用于跳转 而 按钮用于行为。
如果你将它们的样式写的很相似，确保它们在页面中的功能是清晰的。你可以添加其他的线索来区分：
- 如果你的按钮是圆形的，那么你的超链接应该是胶囊形状的；或者反过来
- 使用图标。超链接上向右指向的箭头是一个很好的指示，“这会跳转到一个地方”
- 在超链接或按钮的文本上使用更有意义的描述。“下载文档”，“提交表单”，“保存程序”，“阅读文章”这些文案与超链接或按钮的形状相比，可能对用户是更有用的
你应该关心它们的不同
针对一些特殊领域，这两种元素在使用上并没有什么不同。用超链接去模拟按钮，或者用按钮去进行重定向操作都是可以的。但如果你比较依赖这些元素，比如视障用户或者语音输入用户，这些元素的可靠性就显得十分关键。
如果你键盘上的 “e” 键占用你平时工作 90% 的时间，那可真是令人气愤。用户界面的可靠性和信任对于用户轻松浏览内容和应用程序显得非常重要。如果你使用了正确的元素，你将会帮助到用户。
也就是说，由于网络的复杂多样的历史，在某些情况下，没有一种真正的编码或设计方法。设计、开发环境、方法和偏好可能不同。在我会使用按钮并以这种方式设置样式的地方，其他用户可能会使用链接。这完全没问题。
感谢 Hidde，Erik 和 Nic，他们在我的创作中提醒了一些我忘记的点。还要感谢每一位通过推特分享他们意见和经验的人。这是我们学习的方式。最后，我提一下 Mary Sutton 的演讲 The Links vs. Buttons Showdown，她和我有类似的结论。感谢 Carolyn 在推特里面提醒了我。
