行业关键字
UI设计UI理论和资料 → 正文
互联网表单设计 第五章 输入框(1)
作者: yummy 译 来源: 视觉同盟 时间: 2009年6月10日

原著Web Form Design: Filling in the Blanks,作者Luke Wroblewski 。

明确了表单所提问题及其表现方式,接下来需要提供给人们回答问题的方法。现在来讨论输入框:复选框、单选框、下拉菜单以及不同大小的文本框。

输入框类型

选择适合特定交互行为的输入框属于交互设计基础问题,有些超出本书范围1。但仍有必要总结网络表单何时使用复选框、单选框、下拉菜单及文本框(图5.1和表5.1)。


图5.1  http://www.flickr.com/photos/rosenfeldmedia/2367265752
网络表单不同类型输入框。

表5.1 输入框类型

输入框  描述
文本框  输入任意数量的任何字符(字母、数字或者符号),一行或多行。
单选框  从两个或多个总是可见的互斥选项只选择一个。单选框代表互斥关系,应有默认选项(稍后详述)。应确保选择输入框或其标签都能激活单选。
复选框  选择列表中任意选项,一个或多个,数量不限。一个选项选择一个答案通常用于“是”或“否”的问题。使用复选框时,应确保选择输入框或其标签都能激活选择。
下拉菜单  从两个或多个排他性选项只选择一个。不使用时,下拉菜单仅显示当前被选项。下拉菜单占用屏幕空间最小,如果互斥选项较多,下拉菜单优于单选框。虽然有此优点,应避免下拉菜单中选项很多,特别是人们会很熟悉选项的情况(比如选择居住州)。
列表框  可做为单选框使用(人们从互斥选项只选择一项),也可以当作复选框使用(人们可选择多项)。列表框可以像下拉菜单一样设定显示更多选项,而占用空间比单选框或复选框要少。虽然有这些优点,列表框双重性质(单选或多选)容易给很多人带来问题。因此,互联网表单极少使用列表框。

请注意,上表未包括按钮。后面会用一整章讨论按钮问题。

1. 阅读Bob Baxley著作Making the Web Work(2002,New Riders出版),深入了解合适采用输入框。

(责任编辑: echo

作品欣赏

欢迎关注视觉同盟微信公众号:
微信公众平台:搜索“vudn2004”或扫描下面二维码:
English | 关于我们 | 站点地图 | 联系热线 | 合作伙伴 | 艺术顾问 | 订阅 | 手机版
版权所有 © 2004-2026 视觉同盟 visionUnion.com)
Copyright © 2004-2026 VisionUnion.com Incorporated. All rights reserved
京ICP备09005192号
视觉同盟旗下子站:品牌专区 | 创意设计人才网 | 视觉同盟社区 | 视觉同盟论坛 | 英文版