呼吁关注：CTA按钮上的UI设计技巧
web
数字产品的有效交互系统由具有其任务和功能的小元素组成。为了建立足够的系统，关注所有细节至关重要。
按钮是用户界面的核心交互组件，它对用户体验以及网站和应用程序的转换方面发挥着重要的作用。UI按钮根据其功能而有所不同，可以分为不同的类型。这篇文章呼吁大家关注：（CTA）按钮上的UI设计技巧，里面涵盖了他们的本质。在直观导航中的作用以及业务目标的重要性。让我们看看是什么让CTA按钮脱颖而出，从中学习最好的做法。
应用
什么是CTA按钮，为什么它很重要？
号召性用语（CTA）按钮是web网络和移动用户界面的互动元素：其主要目标是诱使用户采取某些操作，为特定页面或屏幕提供转换，例如购买，联系，订阅等。
传统上，CTA按钮很容易被注意到。设计师故意以这种方式创建它们，以至于人们忍不住点击它。这就是为什么他们按钮通常是大胆的，其中包含特定的号召性用语（例如“了解更多”或“立即购买”），它鼓励我们推动它。
潜在客户的生成和购买是可以创建号召性行动的基本业务目标。当一个按钮设计足够吸引潜在客户的注意力时，它可以吸引他们点击并进入下一个阶段，比如填写一个简短的联系表单或进行预定的一个产品。
登陆页面
这样一来，网站访问者和应用程序用户可以通过销售渠道从一个阶段引导到另一个阶段，帮助他们了解有关产品或服务的详细信息。即使是专业制作的内容也可能无法保证用户的高度参与。如果没有CTA按钮，人们更有可能快速扫描内容，只留下内容，没有任何操作。
有些人可能认为足够的号召性按钮设计仅适用于大尺寸和鲜艳的颜色，以实现其所有目标。不过，CTA的有效性还有很多方面。让我们看看他们是什么？以及他们适当使用的实际例子。
应用
尺寸
大小是帮助按照其重要性划分UI组件的最常用工具之一。元素越大，它变得越明显。由于CTA的先前目标是吸引用户的注意力，因此设计师通常会试图让它们在屏幕上相比其他按钮中脱颖而出，尤其是通过显着的尺寸。
大按钮有很高的机会被发现和点击，但你必须保持一些限制。一个引人注目的号召性用语按钮通常足够大，可以快速找到，但不会太大，以免布局的视觉组合和层次结构受到破坏。市场领导者通常会在其准则中提供有关按钮有效大小的建议。例如，苹果公司表示，移动用户界面中的CTA应至少为44×44像素，而微软推荐34×26像素。
应用
颜色和形状
视觉上有吸引力-尺寸只是强大CTA的一个方面。为了让按钮更明显，选择颜色和形状也非常重要。人的情绪和行为与视觉环境高度相关。我们的思维对颜色和形状也有反应，但我们通常不会注意到它。当我们的眼睛感觉到一种颜色时，它们与大脑相连，这个大脑向内分泌系统发出信号，释放荷尔蒙，负责情绪和情绪的转变。心理科学有不同的颜色和形状影响我们意识的具体分支。以下是关于颜色和形状的常见含义。
颜色含义：
红色：自信，青春和力量。
橙色：友善，温暖，充满活力。
黄色：幸福，乐观和温暖。
绿色。和平，成长和健康。
蓝色：信任，安全和稳定。
紫色：豪华，富有创意，明智。
黑色：可靠，复杂，经验丰富。
白色：简单，冷静，干净。
形状含义：
正方形和矩形：纪律，力量，勇气，安全性，可靠性。
三角形：兴奋，风险，危险，平衡，稳定。
圆圈，椭圆和椭圆：永恒，女性，宇宙，魔法，神秘。
抽象形意义：意义的二重性，唯一性，精心制作。
传统上，CTA按钮看起来像水平矩形，因为人们习惯将这种形状视为可点击的按钮。此外，建议设计具有圆角的CTA，因为它们被认为是指向按钮内部的注意力的复制。
颜色的选择取决于使过程更加复杂的各个方面。设计师需要考虑这些因素，如作品的基本色彩，以及目标受众的潜在偏好和心理特征。在为CTA选择颜色时有一个条件非常重要：按钮和背景颜色应该足够对比，以便CTA能够从其他UI组件中脱颖。
登陆页面
位置
CTA按钮的放置位置对其性能至关重要。如果他们位于用户眼睛无法捕捉到的区域，则其他视觉方面（如颜色和尺寸）可能无法有效工作。但是如何理解什么样的位置更加妥当？
许多研究表明，在阅读网页之前，人们会扫描它以了解他们是否感兴趣。考虑到这一事实，设计人员可能会了解最突出的可扫描区域，并将呼叫行为置于用户的路径中。
根据包括Nielsen Norman Group，UXPin团队等在内的不同研究报告，网页上有几种流行扫描模式，其中包括“F”和“Z”模式。
对于包含大量内容的网页，例如博客，新闻平台，F-模式是最常见的。用户首先扫描屏幕顶部的水平线，然后向下移动页面并读取，通常覆盖较短区域的水平线。最后一个是在副本左侧的垂直线，在段落的初始句子中查找关键字。
Z-模式是一种典型的扫描着陆页或未加载副本的网站的模型，并且不需要向下滚动页面，这意味着所有核心数据在预滚动区域中都可见。用户首先从左上角开始扫描页面顶部，寻找重要信息，然后下到相反的对角，结束页面底部的水平线，再从左到右对。
这些模式允许设计师将CTA放置在最受关注的位置，如顶角，并将其他要点注意的点放在顶部和底部线上。另外，将CTA按钮放置在布局的中心是一个好主意，尤其是当它不与其他UI元素过载时。
web
显微镜
显微镜在调动行动的效率方面发挥着重要作用。它被定义为：用户提示文本的小部分。更具体地说，显微镜包括按钮和菜单副本，错误消息，安全说明，条款和条件，以及任何类型的产品使用说明。
CTA显微镜实际上是一个调用，告诉用户如果点击按钮他们将采取什么行动。强大的CTA显微镜通常很短但一致，因此可以快速吸引用户的注意力。
界面
号召性用语按钮是电子商务中功能最强大的销售工具之一，也是影响页面或屏幕转换效果的重要因素之一。设计师需要了解CTA的重要性，并深切关注影响其表现的所有细节。
