更新时间：2024-07-19 07:39:54
网站建设
362无论是网站制作还是APP的UI设计，表单都是界面中最常见也是最重要的组成部分之一。它们的应用范围非常广泛，例如用户注册、订阅服务、用户反馈、问卷调查表、商业交易等，从数据录入到信息搜索，几乎无处不在。对于设计师、前端和开发人员来说，需要尽可能多地关注表单的设计，让表单更易于使用。精心的设计将大大增加用户体验和交互效率。
在今天的文章中，您会发现很多与可用性测试、现场测试、用户跟踪和用户反馈相关的表单设计实用建议。
1.理清逻辑，保留必要的
表单是与用户交流的语言。与任何对话一样，它应该有助于双方以合乎逻辑的方式进行交流。所以，你需要做：
保持问题的直观顺序。你应该从用户的角度逻辑地提问，而不是根据程序或数据库的逻辑。如果问题之间没有逻辑，可以按字母顺序排列。
以直观的顺序组织选项。 For example, when the options are dates, they are ordered by Monday, Tuesday, and Wednesday, not out of order.
时刻反思从用户那里获取的信息是否必要，如何使用。这样做是为了消除不必要的选项并提高完成率。
2.使用单列列表布局
一个多栏的表单填写很容易让用户错过，打断填写体验。用户需要按照之字形轨迹填写整个表格，这不仅影响了整个书写路径，降低了效率，还会产生一定的干扰。但是如果使用单栏形式，这个填充路径单一、直接，更直观高效。
3.减少需要输入的字段和工作量
减少要输入的字段数可以使您的表单更清晰并减少加载时间，尤其是对于信息量大的表单。
当然，仅仅减少输入字段的数量是不够的。您还需要注意用户填写表单的方式、内容和工作量。打字内容是一种交互性很强的输入方式，错误率高，时间成本高。因此，需要尽量减少用户的打字，使用复选框、单选按钮、下拉菜单等选项来降低用户出错的概率。
4.匹配输入框和内容的大小
MARD研究所的研究发现，如果一个字段相对于输入框来说太长或太短，都会让用户怀疑自己是否输入了正确的内容。这种情况在输入CVV（信用卡验证值）等字段时尤为明显。
为了良好的可用性，您应该尽可能使输入框的宽度与输入的长度相匹配。适当的预留空间可以让用户更安心。
5.标签放置在相应输入框的上方
用户快速浏览表单是否足够方便？如果用户难以快速扫描表单，则填写时间会更长。所以，好看和填充是好的表单设计的标准。 Matteo Penzo 的文章研究了表单和表单中的输入框应该如何布局，以便用户可以更好更快地浏览和填写。结论是标签应该放在输入框上方。
如果您希望用户尽可能快地浏览，请垂直对齐标签和输入字段并左对齐。请注意，这是快速浏览。这种布局的优点是不需要太多的水平空间。用户只需要向下浏览，不需要左右扫视。这种布局更容易形成响应式UI，兼容不同的屏幕和不同的应用场景。
6.支持灵活多样的格式
一些字段要求用户准确填写，但当要求用户输入特别精确或格式化的内容时，可用性可能会有点问题。如果要求用户输入数字内容（比如电话号码），最好灵活一点，支持多种不同的输入法和显示方式，这样更容易让人查看（而不是机器）和防止错误。
例如，固定电话的格式往往是（777）666-5544，这样更便于用户查看、记录和记忆。
7.不要混合占位符和字段标签
设计人员经常在表单中放置文本占位符，以额外提醒用户如何填写示例。当用户开始输入时，占位符文本将消失。
一些设计人员将标签直接放在输入字段中作为占位符，以减少表单长度和视觉混乱。对于简单的表单设计，这种设计影响不大。当表单信息量大，内容类型多样时，这种设计就不合适了。这种设计的缺点是：
一旦用户点击输入框，标签就会消失，用户很容易忘记输入的内容和形式。当用户看到输入框被填充内容时，会误以为该字段被填充而没有输入。
如果您的表单中仍然需要占位符，您也可以将它们作为浮动标签存在。显示默认占位符，它作为标签浮动以在用户键入时提醒用户。
8.混淆可选和必填字段
正如我之前所说，尽量避免在表单中添加可选字段。但如果你必须加入，至少知道哪些字段是可选的，哪些是
必填的。可选字段数量控制在1~2个以内，明确告知用户是可选的。9.不要使用重置按钮
“重置”使用户可以很容易地删除表单上的所有内容并从头开始。这个风险太大了。在现实生活中，这个按钮从来不会帮助用户。反而因为不小心触碰而更疼。
10.提供高可见性和特定的错误信息
理想情况下，用户可以通过填写表单并上传来完成任务。但现实中，错误是不可避免的。因此，当错误发生时，您应该以高度可用和可见的形式通知用户发生了什么。因此，您提供的错误信息应符合以下规则:
当用户输入字段时，应该实时告诉他们所填写的信息是对还是错，而不是等他们填写完所有信息后才告诉他们出错了。
错误信息应该一目了然，突出显示颜色、图标和文本，错误信息应该靠近输入框，而不是表单的底部或顶部或键的旁边。
如果输入格式是特定的，应该提前声明。
出现错误后，不要清空已完成的表单。
总结
在填写表单时，用户的犹豫是不可避免的。我们应该尽力使这个过程变得方便和容易。我们应该让形式设计成为优势，而不是劣势。极具针对性的表单设计、周到的细节和体验、持续的改进和调整、高效快捷的提交、流畅的流程是一份优秀表单的特征。
我们专注高端建站，小程序开发、软件系统定制开发、BUG修复、物联网开发、各类API接口对接开发等。十余年开发经验，每一个项目承诺做到满意为止，多一次对比，一定让您多一份收获！
