(翻译)引人注目的行为召唤按钮设计方式

  你的按钮可能具备行为召唤功能,但是否能让用户主动点击按钮[2]?按钮有不同的形状和形式,但如果不能促使用户操作,它们就没有效果。按钮点击的越多,越有可能将用户转化为客户。下列最佳实践有助于将行为召唤按钮变成主动操作按钮。

真实感

  按钮看着越真实,用户点击的可能性越大。渐变、投影阴影、圆角都能让按钮变得立体起来。用户总是接触真实按钮,当在网站中看到仿真按钮时,他们就会知道该怎么做。
在这里插入图片描述

高对比色

  吸引用户注意力的重要手段之一为颜色。引人注目的行为召唤按钮要能让用户立马看到,关键是要采用高对比色。按钮颜色要能和按钮名称的颜色形成对比。
在这里插入图片描述

适合的尺寸

  按钮尺寸也是吸引用户注意力的重要手段之一。按钮越大,越容易看到。随着按钮尺寸增加,按钮名称也在变大,也越方便用户查看。但要避免按钮尺寸过大,否则会让用户的注意力偏离任务。。
在这里插入图片描述

迫切的用语

  用带紧迫感的语句更能让用户积极主动。例如,按钮名称使用“现在”、“今天”、“马上”或“尽快”,让用户产生紧张和兴奋感,从而提高客户转化率。情绪也是促使用户尽快行动的手段。
在这里插入图片描述

柔和的用语

  如果用户不了解产品,他们不可能不试试就买。很多网站在没让用户了解产品前,就要求用户购买,他们怎么可能会买。不要效仿这些网站,采用温和的用语,同时允许用户试用或了解产品功能,然后再请求用户购买产品。[3]
在这里插入图片描述

2字以内,字首大写;3字以上,句首大写

  大多数设计人员没把按钮标题大小写当回事儿,但这也会影响客户转换率。当按钮名称只有1-2个字时,将字首大写,像是给用户下达命令;当按钮名称包含3个及以上字时,将句首大写,像是在跟用户对话。恰当使用按钮名称大小写,会使用户更舒适地操作。
在这里插入图片描述

附加箭头或图标

  给按钮附加少量图标,让按钮更具吸引力。可以附加箭头,指示用户点击按钮后的去向。也可以添加描述按钮功能的图标,让用户觉得会得到想要的东西。[4]
在这里插入图片描述

添加鼠标悬停效果

  用户鼠标悬停在按钮上时,改变按钮视觉效果会让用户不由自主地点击按钮。可以改变渐变色的亮度,同时将鼠标从箭头形状改成手的形状。
在这里插入图片描述

放在折叠内容上方及下方

  用户滚动页面内容时,最好将按钮放在折叠内容的上方及下方。用户花费大量时间浏览折叠内容,浏览结束后会停留在折叠内容下方。在折叠内容下方放置行为召唤按钮,让用户浏览结束后可以点击按钮。[5]

主动操作按钮

  设计行为召唤按钮很容易,但设计能让用户主动操作的按钮就需要细致思考和设计。上述最佳实践能引导你走上正途。如果想知道更多做法,可以在用户上面尝试不同版本的按钮。

原文地址:https://uxmovement.com/buttons/how-to-design-compelling-call-to-action-buttons/

[1]call to action button:暂译为行为召唤按钮,网上有称为CTA按钮的,Call To Action,也有直接到call to action按钮的。
[2]原文:Your buttons may call users to act, but do they compel users to act?
[3]原文:If users don’t know much about your product, it’s unlikely they’ll buy it without trying it. Many sites ask users to buy their product on the home page before users see what the product is about. This is a sure way to get users to avoid your button. Don’t put all your chips in one basket right away. Soften your action words and allow users to try a demo or browse features before you ask them to buy.
[4]原文:There are a couple of icons you can add to your buttons to make it more compelling. One is an affordance arrow that signals to users the button will take them to where they want to go. Another is to use an icon that describes the button action. This will make users feel like they’ll get what they want.
[5]原文:If users have to scroll your page, it’s good to have your call to action button above and below the fold. Users will spend most of their time above the fold, but will end below the fold. Having a call to action button below the fold leads them to act when they finish the page.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值