在大家使用wordpress模板建站中,经常会看到call to action 模块,它大概长这个样子:

 

 

优化转换率很重要的设计“ Call To Action Design”,但在讲 Call To Action Design 前,要先了解什么是 Call To Action 的定义。要学好一个设计,很重要的是先了解它的定义,因为定义会决定设计的范畴与解读。

先来看 Call To Action 中文翻译,网络上有很多翻译,例如以下这几个:

1.行动呼吁

2.唤起行动

3.要求行动

4.召唤行动

5.行为召唤

先从 Call 这个字来说,Call 被翻译成呼吁、唤起、要求、召唤。呼吁跟要求是比较不好的翻译,因为没办法用呼吁或要求用户去做某种行为,越是呼吁、越要求用户,用户就越不想做。而且如果能透过呼吁跟要求就让用户作出你想要的行为,那这个世界就不会有那么多大大小小的问题,因为大家都会乖乖听话。(常常呼吁马总统的人就会点头同意我说的话,呼吁真的没有什么效果。)

Call To Action 是透过设计让用户自己想到要做某种行为,而不是要求、呼吁用户去做,所以用呼吁跟要求当作翻译,会让设计师在做 Call To Action 设计时,在思考怎么设计上产生误解。呼吁、要求用户跟“让用户自己想做某种行为”是完全不同的事。呼吁跟要求出局之后,还剩下唤起跟召唤,其实两个差不多,但召唤是比较有经过设计,让用户不知不觉中触发行为的意思。

第二个是 Action 的翻译,Action 这个字可以被翻译成行动,也可以被翻译成行为,通常如果两个中文都可以翻译的话,就要看哪一个比较贴切。以目的性来说,网站或商业的目的都是要用户做出网站、商业想要的行为,例如下载、试用、结帐、加入会员。所以翻成行动,对某些状况来说就不太合适,因为下载、试用、结帐、加入会员都是一连串的动作组成的行为,不单单只是一个 Action。

如果目的只是要用户点击、动一动鼠标,那翻成行动就很贴切,但以网站或商业的目的来说,行为是比较适合的翻译。

所以比较好的翻译是行为召唤,用户行为是透过设计召唤出来的,用户在过程中并不会觉得是被强迫的,而是出于自愿的,但实际上用户的自愿行为是被设计师设计好的。由于中文实在很容易在翻译上有落差,所以我们可以忽略中文翻译,直接看英文怎么解释比较好。如果你去 Google 找 Call To Action 的英文名词解释,通常会找到两种角度的解释,一种会从网页设计的角度去解释,另外一种则是来自于行销上的解释。

从网页设计角度的解释:

维基百科:In web design, a CTA is a banner, button, or some type of graphic or text on a website meant to prompt a user to click it and continue down a conversion funnel.

HubSpot(知名集成性行销软件公司):A call-to-action (usually abbreviated as CTA) is an image or line of text that prompts your visitors, leads, and customers to take action. It is, quite literally, a “call” to take an “action.”

从行销角度的解释:

维基百科:In marketing, a call to action (CTA) is an instruction to the audience to provoke an immediate response, usually using an imperative verbsuch as “call now”, “find out more” or “visit a store today”.

Marketing Terms:The part of a marketing message that attempts to persuade a person to perform a desired action.

网页设计上的解释是 Call To Action 指的是提示用户去点击的按钮、文本或图片。行销上的解释则是指让用户想要做某个行为。

到底哪一个解释比较好?是让用户想要点击的按钮还是触发一个行为?其实两个解释都对,主要是看设计师的设计目的是什么,是想要单纯让用户点击按钮,还是完成一个行为,例如注册。如果是要用户完成注册,那就不只是单单点击一个按钮的简单动作了。如果是要用户点击广告,那就是很单纯的点击一个按钮或是图片。

为了要让设计师在思考 Call To Action 设计时能很好地运用定义,我个人最喜欢的 Call To Action 解释是 Site Strategics 的解释(49秒开始):“What call to action is a primary thing that you want that user to do“?

Call To Action 是你想要让用户做的主要的事,白话一点就是让用户做你想要他做的事。这个解释很全面, 因为不管是想要用户点击按钮还是触发注册的行为,都是设计师想要用户做的事。这个定义的另外一个好处是让设计师做 Call To Action Design 的时候,会先从要用户做的事是什么事开始思考,而不是从按钮、文本或图片开始想起。设计师要回到思考设计的目的是什么,才知道到底要是需要一颗按钮还是一个流程才能让用户做到你想要他做的事。

注意:不要去想 Call To Action 是一颗按钮、一串文本、一张图、一整个页面、还是一个流程,先从你要用户做什么事开始想,然后才去思考设计。是不是一颗按钮或一个流程不重要,能做到网站或商业上想达成的目的才是重点。

专业网站开发网页设计公司

深度阅读:

【WP可视化编辑器】动画区块-Animation Block 预览地址: https://ultimate.brainstormforce.com/animation-block/ 作用: 动画的样式多样,可以自行调整动画效果,给一些模块添加动画会给人视觉体验更佳 预览效果:后台: ...
选择建站公司建网站前必须要注意的7个陷阱 如果你是一个创业者,或者你的事业已经开始逐渐起步了,这时候你可能会开始想“是时候需要一个网站了”所以你开始打开百度搜索引擎,输入‘建站公司’,结果发现,各种形形色色的建站服务琳琅满目,有的0元建站,有的先建站后付款,有的800元一个套餐,你觉得非常高兴,花费几百块就可以做出下一个淘宝...
wordpress中如何使用breadcrumb面包屑并进行双语翻译 1.安装插件breadcrumb-navxt-wpml2.在首页模板蓝色选中区域编辑你想要显示的面包屑文字2.在WPML的主题和插件本地化中选中 Breadcrumb NavXT3.选择最下面扫描选定插件以获得字符串4.WPML-字符串翻译   找到该字符串 并翻译该...
在wordpress多语言网站中添加地图的策略 最近做项目中遇到个问题,一个多语言wordpress网站,服务器在国内,想给英语版本添加谷歌地图,中文版本添加百度地图,这个效果怎么实现?首先要提醒的一点,如果是要做多语言网站,那么服务器就不要选在国内的了,经过我们的简单测试,国内服务器基本上是加载不出来谷歌地图的。但是网站的访客是...
【WP可视化编辑器】DIVIDER-DIVIDER 预览地址: http://massive.mpcthemes.net/divider/ 作用: 对标题与内容进行分割,也可以添加图标在分割线上,可以对宽进行设置,样式效果有9 种 预览效果:后台: ...
Woocommerce插件 – Woocommerce产品布局 许多wordpress站长在搭建wordpress商城时,想要多样化展示自己的产品样式,但是woocommerce自带默认的设置的样式固定,只能使用大量的css代码修改,十分繁琐,这里推荐大家一个Woocommerce插件 - WOOCOMMERCE PRODUCTS LAYOUTS,能够实现产品样...
【WP可视化编辑器】高级按钮-advanced-button 预览地址: https://ultimate.brainstormforce.com/advanced-button/ 作用: 对按钮做的一些动画,可以给按钮的内容添加蒙版、阴影等,再加上一些特效让按钮具有3D感,体验效果比较好 预览效果:后台: ...
wordpress如何导入Visual composer Massive Add on拓展的预设样式 当我们需要使用massive的模块样式时,发现没有可以选择的预设样式,这时我们需要对massive的预设样式进行拓展。 步骤如下: 1,在仪表盘中找到 Massive Panel2,在Massive Panel中  找到 Style Presets3,在Install a...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.