当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 网页设计参考:出色的30个网页按钮设计实例

心得技巧
产品设计:在时空人综合的情况看待产品
产品市场思考:越来越担心360安全卫士
在互联网面前,音乐产业太被动了
视觉设计中的微软雅黑的字体设计
视觉设计理论:设计中的生理色差
用户体验设计理论:用户体验设计的方方面面
网页设计中保持清晰简洁的图片设计技巧
网页设计理论:各种元素在页面的综合设计
WEBJX整理的24个Firefox Web开发插件
BBC网站设计中的新网站视觉系统
互联网产品设计:适当的无序信息设计
17个用于设计开发的chrome扩展工具
用户体验设计实例:网易邮箱开放pop3
用户体验设计:用户常见的信息需求
审视IE6的过去 分析多年IE6改变的原因
网站用户体验 为增加顾客体验设计页面
web开发人员谈IE8浏览器新特性
用户体验:我不喜欢豆瓣新首页的几点
用户体验设计实例分析:豆瓣新首页UI
优秀的设计团队需要的4种关键的成员

心得技巧 中的 网页设计参考:出色的30个网页按钮设计实例


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 113 ::
收藏到网摘: n/a

  如何设计完美“勾引”用户点击的按钮好的按钮设计一定会是醒目且能“勾引”用户眼球的。以下是好的按钮设计必不可少的5个特征:

  1、颜色

  颜色一定要能与平静的页面相比更加与众不同,因此它要更亮而且有高对比度的颜色。


图1

  2、位置

  它们应当”座落于”用户期望更容易找到它们的地方。产品旁边、页头、导航的顶部右侧…这些都是醒目且不难找到的地方。


图2

  3、文字表达

  在按钮上使用什么文字表达给用户是非常重要的。它应当简短并切中要点(不罗嗦),并以动词开始,如:注册、下载、创建、尝试等…

  如果想切实的达到”勾引”用户点击的按钮,添加”免费”二字的确可以起到诱惑的效果,当然那要真的是免费,不要误导或欺骗用户。


图3

  4、尺寸问题

  如果它是你最重要的按钮并且你希望更多的用户点击它,那么让它更醒目些是没有坏处的。把这个按钮设计的比其他按钮更大些并让用户在更多的地方找到并点击它。


图4

  5、可”呼吸”的空间

  你的按钮不能和网页中的其他元素挤在一起。它需要充足的margin(外边距)才能更加突出,也需要更多的padding(内边距)才能让文字更容易阅读。


图5

  点击下一页,欣赏30个网页按钮设计实例。

 

  30个网页按钮设计实例

  1、Things

  2、Wordpress e-Commerce

  3、Skype

  4、PB Wiki

  5、Exceptional

  6、PicsEngine

  7、InCase

  8、GoodBarry

  9、Plan HQ

  10、TypePad

  11、Mozilla Firefox

  12、37 Signals

  13、Hambo Design

  14、Cake PHP

  15、Traffik

 

  16、Boag World

  17、Donor Tools

  18、Luke Larsen

  19、Square Space

  20、Wu Foo

  21、Barack Obama

  22、Freshbooks

  23、Crazy Egg

  24、Web Notes

  25、Campaign Monitor

  26、Light CMS

  27、Litmus

  28、Stumble Upon

  29、Remember The Milk

  30、Ekklesia 360

 

  原文链接:http://blog.bingo929.com/web-design-trends-call-to-action-signup-download-buttons.html