学习网页制作之浅议 Web 表单设计(2)

3. 用户是否需要浏览完所有的选项，才能理解问题？

比如本例中，“房间类型”这个问题，如果不先浏览所有选项，很难做出判断。在这种情况下，推荐根据情况使用单选按钮或复选框。

4. 有多少个选项？

滚动条是老大难问题了。如果下拉框的选项很多，很有可能导致页面需要滚动、下拉框选择也需要滚动。一般来说 4 个选项及 4 个以内选项的问题，使用单选按钮或复选框会比用下拉框好的多。

5. 用户是否可以同时选择多项？

一般如果用户可以同时选择多项，那么推荐使用复选框。为了避免用户不了解复选框或者不想另外说明，那么有时可以在单选按钮的基础上，增加一个“任意（any）”的选项。比如本例中的“房间类型”。

6. 各个选项是否看上去有区别？

比如“信用卡类型”，“Visa”、“MasterCard”等容易区分。但是对于“人数”来说，假设 01-10，总共两个字符长，使用下拉框不利于浏览（Scan）。而连锁旅馆通常有相似的名字，那么相似的部分可以使用缩写，并且用地名来区分。也可以使用超链接形式来避免此问题。

以上六个问题解决后，可以列出 一张表格（Link to flickr），然后平衡选择，决定哪些信息使用哪种形式表现。

第三步：表单的整体效果和局部调整

尽管按照上面 6 个方面进行了筛选，但是还需要针对表单整体和局部进行调整。主要是以下三方面：

避免太多种类的表单元素

根据第二步，我们得到了“最佳”的选择，如下：

• 姓名：输入框
• 人数：输入框
• 旅馆名：超链接
• 房间类型（单人、双人）：带有“任意”选项的单选按钮
• 信用卡类型：下拉框

发现问题了？形式太多了，又是输入框又是超链接的。这时候可以回过头再看看有没有合理的替代方案。

使选项精简、易读

对于下拉框的原则就是使用户浏览选项的时候更加方便，不会费眼神，不会点错。对于单选、复选的选项，减少选项的数量，同时也可以使用短句来作为选项。

注意选项的顺序和默认值

给选项赋予一个合理的逻辑顺序，比如按首字母排列、按声母序。然后根据普遍情况确定默认值。

第四步：考虑易用性（Accessibility）

可以参考Web内容可访问性指南 1.0

Web 表单可供选择的元素有限，但是要做好也不容易。

本节参考：
Should I use a drop-down? Four steps for choosing form elements on the Web
翻译整理。

关键词：

【推荐给好友】【关闭】

最新五条评论

查看全部评论

评论总数 0 条

您的评论

用户名： （新注册） 密　码： 匿名：

·用户发表意见仅代表其个人意见，并且承担一切因发表内容引起的纠纷和责任
·本站管理人员有权在不通知用户的情况下删除不符合规定的评论信息或留做证据
·请客观的评价您所看到的资讯，提倡就事论事，杜绝漫骂和人身攻击等不文明行为

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有