原文出处：https://blog.bitsrc.io/do-your-buttons-lead-or-mislead-your-users-d5d83531238b
按钮是UI/UX最关键的组件之一，在不同设备及平台上得到了广泛的应用。它们具有影响用户行为和体验的能力。假如按钮设计不合理，会令用户产生误解及障碍。按钮设计的目的是引导用户完成我们在交互系统中预置的用户流程得以完成，但糟糕的按钮设计则可能会是你丢失你的用户。那么，现在是时候来研究该如何设计你的按钮了！所以今天我们不聊开发相关的知识，我们来看看这个在界面中小小并且重要的元素它的设计思路是怎样的吧。
1. 按钮要设计的让用户不假思索：当用户同时看到好几个按钮，并且按钮的意义没有清晰地表述给用户，用户就会被你的“按钮阵”所误导，从而达不到预期的效果。所以具有清晰而合理的按钮层次结构，能促进用户能够直观、即时地分辨出你设计按钮的作用是什么。下面我们来看看影响按钮层次结构的3个方面：
按钮类型我们先来介绍一下常用的4种类型按钮：
l 立体按钮：一个具有立体效果的按钮，使它引人注目。
l 平面按钮：没有任何花哨效果的常规平面按钮。
l 幽灵按钮：就像它的名字一样，幽灵按钮通常是透明的(没有背景色填充，和背景是融为一体的)，唯一的区别是这个按钮有一个边框勾勒出按钮的轮廓。
l 文本按钮：仅由文本组成的按钮
一般，这几种按钮类型在同一界面中可以以下顺序确定视觉上的主次程度：
立体按钮 > 平面按钮 > 幽灵按钮 > 文本按钮
选择哪种按钮的核心在于根据不同厂家和用户需求来确定类型，以便能够更好的引导用户。例如：
使用立体按钮或平面按钮突出显示主按钮，次要按钮则尽量使用幽灵按钮或文本按钮以突出页面中不同的层次结构。上图中的“免费注册”是主要按钮，因为引导用户注册是这个页面最重要的任务。
相似的按钮一般外观类似的按钮可以看作是同一层次的按钮，这是因为具有类似视觉特征的元素会被认为更相关。以不同的按钮类型实现不同功能，以降低用户的理解成本，才不会误导用户，例如：
如上图，右侧的“UPDATE”按钮和“more”按钮具有不同的视觉特征，用户能够很好的将它们区分开。
显然，从“Home”按钮到“More”按钮的视觉类型是相同的，处于相同的层级，“Tweet”按钮属于更高层级中的类型。
邻近的按钮彼此紧密排列的元素往往更相关。邻近有助于你能进一步组织相似的按钮从而为用户带来相同的功能。所以邻近的重要性就像单词之间的空格和段落之间的回车一样重要。正确运用这一原则，对引导用户产生积极的影响。
在按钮之间添加空行以将其分为几种类型。放在一起的按钮会让人从视觉上就任务具有类似的功能。
“More”按钮和“Settings”按钮之间的空格巧妙的将按钮分为了两组，这表明从“All”到“More”是搜索结果的分类，而“Settings”和“Tools”按钮具有其他的作用。
2. 让按钮再醒目一点：