你还不知道表单怎么设计吗？看这里！
时间：2023-09-14 16:36:01 | 来源：网站运营
时间：2023-09-14 16:36:01 来源：网站运营
你还不知道表单怎么设计吗？看这里！：表单是电子商务、社交互动和大多数基于生产力应用类型的网站的关键。尽可能简单，微小的变化都有可能极大的提高用户体验。
一、设计原则
- 尽量减少痛苦 填写过程尽量简洁、容易。
- 说明填写完成路径 清晰的告诉人们如何完成这一目标。
- 考虑情境 表单并非凭空存在。受众群体、业务决定了如何使用表单。
- 确保一致沟通 表单是顾客和公司对话的中间人。多个团队参与对话，但表单只能用一种声音发声。
二、表单结构
- 构建对话 考虑如何以对话形式而不是盘问的形式组织表单，试着讨好客户。
- 内容组织 为了保证对话流畅，可以将对话分为有意义的组。根据问题数量和情境，将表单分放到多个的网页或单个网页的不同位置。
- 表单命名 表单名称和客户采取的行动一致。
- 清晰的浏览线 客户迅速对问题做出答复，减少客户完成表单的时间成本。
三、表单元素
顶对齐标签：标签和相关输入框相邻；用户只需要在一个方向（向下移动），为填写表单提供了清晰的完成路径。缺点是垂直空间增加。
右对齐标签：标签和相关输入框相邻，能快速填充；左侧不齐，降低快速浏览表单问题的效率，标签长度和输入框组合弹性较小。
左对齐标签：标签长度和输入框组合弹性较小，填写速度最慢。
输入框内标签：节省屏幕空间；填写时标签消失，检查困难。
总结：
如果要减少填写时间，或者出于本地化原因，标签长度需要灵活多变，可采用顶对齐标签；
如果与上述目标类似，但垂直屏幕空间有限，可采用右对齐标签；
如要求人们浏览表单标签，知道必填问题或者回答多个问题中的若干特定问题，可采用左对齐标签；
如果表单非常短，屏幕空间极度有限，可采用输入框内标签，同时应当确保合适的交互和情境。
合理设置输入框的长度；
设置默认值；
区分必填项和可选项，关注必填项与可选项的标注方式与位置；
进行合理的分组；
如果答案有多种格式，应该考虑弹性输入框。
- 动作 完成表单的最终动作，如：提交、保存、继续等动作被称为主动作。可能引起负面结果，如取消，成为次动作。
尽量避免表单中出现次动作，应当提供完成表单的单一路径。想象一下，你填完了全部表单，正要提交时，不小心碰到了取消按钮；
主动作与输入框对齐，能提供清晰路径完成表单；
有次动作时，确保主动作与次动作的视觉差异清晰。
不要依赖帮助文字来弥补表单的缺点。尽量减少表单中帮助文字，以促成更好的设计方案；
输入框内的帮助文字只能用于提供回答问题的方式；
如果人们知道帮助问题答案，但不确定如何回答或者为什么回答，应当考虑自动即时帮助系统；
简单的帮助文字毗邻问题是最清晰的方式；
如果有错误阻碍人们完成表单，应该明确告诉人们。错误消息是表单中最重要的元素，确保以最重要的形式表现错误！
在线咨询
