那些使用你的APP或网站的移动用户都有特定的目标。通常处在用户和他的目标之间的是各式各样的表单。事实上我们通常将表单视为目标达成的最后一步。用户尽可能快地完成表单的填写，没有任何迟疑，由此可见表单的重要性。

使表格填充变得简易便捷，可以遵守以下七条原则：

原则#1：表单应该与用户输入数据的方式相协调

确保表单区域不会被类似键盘等界面元素遮挡住视线。用户完成表单后，自动将表单区域向上推进。

原则#2：尽量减少输入字段的数量和用户输入努力

如果一个表单看上去越长和越复杂，用户就越不愿意去填写这些空白——特别是在小尺寸的屏幕上。限制输入字段的数量可以减少表单的加载，特别是你为用户请求了一个包含大量信息的表单。

令表单尽量保持短小简洁。

但是仅仅限制输入字段的数量是远远不够的——你也应该关注用户输入所耗费的精力。表单输入拥有极高的交互成本；在拥有全键盘的情况下，大量表单依然容易犯错和浪费时间（更不用说在触控屏上了）。

因此，让表单保持短小简洁从而让用户避免犯错。

智能的默认设置

智能的默认设置能让表单完成得更快速和更精准。比如预选用户国家应该基于用户的地理位置数据。

自动定位检测能在寻找酒店的表单上节约用户时间

单选项按照紧密相关度分组，但保持相互独立的选择

当用户需要在选项清单中做出选择，考虑使用水平标签列表，因为这种方式能充分利用屏幕空间。

为价格或预算变化的最大/最小值设置滑动条

考虑在包含价格或预算的区域使用滑动条，用户就能移动滑动控制器来设置最小值和最大值的变化区间。滑动条便于水平滑动，并提供简单的可视化提示来自定义选项值。但是要记住，当滑动条处于操作状态时，数字不能被隐藏（体谅胖纸）。

AirBnB设置价格区间的双边连续滑动条

原则#3：表单标签既不是出于表单区域之上也不是浮动标签

标签告知用户该区域的目的，并且简洁的标签文本是保持UI更加易用的一种基本方式。

 

禁用行内标签的理由

行内标签（或称表单区域占位符）是位于一行表单内的文本，当在表单内输入信息，该文本将会消失。

行内标签看上去非常棒，也节省了宝贵的屏幕空间，它所带来的价值远远超过它主要的可用性缺陷——最主要的是缺乏上下文联系。

当用户点击文本输入框，行内标签就会隐藏。此时，用户无法复查他们填写的内容是否是表单所需要填写的。

占位符对可视化表单而言是个不合格的替代者。

另一种情况是，当用户看到表格内已经写入了一些东西，他们会误以为这个表格已经被预先填写，从而忽略它。

左对齐的字段标签在移动设备上会很糟糕

其标签，在窄屏上只能留下少量空间。这是一个创建可用性问题，通常表单区域的宽度不足以显示用户输入的全部内容。看不见正在输入的数据可能带来麻烦，因为在提交表单前，这种对齐方式更难发现输入字符的问题，从而导致用户提交过多的错误表单。

如果输入数据不能全部可见，发现错误之处会变得非常困难。

标签放置在输入框上方或者采用浮动标签

表单标签应该处于表单区域上方，用户才能了解他们填入的是什么，为什么填入。将标签置于表单区域上方的主要好处就是能士表单区域横向铺满屏幕，确保在输入状态中有足够大的可视范围（采用适中的字体大小，比如16px）。额外的好处就是能定义更加明确和有意义的区域标签，而不用被字数局限。

将标签置于表单区域上方的负面影响则是会占用大量的垂直空间，这意味着用户必须向下滚动更多的屏幕。幸好这并不是特别严重的问题，如今滚屏是再正常不过了。

再者，你可以采用浮动标签，确保他们能填写正确的表单。占位符是默认显示的，一旦输入框被点击，同时输入了文字，占位符在隐藏的同时，一个小巧的对齐标签浮现在表单内部的上方。

原则4：表单输入需要实时验证

理想状态下，用户能将必要信息填入表单并提交成功。而在现实中，他们则经常犯错。但很明显用户不喜欢在完成所有表单填写并提交时，APP无情地告诉他们出错了。提示填入数据正误的正确时机应该在用户刚刚完成表单填写的时候。实时的在线验证能立即提醒用户填入数据的正确性。这一方法允许用户快速修改错误，而不用等他们点了提交按钮再展示错误提醒。

如果在某个特殊表格的答案是必需的，你可以作出提前声明，传达这个强制的规则（格式规范），不需要举例说明。

在线验证也能减少硬弹回（直接被用户拒绝使用）。下面就是一个很棒的例子，它提供了一个解决可能存问题的办法。

原则#5：键盘要与表单输入类型相匹配

如果一款APP为文本输入提供了恰当的键盘方式，用户会非常欣赏这一点。比如当用户需要输入信用卡账号，只需要显示拨号盘，让用户只输入数字而不是字母。这样可以减少他们的选择和犯错的概率，从而提高输入的完成效率。

确保这一规则能在整个APP中得到贯彻，而不是只在部分功能中体现。

规则#6：在上下文中提供帮助信息

有时你需要在上下文中准备好相关信息，帮助用户轻松完成表单填写。但附文应该只在需要它的地方出现。

• 在选择日期时，让用户使用带月视图的日历确定日期，排除用户切换到系统日历查看的多余操作。这样也能避免被其他任务干扰。

• 用户可能担心数据的安全或隐私问题，你必须向他们做出保证，不会将数据传播到第三者。

• 提供一个经验法则，说明不要超过100个字。

规则#7：采用宽容的格式

有些表单确实需要用户输入精确的信息，但强制用户在某种具体的表单格式中输入信息会与一些优良的可用性原则相违背。如果你要求用户在表格输入数字类型的信息（比如电话号码），可以灵活地处理，将输入框设计得好像支持多种输入格式，而且你也可以将信息设计得方便观察，防止出错。

结论

用户会在输入表单时表现出犹豫迟疑，因此你应当将填写表单的过程设计得尽可能简单。所有文中所描述的转变方式将会大大提高表单的可用性。

Thank you!

Nick Babich