积极响应号召_“号召性用语”按钮:指南,最佳做法和示例

2023-10-18 04:40

本文主要是介绍积极响应号召_“号召性用语”按钮:指南,最佳做法和示例,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

网站上的号召性用语按钮通常被忽略。 设计师有时除了吸引人和融入整体设计外,还无法完全理解什么是良好的号召性用语。 但是,号召性按钮太重要了,以至于无法在某种程度上理解使按钮生效的方式而设计。 毕竟,对操作按钮呼叫的主要观点是让游客一些事情。

至少必须对颜色,比例,语言和其他因素如何影响号召性用语的转化率有一个基本的了解。 这里的概念并不复杂,但是确实需要一些深思熟虑和计划,才能在给定的设计中创建最有效的号召性用语。 继续阅读以获取关于这些要点的更多信息以及更多信息。

“号召性用语”按钮的目的

号召性用语按钮可以提供多种功能。 毕竟,“呼吁采取行动”确实有点含糊。 这意味着它的主要目的是使您的站点的访问者做某事 。 那可能是将某种产品添加到他们的购物车中,下载了一些东西,请求了信息或几乎其他任何东西。

前卫的

由于号召性用语按钮的用途如此多样,因此必须对按钮的目标进行很多考虑。 网站的类型,目标市场和所需的操作都可以在如何最好地设计号召性用语中发挥作用。

“号召性用语”按钮的类型

号召性用语按钮有几种不同类型。 尽管每种类型都旨在让访问者执行特定的操作,但是该操作可能会发生很大的变化。 下面是最常用的号召性用语类型,具体取决于他们希望您执行的操作。

结点
1.添加到购物车按钮

电子商务网站通常使用许多号召性用语按钮,但是使用最广泛的是“ 添加到购物车 ”按钮。 这些按钮通常显示在各个产品页面上。 他们的目的是吸引顾客购买物品。 添加到购物车按钮中的常见设计元素包括简单的措辞(例如“ 添加到购物车 ”或“ 添加到购物 ”或“ 立即购买 ”)和使用图标(通常是购物袋或购物车)。

立即购买
2.下载按钮

下载按钮类似于添加到购物车按钮,因为它们试图诱使访问者拥有某项物品。 对于下载按钮,许多设计人员选择包含比其他类型的按钮更多的信息(例如版本信息或下载大小)。

歌剧
3.试用按钮

一些网站尝试以免费试用的形式来诱使访问者试用其产品。 这可以是免费下载或免费帐户,具体取决于特定站点。 一些站点使用“少即是多”的理念,并将按钮上的语言保持在最低限度,而其他站点则希望提供有关试验内容的更多信息。

试用按钮
4.了解更多按钮

了解更多信息通常在一段预告片信息的末尾使用按钮(通常在主页上)。 这些按钮通常很简单,但通常尺寸过大以吸引访问者的注意力。

学到更多
5.注册按钮

注册按钮最常出现在两种不同版本中。 第一种类型通常直接与注册表单相关联。 第二种类型通常以类似的方式用于“添加到购物车”按钮,作为用户在实际到达注册表单之前购买或注册服务或帐户的一种方式。

注册按钮

还有其他类型的号召性用语按钮,但这是最常见的。 适用于上述内容的指南也可能会适用于您正在设计的任何其他类型的号召性用语按钮。

有效利用负空间

您希望号召性用语按钮从周围的内容中脱颖而出,并真正引起站点访问者的注意。 为此,您需要在这些按钮周围使用负号空间。 在您的内容和号召性用语之间添加空格。 尽管这在某些按钮(例如添加到购物车按钮)上不太重要(也较不常见),但在其他按钮(如需了解更多信息)上,它们在更大的空间上效果更好。

乌富

平衡按钮周围的负空间量和按钮本身的大小非常重要。 这是关于比例。 您希望按钮,按钮周围的空间以及周围的内容看起来都一样,即使它们之间存在大小差异。 为了使它们看起来恰到好处,您可能必须在事情上摆弄一些。

  • 确保按钮周围有足够的空间,以免混乱
  • 在确定要包含多少空间时,请考虑三分法或黄金分割率等原则
  • 负号空间使您可以使用号召性用语来突出其他内容并将其与众不同
大小和颜色

号召性用语按钮的大小非常重要。 太大的按钮会压倒周围的一切。 太小的按钮会迷失在页面上的所有其他内容中。 您希望按钮足够大以在不压倒设计的情况下脱颖而出。

ncover

颜色可以发挥很大的作用,以帮助平衡按钮的大小。 对于较大的按钮,请选择在您的设计中不太突出的颜色(但仍会突出背景)。 对于较小的按钮,您可能希望选择更亮的对比色以真正使按钮弹出。 在任何一种情况下,请确保您使用的颜色将按钮分开,而不与网站的整体设计相冲突。

  • 理想情况下,号召性用语按钮应该是给定页面上最大的按钮
  • 使用对比色使较小的按钮更加突出
  • 使用较少的不同颜色,使超大按钮更合适
  • 号召性用语按钮需要引起注意,而又不会使您的设计不知所措
语言

您选择在号召性用语上使用的确切字词会对转化产生巨大影响。 将“ 立即购买 ”与“ 添加到购物车 ”进行比较。 一个比另一个更紧迫。 或者怎么样“ 免费试用 ”和“ 免费试用 “? 一个比另一个强得多,而且更加突出。

冲绳

您在号召性用语按钮上使用的语言应尽可能简单明了。 您希望访问者一眼就能知道他们在单击按钮时会得到什么。 如果他们提出疑问,则表示他们已经暂停,这可能会导致转化率降低。

也不要忘记您的字体大小。 号召性用语按钮上的文本应大而粗体,以适合按钮本身的大小和颜色。 确保有足够的对比度,并且文本易于阅读。

  • 使用简单直接的语言
  • 在按钮上为主要文本使用大胆的字体
  • 确保语言明确要求采取特定行动
创造紧迫感

您希望网站上的访问者尽可能少地思考并执行所需的操作。 当您不想欺骗访客时,您给他们更多机会停下来考虑他们在做什么,您给他们更多机会说“不”。

高地

您希望按钮给他们一种印象,即他们需要立即采取行动。 您想鼓励他们立即做出决定。 尽管这对每个号召性用语按钮(特别是那些购买高价商品的按钮)都无效,但对于低成本或免费的操作而言,希望访问者点击时少先考虑。

  • 鼓励您的访客立即采取行动
  • 不要给访客任何暂停的理由
  • 紧迫性很重要,但不要以任何方式误导访客
提供额外的信息

在适当的地方,使用号召性用语按钮为访问者提供更多有关他们单击按钮后将获得的信息。 这最常见于试用按钮或下载按钮。 额外信息的常见示例包括免费试用将持续多长时间或文件下载的大小。 版本信息也很常见。

大本营

包含其他信息时,请记住,您需要重点关注实际的号召性用语。 确保诱使访问者采取行动的语言文字最为突出,而其他信息则不太明显。

  • 仅在增加用户体验时才包括其他信息
  • 额外信息仅适用于某些类型的号召性用语按钮,尤其是下载或试用按钮
  • 确保号召性用语仍然是按钮上最醒目的文字
优先排序

如果页面上的号召性用语按钮不止一个,则必须对其进行优先排序。 这可以通过多种方式完成,但是最常见的是通过使用颜色和大小。

大本营

使用颜色突出显示页面上最重要的按钮,或使次重要的按钮看起来不太突出。 或者使用尺寸使最重要的按钮突出(使其变大),而不再强调次要的按钮。

图标和图像

在号召性用语按钮中包含视觉提示也可以帮助提高转化率。 例如,“添加到购物车”按钮上的购物车图标或下载按钮上的箭头都是很好的例子。 也可以考虑使用独特的图标,但是要弄清楚该按钮的用途,确保该图标增加了用户体验,并且不会造成任何混淆。

上载
  • 确保您使用的图标有助于阐明按钮的含义,而不是造成混淆
  • 易于识别的图标可以立即向访问者指示含义
  • 只要它们的含义仍然清楚,就不要害怕使用不太常用的图标
例子

这里有一些很好的号召性用语示例 。 尽管它们都不完全符合上述准则,但它们满足了足够的标准,被认为是出色的。

现场直播

区分“立即购买”(用于付费选项)和“注册”(用于免费选项)按钮是一个不错的策略。

现场直播
视窗

绿色的大“ Get Windows7”按钮很容易让访客发现。

Windows 7的
文件共享总部

此处的亮绿色按钮在白色背景下确实脱颖而出。

文件共享
日志

为“下载”和“购买”按钮使用不同的颜色将它们分开设置,并优先使用“购买”按钮。

日志
TasteBook

此按钮充分利用了图标,并使用较大的粗体文本突出显示。

趣味本
好家伙

另一个亮绿色的​​号召性用语按钮。

好家伙
生命树创意

从正文到调用按钮继续使用相同的字体,会产生凝聚力。

生命树
恢复器

带有红色字体的亮红色号召性用语按钮在蓝色背景下显得特别突出。

恢复器
笔记本

在号召性用语按钮中包含额外信息的一个很好的例子。

笔记本
墨水

优先考虑大小按钮的一个很好的例子。

墨水的
优雅的主题

使用颜色脱颖而出而不与周围的设计元素冲突的另一个出色示例。

优雅主题
ZenDesk

另一个使颜色脱颖而出的好例子。

zendesk
Storenvy

圆形按钮出人意料并且突出,尤其是在被白色边框包围时。

储藏室
巴拉玛

有时,混合使用的按钮在您的整体网站设计中会更好,特别是在操作不太紧急时。

巴拉邮件

翻译自: https://www.hongkiat.com/blog/call-to-action-buttons-guidelines-best-practices-and-examples/

这篇关于积极响应号召_“号召性用语”按钮:指南,最佳做法和示例的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/230240

相关文章

pandas中位数填充空值的实现示例

《pandas中位数填充空值的实现示例》中位数填充是一种简单而有效的方法,用于填充数据集中缺失的值,本文就来介绍一下pandas中位数填充空值的实现,具有一定的参考价值,感兴趣的可以了解一下... 目录什么是中位数填充?为什么选择中位数填充?示例数据结果分析完整代码总结在数据分析和机器学习过程中,处理缺失数

Pandas统计每行数据中的空值的方法示例

《Pandas统计每行数据中的空值的方法示例》处理缺失数据(NaN值)是一个非常常见的问题,本文主要介绍了Pandas统计每行数据中的空值的方法示例,具有一定的参考价值,感兴趣的可以了解一下... 目录什么是空值?为什么要统计空值?准备工作创建示例数据统计每行空值数量进一步分析www.chinasem.cn处

SpringBoot请求参数接收控制指南分享

《SpringBoot请求参数接收控制指南分享》:本文主要介绍SpringBoot请求参数接收控制指南,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Spring Boot 请求参数接收控制指南1. 概述2. 有注解时参数接收方式对比3. 无注解时接收参数默认位置

利用Python调试串口的示例代码

《利用Python调试串口的示例代码》在嵌入式开发、物联网设备调试过程中,串口通信是最基础的调试手段本文将带你用Python+ttkbootstrap打造一款高颜值、多功能的串口调试助手,需要的可以了... 目录概述:为什么需要专业的串口调试工具项目架构设计1.1 技术栈选型1.2 关键类说明1.3 线程模

Python使用getopt处理命令行参数示例解析(最佳实践)

《Python使用getopt处理命令行参数示例解析(最佳实践)》getopt模块是Python标准库中一个简单但强大的命令行参数处理工具,它特别适合那些需要快速实现基本命令行参数解析的场景,或者需要... 目录为什么需要处理命令行参数?getopt模块基础实际应用示例与其他参数处理方式的比较常见问http

Java Response返回值的最佳处理方案

《JavaResponse返回值的最佳处理方案》在开发Web应用程序时,我们经常需要通过HTTP请求从服务器获取响应数据,这些数据可以是JSON、XML、甚至是文件,本篇文章将详细解析Java中处理... 目录摘要概述核心问题:关键技术点:源码解析示例 1:使用HttpURLConnection获取Resp

Android实现在线预览office文档的示例详解

《Android实现在线预览office文档的示例详解》在移动端展示在线Office文档(如Word、Excel、PPT)是一项常见需求,这篇文章为大家重点介绍了两种方案的实现方法,希望对大家有一定的... 目录一、项目概述二、相关技术知识三、实现思路3.1 方案一:WebView + Office Onl

Mysql用户授权(GRANT)语法及示例解读

《Mysql用户授权(GRANT)语法及示例解读》:本文主要介绍Mysql用户授权(GRANT)语法及示例,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录mysql用户授权(GRANT)语法授予用户权限语法GRANT语句中的<权限类型>的使用WITH GRANT

Java中Scanner的用法示例小结

《Java中Scanner的用法示例小结》有时候我们在编写代码的时候可能会使用输入和输出,那Java也有自己的输入和输出,今天我们来探究一下,对JavaScanner用法相关知识感兴趣的朋友一起看看吧... 目录前言一 输出二 输入Scanner的使用多组输入三 综合练习:猜数字游戏猜数字前言有时候我们在

CentOS7更改默认SSH端口与配置指南

《CentOS7更改默认SSH端口与配置指南》SSH是Linux服务器远程管理的核心工具,其默认监听端口为22,由于端口22众所周知,这也使得服务器容易受到自动化扫描和暴力破解攻击,本文将系统性地介绍... 目录引言为什么要更改 SSH 默认端口?步骤详解:如何更改 Centos 7 的 SSH 默认端口1