更好的网站建设制作按钮的5种设计技术

当我们访问大多数网站时,通常会想到一个目标。为了实现该目标,通常需要采取一系列步骤,第一步是单击CTA(号召性用语)按钮开始。想想您上一次注册服务或下载应用程序时,该过程可能包括与号召性用语的交互。

CTA按钮是您在网站上用来引导用户实现目标转化的按钮。CTA的全部目的是将您的网站访问者引导至所需的操作过程。CTA的一些常见示例包括:

  • “开始试用”
  • “下载应用程序/书/指南”
  • “注册更新”
  • “咨询”

今天,我们将讨论设计CTA按钮的5种最佳做法,以及最佳的实际示例,以帮助您从目标网页获得最多的点击次数。

 

1.醒目的按钮

您的按钮颜色很重要。实际上,如果您只想从本文中获得一条建议,那就应该是:“考虑您的CTA按钮颜色”。使用颜色,可以使某些按钮比其他按钮更加突出视觉效果,从而使它们更加突出。

使用对比色

对比色最适合CTA按钮,使用对比色可以创建醒目的醒目的按钮。您应该从网页的配色方案中选择一种对比色,同时仍要适合整体设计。考虑下面的Firefox示例。Firefox页面上CTA按钮的绿色正在跳出页面,并立即引起用户注意。


Firefox CTA按钮为亮绿色,在深蓝色背景上效果突出

另一个引人注目的CTA按钮可以在Hipmunk主页上找到。明亮的橙色按钮引起用户注意并定义了下一个可能的操作。


负空间

颜色不仅对于CTA很重要,而且对于它的周围空间也很重要。空格(或负空格)可创建必要的呼吸空间,并将CTA按钮与用户界面中的其他元素分开。旧的Dropbox主页很好地说明了如何使用负数空间来弹出其主要CTA。蓝色的“免费注册”号召性用语在背景的浅蓝色中脱颖而出。


 

2.面向行动的文本

为号召性用语按钮编写文字,以迫使访问者采取正确的措施并非易事。幸运的是,有几件事可以帮助您做到这一点:

从动词开始

您应该避免在CTA按钮上使用诸如“输入更多信息”之类的含糊而无聊的字词,而应将其替换为诸如“开始免费试用”或“立即获得折扣”等面向行动的字词。但其CTA按钮仍可使用面向操作的文本。


以“开始”,“获取”或“加入”之类的动词开头

可以在Treehouse主页上找到一个更有趣的示例。Treehouse网站上的CTA不仅说“开始免费试用”,还包括“免费试用”。它说“要求免费试用”。措辞上的差异似乎微妙,但是“要求免费试用”听起来更个人。


使用简短易懂的按钮文字

请确保准确说明访问者单击CTA会得到什么。理想情况下,您希望按钮文字保持在2到5个字之间。

增值主张

您很可能已经注意到,许多按钮的副本中都带有“免费”之类的字眼,这并非巧合,在按钮副本中使用此类字眼可以突出您的报价的价值主张。因此,在编写CTA时,请尝试寻找一种方法来整合一个(或全部)3个有说服力的单词:

  • 自由
  • 奖金
  • 即刻

让我举个例子:用户在承诺签约之前最大的恐惧是,如果他们不喜欢该服务,取消订阅将很痛苦。Netflix使用“每月免费加入” CTA旁边的“随时取消”承诺来缓解这种恐惧。


产生紧迫感

在CTA按钮中营造紧迫感,可以产生令人印象深刻的点击率。例如,您可以使用诸如“今天注册并享受25%的折扣!”之类的按钮文字,从而限制了人们做出决定的时间,使人们希望在可以的情况下要求其报价。

有用的文字

有时您可能需要考虑在按钮文本中添加额外的信息行。这种做法在免费试用按钮中很常见。例如,免费试用按钮可能会在CTA按钮下方带有“开始免费试用”文本的较小文本中显示“ 30天试用期,无信用卡”。这些额外的文字应简化决策过程。

 

3.使其可见而不滚动

号召性用语按钮的位置与颜色和消息一样重要。CTA按钮应位于易于查找的位置,该位置从网页的流动开始自然而然地跟随。您应该尝试将CTA按钮保持在首位,以使用户永远不会错过它。理想情况下,您的CTA按钮应该是用户访问页面时首先在页面上看到的东西。附加信息应保持在折叠下方,在此处仍可访问但不能分散注意力。

 

4.圆角大按钮

考虑一下设计如何传达能力。用户如何将元素理解为按钮?使用形状和大小使元素看起来像一个按钮。

使它足够大

CTA应该足够大,可以远距离观看,但又不能太大,以免分散页面主要内容的注意力

带有圆角的用户按钮

纽扣形状可以发挥很大的作用。这是一个  被证明的事实是圆角是对眼睛更容易。在ContentVerve的测试中,绿色的圆形按钮比蓝色的矩形效果更好。


 

5.选择时少即是多

请记住,如果您希望客户采取行动,则必须通过消除所有可能的障碍来帮助他们。当给用户太多选择时,他们往往会感到困惑。因此,最好只向潜在客户提供一种选择。

如果您仍然希望包括多个按钮选择,则将一个选择的权重放在其他选择上,以帮助将用户引导至特定路径。Evernote就是一个很好的例子:当您到达Evernote主页的底部时,很明显,一个更好的选择是“免费注册”,而用户比较计划的CTA则是次要的。


 

结论

高端网站设计现有效的CTA设计,您需要考虑的不仅仅是按钮本身。考虑背景颜色,周围图像,周围文本和许多其他元素也很重要。Basecamp团队了解这些元素的重要性,并为其着陆页设计了完美的布局。甚至他们在CTA按钮下使用的复印件(“本周已签署了4,714家企业!”)也提高了潜在客户的信心。



返回观点列表
本文标签:

相关专题

  • 品牌官网设计
    品牌官网设计

    杭州派迪科技为高端客户提供品牌官网咨询策划,品牌官网设计,品牌官网建设开发服务,以国际化视野和标准为基础,为各行业领军品牌提供高端企业网站定制、策划、设计、互动与制作

    查看详情
  • 大策略营销门户网站
    大策略营销门户网站

    杭州派迪科技有自己的营销型网站CMS系统,适合白帽SEO网站。特别对大策略的营销型门户网站制作有一定的经验,曾经为上海天擎外贸行业网站、浙江兆龙营销型门户、先临三维门户营销网站提供全程的技术支持及SEO优化指导

    查看详情
  • 集团/上市公司网站
    集团/上市公司网站

    杭州派迪科技为杭州本地集团公司提供网页设计、制作、开发服务,为集团公司网站建设提供了响应式、营销型、品牌型、门户型网站建设需求,欢迎广大集团公司客户咨询

    查看详情
  • 外贸网站建设
    外贸网站建设

    杭州派迪科技为高端客户提供外贸网站咨询策划,外贸官网设计,外贸官网建设开发服务,以谷歌搜索引起算法为基础,为各行业外贸公司提供高端企业外贸网站定制、策划、设计、互动与制作

    查看详情
  • 企业网站建设
    企业网站建设

    高端专业、令人印象深刻的用户界面、易于访问——企业网站必须反映一切,因为派迪科技在这里提供帮助,凭借精湛的技术、丰富的经验、与客户的持续沟通以及对每一个细节的关注,我们确保在快速的周期时间内提供优质的服务。

    查看详情
  • 半定制网站
    半定制网站

    杭州派迪科技模板网站建设专题_各行业方案专题栏目提供各行业产品适合的网站建设方案,帮助企业了解派迪科技建站效果等信息,您可以通过本站了解各行业网站建设方案,如需要获取本行业定制网站建设方案,可以联系在线客服或拨打电话咨询

    查看详情

体验从沟通开始,让我们聆听您的需求!

开始您的数字化品牌体验! 15158117070 期待您的来电!

[ 网站建设×品牌官网设计×大策略营销门户×微信小程序开发×微信公众号开发]

派迪业务总监微信号

派迪业务总监微信号

了解最新项目报价

派迪产品经理微信号

派迪产品经理微信号

免费获取项目策划

我们正使用 cookies 来改善您的访问体验

派迪科技非常重视您的个人隐私,当您访问我们的网站www.hzpady.com时,请同意使用所有cookies 。

如果您想详细了解我们如何使用cookies请访问我们的 《隐私政策》

Cookie 偏好

如果您想详细了解我们如何使用cookie请访问我们的 《隐私政策》

管理cookie偏好

基本 cookies

始终允许

这些 cookies 是网站运行所必需的,不能在我们的系统中关闭。它们通常仅针对您所做的相当于服务请求的操作而设置,例如设置您的隐私首选项、登录或填写表格。您可以将浏览器设置为阻止或提醒您有关这些 cookies 的信息,但网站的某些部分将无法运行。这些 cookies 不存储任何个人身份信息。

性能 cookies

始终允许
这些 cookies 使我们能够计算访问量和流量来源,以便我们可以衡量和改进我们网站的性能。它们帮助我们了解哪些页面受欢迎和不受欢迎,并了解访问者如何在网站上移动。这些 cookies 收集的所有信息都是汇总的,而且是匿名的。如果您不允许这些 cookies,我们将不知道您何时访问了我们的网站,也无法监控其性能。

功能性 cookies

这些 cookies 收集信息用于分析和个性化您的定向广告体验。您可以使用此拨动开关来行使选择不获取个人信息的权利。如果您选择关闭,我们将无法向您提供个性化广告,也不会将您的个人信息交给任何第三方。

定位 Cookies

这些 cookies 可能由我们的广告合作伙伴通过我们的网站设置。这些公司可能会使用它们来建立您的兴趣档案,并在其他网站上向您展示相关广告。它们不直接存储个人信息,而是基于唯一标识您的浏览器和互联网设备。如果您不允许使用这些 cookie,您将体验到较少针对性的广告。

我们正使用 cookies 来改善您的访问体验

派迪科技非常重视您的个人隐私,当您访问我们的网站www.hzpady.com时,请同意使用所有cookies 。

如果您想详细了解我们如何使用cookies请访问我们的 《隐私政策》