我的联盟 作品 招聘 外包 人才  酷站加油 国内 国外 CSS  资源图库 图库 模板 矢量 图标  设计欣赏 界面 LOGO 插画 艺术  网页 平面  专访 名站 竞赛 社区
当前位置:首页 > 网页教程 > 网页理论 > 正文
行动召唤按钮:实例与最佳实践
来源:www.qianduan.net 作者:神采飞扬 2009年11月05日 08:31 网友评论:0条 点击:

中文翻译行动召唤按钮:实例与最佳实践
英文原文Call to Action Buttons: Examples and Best Practices
版权所有,转载请注明出处,多谢!

行动召唤在网页设计中——尤其是在用户体验方面——是一个描述在网页中用于诱导用户行为的元素的术语。在网站界面中,最流行的行动召唤的表现是出现在点击表单按钮、完成一个行动(比如”Buy this now!”)或使用附加信息带到一个页面(比如”Learn more …”)等请求用户来采取行动的地方。

我们如何创建有效的行动召唤按钮来吸引用户的注意并引诱他们点击?我们将在本文中通过分享一些有效的设计技术和查看一些实例来尝试回答这个问题。

有效的行动召唤按钮的最佳实践

设计行动召唤按钮到网站界面需要一些远见和计划;它必须是你的原型和信息结构流程的一部分以使他们能够正常工作。在本节中,我们将讨论行动召唤按钮的设计技术。

用大小吸引用户注意

在网页中,一个元素相对于其周围元素的大小表明其重要性:元素越大,它就越重要。判断网站的某种行为有多么至关重要,行动召唤按钮的型号也应相应的调整。

行动召唤按钮与周边元素

Lifetree Creative展示大小的主意以表明他们的行动召唤按钮的重要性。将按钮的大小与公司的logo对比。为了吸引用户的注意,这个行动召唤按钮在宽度方面比logo大了大约20%。尽管logo在页面中放的比较高,你的眼睛还是被吸引到了行动召唤按钮,因为它相对于周边元素比较大。

行动召唤按钮与不太重要的行动召唤的大小

一个网页可能有多个行动召唤。为了区分一个行动召唤与其它行动的相关重要性,你可以改变他们的大小。这里在paramore|redd网站有一个使用这个理念的实例,那个页面的让用户注册以获取邮件通知的行动召唤按钮明显的比继续阅读性东召唤按钮大一些,表明在该网页中,与继续阅读日志相比他们更希望你采取订阅

使用突出的位置吸引用户注意

页面中的行动召唤按钮的位置是吸引访问者的注意的关键。放置在突出的位置,比如页面的章节的头部可以带来较高的页面转换因为用户将很可能注意到行动召唤按钮并采取行动。

放置在明显的区域、

将一个行动召唤按钮放置在一个明显的区域是一个让它在页面布局中突出的一个方法。你可以在dailymile看到这个概念,行动召唤按钮看起来在一个比其它元素比如图形条高的层面上(在顶部)。

放到页面的头部

为了阐述这个概念,看一下位于Your Web Job页面最右上角的”Post a Job!”行动召唤按钮。通过将行动召唤按钮放到一个非常醒目的区域,这样好像用户会注意到它或者稍后记住它,在他们看过网站的内容之后。比如一个职位发布者想要在他们发布职位之前浏览一下网站,”Post a Job!”按钮将随时为他们准备好,无论哪个页面引导他们跳转,他们会更可能记得他们可以很容易的执行这个行动的地方,因为它的位置足够显眼。

放在布局的中间

将一个行动召唤按钮定位到页面布局的中间——而不是两侧(或明显比较小或者不重要)的位置——可以是一个很有效的吸引注意和诱导一个行动的方法。在例子PicsEngine中,尽管这个行动召唤按钮没有使用与其背景色和页面中周边元素高对比的色彩,它依然能够因为其居中的位置而很容易引起注意。


首页 上一页 [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] .. 下一页 尾页
上一篇:设计72变—寻求banner制作的变化   下一篇:支付宝lab logo设计创意发想
收藏此页】【打印】【关闭
 相关文章  我要点评
·小按钮引发的大爆炸:方兴未艾的社交组件
·YouTube在多数视频中加入雪花按钮(图)
·Photoshop制作蓝色水晶立体按钮
·原型设计中一个按钮的“哲学”故事
·谷歌10月初为显示广告添加“+1”按钮
·Photoshop制作精制的立体金属按钮图标
·谷歌+1按钮已可向Google+朋友圈分享内容
·电商网站的购买按钮

免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息,也不构成任何建议。对本文有任何异议,请联络:68design#163.com
转载要求:作者及来源信息必需保留。转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印。



关于我们 | 设计服务 | 广告服务 | 常见问题 | 网站地图 | 法律声明 | 联系我们
Copyright © 2003-2012 68design.net, All Rights Reserve 【找网页设计师,当然上网页设计师联盟】