|
视角:Bob Baxley 作者:Making the Web Work: Designing Effective Web Applications 选择表单元素
决定最合适的输入框,这是优秀表单设计最具挑战性的问题之一。总是有多种方式来表现特定交互行为或请求特定形式数据,表单设计师会面临多种形式选择,从而强烈影响用户体验。
为了评估设计方案范围,设计团队需要完全了解每种形式的相对优点和独到特点。设计团队应努力平衡有效点击率和出错率、学习能力和效率、普遍情况和个别情况,及弹性和明确性,这是典型情况。平衡最终取决于设计团队的判断,对特定受众和使用模型的优化。
数量及类型规格是售票网站的常见问题,提供了有效设计挑战的例子。从建立受众及用法参数开始:(1)只有3种票——成人票,儿童票和老人票;(2)购票主体是小团体,一般不多于6人;(3)少数例外情况外,访问者一个月不到一次从网站购票。
这些参数可清晰总结为如下问题:新使用者从表单3种分类任意选择一种,每种最多6张票。表单很少用,应认为所有受众都是新手,设计应在易学、明显和防止出错方面进行优化。
问题有3个基本解决方案,每个方案采用不同输入控制:文本框,下拉菜单和单选框。
Fandango.com网站设计师选择了基本文本框的解决方案,这种做法明显、直观,但也出现了意想不到的问题。

http://www.flickr.com/photos/rosenfeldmedia/2405434961
很多使用者不知道能用Tab键切换输入框,如何引导使用者在鼠标和键盘之间切换成了问题。结果,大量访问者为了完成交互行为必须在鼠标和键盘之间来回切换。
无法防止输入错误,这个问题不太明显但比较麻烦。如果使用者输入字母或者非整数,网站会弹出JavaScript报错提示窗,这种干扰对系统操作不幸且不必要。
文本框解决方案在明显和清晰方面优势明显,但在效率和预防错误方面缺点也同样明显。

http://www.flickr.com/photos/rosenfeldmedia/2406266586
MovieTickets.com网站采用下拉菜单解决方案。该方案同样明确,但并非没有问题。
这种解决方案更加积极防止错误,在问题出现之前进行阻止,但它采用下拉菜单,而下拉菜单是目前最复杂的输入控制。下拉菜单在布局控制、视觉效果方面是有效机制,可惜下拉菜单很难使用,容易且经常被忽视。
同文本框解决方案一样,该方案牺牲了可用性和明确性来阻止错误发生。

http://www.flickr.com/photos/rosenfeldmedia/2405434787
第三种解决方案,使用单选框收集用户需要的票数量。它跟文本框一样明显,跟下拉菜单一样防止错误发生。
但它同样需要相当多的输入控制,如果每组数量限制在4张票以内,需要12个元素。虽然能用简单图标展现单选框,但是12个模糊界面元素的负担有些过重。
基本分析说明,数据收集问题即使看起来简单,也有多种方式解决,每种解决方式都集合了独特的优势和缺点。设计师的工作是探索和分析可能性,寻求满足受众和应用软件独特需求的最佳解决方案。
|