表单可用性测试获取信息：错误或问题的数量和位置
错误或问题的严重程度
完成率
完成整个表单或部分表单的时间
满意度评分
任务主观评价
优秀表单依赖于商业目标、用户需求以及表单情境，还取决于可用性测试、实时网站指标或者其他数据反映出来的问题或机会。
设计原则：尽量减少痛苦（填写过程简洁、容易）
说明填写完成路径
考虑情境
确保一致沟通
选取问题（筛选问题）———构建对话（标签：负责提出问题的表单要素；输入框：负责收集人们回答的答案；当标签含糊不清时可使用清楚明确的对话语言）———内容的组织———归纳区别（内容组之间的差别不需要大量视觉差异，使用最少的视觉信息有助于保持焦点在表单内容
表单名称 与要求人们采取的行动保持一致——起始页 说明填完表单的路径，需要花费大量时间填写的表单可考虑应用——清晰的浏览线 提供贯穿表单的单一路径，使人们可以迅速对问题作出答复并完成任务；一般可采用输入框高度约50%~75%作为问题之间的间隔——注意力分散最少，去除与表单填写没有直接关系的界面元素——进程指示问题分散在多个网页可用，表单页数（范围），表明所处网页（位置），保存并返回进程（状态）【进程指示并不能准确反映表单所要求的页数】1.避免使用进程指示2.市容没有明确设置期望值的进程显示——Tab键跳转易失去方向，所以避免输入框之间存在的任何跳跃，应告诉开发人员输入框的访问顺序
输入框内标签 缺点：光标放入输入框，标签有时会消失造成填写内容的遗忘，有时留在输入框成为答案的一部分
屏幕空间有限可用
输入框的类型
具体参考《用户界面模式》
选择特定交互行为的输入框是优秀表单挑战之一
通常需要平衡有效点击率和出错率、学习能力和效率、普遍情况和个别情况，及弹性和明确性。平衡最终取决于设计团队的判断，对特定受众和使用模型的优化。
输入框的长度
有效暗示
必填项
表单包含很多输入框，但只有一小部分是必填，标明必填项十分有用
若多数问题必填，少数问题可选，标明可选项就十分有用。
标明必填或可选，文字是最清晰的办法，但“*”代表必填项相对容易理解，使用时需用图例解释其含义
将必填项或可选项标识与输入标签相关联
弹性输入框
优点：可以接受多种有效答案形式
缺点：无法让人们以简单方式提供最常见的答案
标签——列出表单要求人们回答的问题；
输入框——填写答案
动作——完成表单的单一职责
主动作和次动作
主动作——完成表单上最重要行为
次动作——例如取消 重置 返回 保存 预览 导出等，与填完表单的主要目标相悖
动作顺序
主动作与上方输入框和标签对齐可提供明确路径完成表单且减少填完表单所花的时间
进程中的动作
处理表单时应明确表达，避免重复提交。
不要依赖帮助文字提醒人们勿进行两次点击主动作，应当通过禁用主动作按钮来阻止用户进行
“告诉”用户应该如何回答问题
可使用简洁帮助文字的情况：
用户不熟悉表单要求填入的数据：什么是PAC代码？
用户质疑为何要填入特定数据：为什么要知道我的出生日期
用户可能会关心数据安全或者隐私：填写信用卡号码安全吗
系统推荐数据填写方式：请用逗号分开标签
说明可填项
自动即时帮助
适用于人们能回答但不清楚如何回答的问题
在帮助信息最合适的时间和位置显示帮助信息。例如点击或用Tab激活输入框，相关帮助文字就出现在输入框的旁边或者下方。
输入框内帮助文字
只能用于提供回答问题的方式
用户激活的即时帮助
适用于表单所含问题复杂或者表单会被相同的人重复使用
在人们需要时立即提供帮助，这种方式通常采用一致的图标、按钮、图片或者文本链接，便于人们知道有帮助可供使用。
采用悬浮触发来显示帮助文字：不会造成内容下移，页面跳动，但只有当指针固定在触发热点时，帮助文字才会显示。
用户激活的区域帮助
适用于多次使用的表格，尤其是复杂问题表单
帮助面板打开后，帮助内容会根据人们在输入框之间移动的情况自动更新
用户激活的帮助文字显示在表单中的一致位置，而不显示在相关输入框的毗邻区域。
可以利用更大显示面积，提供广泛的帮助文字和内容
安全交易
处理敏感信息时，需要额外帮助文字向人们保证信息安全
错误消息
对比色 醒目的视觉要素 突出位置
[if !supportLists]1. [endif]突出消息，表明发生错误
[if !supportLists]2. [endif]双重视觉强调产生错误的输入框
[if !supportLists]3. [endif]同时在两处给出清晰的解释和操作，帮助人们迅速解决错误
成功
不能阻碍人们的进程，而是鼓励人们采取更多行动。
还包括与刚完成任务关联的有用后续操作
采用动态成功消息突出表单提交成功的结果
确认或建议有效答案，并帮助人们在限制范围内输入
适用于错误率高或有特定格式要求的问题，适用于有大量可供选择有效答案的情况
即时质量指示条（例如密码强度条）能引导人们更好回答复杂问题
在人们输入答案完成后进行即时验证或转换特定格式
输入限制应采用实时、动态更新的方法传递
去除问题
智能默认
个性化默认保持客户之前的选择
满足有需要的用户，同时不妨碍不需要的用户
即时增加
叠层
循序渐进
弹性输入——允许人们按照希望的方式回答问题
额外输入——允许人们补充回答想回答的问题
基于选择的输入——根据对初始问题的回答要求人们继续回答
页面级选项
适用于每个初始选项的额外输入选项数量很多
第一步/第一页——向人们显示初始选项，选择其中一个，就会出现相关的选择性输入，取代初始选项。
水平选项卡
将水平选项卡放在面板上方，不仅显示了一组初始选项，而且还发挥了当前选择的强大指示作用。
[if !vml]
[endif]
垂直选项卡
下拉列表
适用于初始选项列表较长
单选按钮下方显示 单选按钮内显示
适用于每个初始选项只有几个额外的输入选项
显示非活动选项
保持所有额外输入可见，但一次只有一组选项可操作
组的显示
注册 参与
网友评论