征集网锐志网络淘途找素材上91
创意在线首页
平面设计交互设计CG动漫工业设计建筑环境数码影像创意搜
 首页大赛征集资讯教程画廊访谈作品集创企同盟设计招聘人才专区竞赛台专题论吧 找素材看酷站设计网址库
交互设计首页
当前位置:首页 > 交互设计 > 观点 > 正文
接受伪按钮
作者: 来源: 发表时间:2007-11-21 9:48:01 浏览:

尝试着区分真、伪按钮
“设计两类不同样式的按钮”---这似乎是个好办法。然而,却并不容易做到。首先,需要设计出两个样子不同的图像,让用户知道这些东西是可点击的,是按钮。它们应该是有立体感的,上面还要能足够清楚的显示文字。

除了看上去像是能点击的,他们两个还要表达出文字链接与按钮的区别:文字链接指向另外一个界面,点击后不会出现什么严重的后果,如果您后悔了,那就点击一下浏览器上的“后退”按钮。而按钮就比较恐怖了,点击后,邮件将发送到对方的邮箱中,文章将被成千上万的人看到……两个这么抽象的概念,要想通过两个方寸大小的图像表达出来是很困难的,yahoo进行了偿试:

在鼠标经过“My Yahoo!”的时候,会出现下划线,与这个页面上的其他文字链接的样式一样。看上去是一个按钮,但是不失时机的告诉用户这个“按钮”和页面上的其他文字链接有某些相似的地方。而“Web Search”这个真按钮就没有类似文字链接的表现。设计者用这个下划线来区别真按钮与伪按钮。

另外一种相似的做法是,按钮的文字上始终显示下划线。虽然具体的形式上有些不同,但是思路是一样的:让伪按钮既有文字链接的样子又有按钮的样子。

然而这样的设计恐怕还不足够好,多数用户首先会看到那是一个按钮,如果有耐心仔细研究一下,恐怕也只会觉得那是个有点儿奇怪的按钮,即便确实分辨出了这个“My Yahoo!”与“Web Search”有所不同,又有几个人能明白这样的区别意味着什么呢。

这样的偿试目前为止并不成功。

还有一个办法!
“不区分真按钮与伪按钮,把他们都做成一样的按钮。”这是amazon.com给我们提供的解决办法。

既然那些重要的文字链接需要看上去象个按钮,我们又很难让用户理解一个页面上有两种不同性质的按钮。那么,就不要区分了。给用户看到的只是文字链接和按钮两种元素。而点击按钮将出现的后果由按钮上的文字来说明。

这样做虽然不符合widow图形用户界面的设计原则,但是在很大程度上却是符合用户使用心理的。我们不可能幻想着用户在浏览一个网页的时候知道什么叫<form>,用户也不会去判断一个按钮是否会把一些数据写入数据库。用户面对一个页面的时候,会被页面上的按钮吸引,阅读上面的文字,确定那个按钮是自己想要做的事后,就点击了。那么,不管是“进入结算流程”还是“登录到我们的安全服务”只要在点击前清楚的交代了点击后的效果就够了。样子并非一定要不同,也并非一定要相同。而相同的好处在于减小了用户的学习成本。不同的网站上的按钮样子往往是不一样的。用户面对一个页面的时候先要学习,认清什么样子的东西是按钮。如果整个网站上的按钮全是一个样子,显然会更容易学习。(amazon.com上实际有不止一种的按钮,为的是区别重要性,与是否提交表单无关。)

使用这种设计方法,不用再强迫图形设计师画出两种几乎不可能画出来的按钮样式了,更重要的是,用户看到的页面更简单了。

不区分真、伪按钮的做法需要我们花更多的心思判断哪些文字链接是可以被“升级”为按钮的。因为把文字链接“升级”为按钮意味着他很重要,而一个页面上不应该有很多重要的内容。同时,按钮上的文字表述也是需要花很大精力的,尤其是对于我们。我相信,在中国多数的网页设计师,象我一样,并不具备很强的文字表达能力。在按钮上显然又不可以长篇大论,要用几个字描述清楚点击后的效果并不简单。但是,却很必要。

需要强调的是,这整齐划一的一个按钮样式不应该是系统标准按钮,因为系统按钮是“真按钮”的标准造型。想象一下,把“了解更多”弄成一个系统标准按钮的样子,绝对会比阿扁现在的言行更可笑。

总结一下
要解决真、伪按钮的问题有两个办法,方法一.是象google那样,文字链接就是文字链接,再重要的文字链接最多也就是显示的稍微大一点儿。这种方法通常不会通过评审的,那么,可以试试第二种方法,不区分真、伪按钮,只使用一种按钮样式,斟酌适用范围,确保页面上重点突出,而不是重点泛滥。推敲文字表述,确保清楚的描述点击的后果。

我不得不承认,这种办法是与《谁》一文中相悖的。但是,我仍旧认为,对于目前的大多数网站,这种不区分真、伪按钮的方法是最好的。


1 2 
在线编辑:angel
本文链接:


推荐阅读:
·2021第十五届“创意中国”设计大奖 征稿章程
·2021第七届“学院派奖”全国艺术与设计大赛征集公告
·青春唯美插画培训网络远程班正在招生
·第八届中国高等院校设计作品大赛启动
·第十二届中国高校美术作品学年展获奖名单公布
·2021第七届“学院派奖”全国艺术与设计大赛征集公告
·第六届“包豪斯奖”国际设计大赛获奖名单揭晓
免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息。对本文有异议,请联络本站!
转载要求:文章作者及来源信息必需保留。转载之图片、文件请不要盗链本站地址,且不准打上各自站点的水印!

近期推荐报道 返回首页更多精彩等着你!

Illustrator| 用AI创建精细矢量插图徽章Photoshop| PS经典合成张开血盆大嘴樱桃
Photoshop| Photoshop自制个性的黑色翅膀摄影佳作| 德国Thomas Wuhrer长腿女郎性
Photoshop| Photoshop制作超酷的边缘发光的荧CorelDraw| CorelDRAW制作编织效果详细教程
Illustrator| illustrator制作潮流海报字体摄影佳作| 惊艳的Francesco Marconi
Photoshop| 利用画笔及图层样式制作方格子艺术纹理背景Photoshop| Photoshop制作简单时尚的彩色放射
关于本站 | 联系方式 | 商业服务 | 合作伙伴 | 站点地图 | 免责声明 | 版权声明 | 在线投稿