没有一种设计是简单的，包括一个按钮。
如何为企业网站设计按钮呢？我们编写了如下指南。
 

大胆和明亮

在过去，按钮通常□□□是灰色或□□□□其他一些□□□□暗淡的颜□□色。但渐渐地，设计师和□□□□商人们理★解了特定□□□设计和概□□□念背后的丨含义。所以，设计必须❖是粗体和★明亮的格□□式。没有必要□□让每个主□□□题都有粗□□□□体和明亮□□颜色的按✦钮。但是，它必须让□□□用户想要○点击按钮。
设计明亮□□□按钮的动□□□□机是为了□□让用户更□□□□容易注意□□□到它们。明亮的颜□□□色往往会□□吸引人的□□□□眼睛，使人们容◇易发现。关于按钮□□的颜色，设计师需□□要进行实□□验和测试，例如，可以通过□□□改变饱和□□□□度因子来□□□□改变按钮□□□□的颜色。这可能会□□□导致转化●率和点击□□□率的增加□□□□或减少。

面积大一些

许多设计•师忽略了□□□使用大按●钮这一原□□□□则。他们没有□□□□理解大按□□钮会吸引□□用户的大□□□量注意力。在过去，设计师并□□不了解所✦有的营销□□□□理念。但如今，设计师们◎对市场营◎销及其对✦业务的影□□□响有了充□□□□分的了解。因此，他们相应□□□□地设计控□□□件和网站□□□的其余部□□□分。
此外，当使用动□□作调用按□□□钮时，它们应该□□总是足够✦大，以迫使用●户采取一□□些动作。如果按钮□□□□很大，它会让更◣多人注意□□□□到它。

颜色和主题匹配

当我们谈□□□到颜色主□□□□题时，它并不局□□□□限于网站□□□□布局和它□□□□的颜色。但是颜色□□主题还包□□括按钮和☆其他用户□□□交互元素□□和组件。以前的设□□□计使用UI元素的颜□□色，包括按钮，类似于元□□□□素的其他□□□□颜色。但是现在，按钮总是◉用颜色对□□比来设计，以吸引用□□户和访问◆者的注意•力。
例如，如果你在□□□□整个网站□□□□上都有蓝□□色的主题，那么在整□□□个网站上▲都有一个◢黑色的按□□□钮是不现○实的。此外，它会获得◇错误的关□□注，可能会显□□□□得尴尬。在这种情□□□况下，设计往往·会在视觉▽吸引力上□□□□产生冲突。

颜色和主题对比

另一种理□□□□论是使用□□按钮的颜□□□色来与网□□□□站的主题□□□□形成对比。如果你使★用白色作□□□□为网站的□□□□主要背景，那么不要◥选择浅灰□□色或奶油□□□□色的按钮。相反，使用大胆□□□□的颜色，如黑色或□□□□蓝色，以突出白▲色。
对比是最□□□□强大的因□□□素，让用户注□□□意到哪里▼应用了对□□比。这也适用□□于您放在□□按钮上的□□□□文本。如果按钮□□□颜色是灰□□□□色的，那么应该□□□使用黑色✦的按钮标☆题。但是如果□□□□蓝色的按□□钮，使用白色□□的按钮标□□题而不是□□□□黑色。

注意细节

在设计大□□□的东西时，注意小的□□□细节总是□□明智的。这些微小□□的细节使□□□□你的设计◇伟大和反●响良好。这也适用□□□于网站按□□□钮。有人会说，这是一个□□□很小的元□□素，但却有很♦大的意义。因此，当您注意·详细描述•按钮及其□□用途时，您可以使□□您的按钮□□□□看起来很□□□有趣。一个小的▲渐变因子□□□□引入了三□□维造型，良好的灯□□□光效果可□□□□以改变按□□钮在网站□□□上的显示□□方式。

别忽视了按钮状态

在设计按□□□钮时，当对按钮□□□□执行不同☆的操作时，很明显会□□□忘记或忽□□略按钮状▼态。大致上，按钮可以□□□□有活动、禁用、聚焦、悬停和选丨定状态。

按钮设计一致性

当你设计□□一个网站□□并谈论你□□□□的品牌时，你不仅应□□该与内容●的基调或□□□□网站的颜□□□色主题保◈持一致。但是在设□□计包括按◈钮在内的□□网站UI元素时，也应该保○持一致性。
按钮也可□□以根据按□□钮背后的□□用途进行□□□分类。例如，取消、停止和确□□认按钮应□□□该是不同□□的颜色。就像你可□□以把取消□□□□按钮用红□□□色，但确认用□□□□绿色或蓝□□□□色。
另一方面，按钮形状▽也会随着□□□□功能的变□□□□化而变化。例如，表单上的□□□□按钮不同□□于导航菜□□□单上的按□□□□钮。一旦你确□□□□定了所有□□的按钮和□□□□它们的颜□□色和功能□□的用途，应该记录□□他们。

保持按钮的大小和宽度

当用户通◢过移动设◉备浏览网□□□站时，如果一个□□□按钮距离□□拇指很远，那么拇指□□□□可能无法□□□□触及按钮。对于小按□□□钮，用较大的□□拇指或其◇他手指来□□点击或轻□□□□击屏幕上□□□的按钮会□□□□变得很困□□难。不正确定丨义的对比□□度会让用□□□户很难找□□到按钮。