哈Ha！ 我向您介绍文章“
设计完美表单的10条技巧 ”的翻译。
表单在用户和系统之间扮演门户的角色，并且通常是页面的基础。 授权，注册，状态更新，付款数据或交货地址的输入均由表格控制。 对于在线商店，精心设计的表格起着重要作用。 根据我自己的经验，好的设计会使在线销售翻倍。
由于表单执行用户界面的重要功能，因此有一些设计规则。
1.首先输入数据
从最简单的元素-文本字段开始。 这是许多表单中最常见的组成部分，因此，如果操作正确，您将处于中间位置。
表单有3个主要元素：文本字段，标题和错误消息。 无论选择哪种设计来创建它们，都要确保用户知道所需的信息，并且如果有错误，该如何解决。
标题应放在最上方。
趋势是生而死。 现在以占位符为标题很流行。 尽管没有误解，但使用它会引起一些UX（请注意：“用户体验”）问题。 事实是，填写该字段时，用户看不到标题。
必须始终看到头条新闻。 因此，它们放在顶部。
为什么在上方，而不是在数据输入字段的左侧？
当标题位于文本字段的左侧时，在电话屏幕上，元素将相对于彼此移出。 首先考虑一下手机屏幕上的所有内容。
通过在占位符中指定示例来帮助用户。
支持将标题放置在数据输入字段上方的另一个论点是，用户在垂直线上读取信息，因为根据研究，这比将视图从左列向右移动要快。
2.错误信息和警告
对于标准文本字段，需要错误消息。
以下是设计它们的3个技巧：
由于客户端和服务器，都会发生该错误。
在客户端，如果未填写必填字段或错误输入了电子邮件地址，则会检测到问题：
- 服务器检查给定的电子邮件是否存在；
- 提交表单之前，会通知用户客户端错误。 为了防止用户发送不正确的信息，必须有错误。
检查错误消息
提供有关错误所在字段的信息。 出于安全原因，某些开发人员在授权过程中不会在电子邮件或密码中指出错误，这是绝对正常的。 但是，当用户在购买过程中订阅时事通讯或输入其地址时，请向他指示错误填写了哪个字段以及原因。
每次填写文本字段时，请检查单击发送按钮前后的错误外观。
使用警告
如果该字段需要某些条件，例如，密码必须包含一定数量的字符或组合数字和字母，则通知用户。
指示密码的强度，是否在站点上注册了电子邮件，或者登录是否繁忙。
3.使用匹配的形状
在外观上，如果使用组合，则表单看起来更简洁。 考虑用户如何使用电话中的表格。
如果所有字段均为文本，则用户将不得不不断打开键盘。
要进行更改，请提示用户从文本字段切换到下拉列表（注意：“下拉列表”）或单选按钮，反之亦然。
考虑用户如何握住电话，以及如何消除由于输入数据的相同字段组合而带来的不便。
4.单选按钮，下拉列表和复选框
选择单选按钮，下拉菜单和复选框时，有时会感到困惑。
单选按钮非常适合提供少量可能的答案。 预先选择一个可能的答案或跳过此字段。
当您只能选择一个选项时，单选按钮是最佳解决方案。
如果需要更多元素，则下拉菜单将是更合适的选择（实际上-超过5-6个答案）。 您也可以选择默认项目或将占位符设置为“选择项目”。
如果您只需要填写一个字段（例如，条件和条件），或者提供多个答案，则复选框是最佳选择。 如果您想选择要发送给用户的广告邮件，请选中复选框，以进行多种选择。
使用复选框而不是单选按钮不应限制您的UI设计决策。
作为设计师，您有足够的自由选择UI（注：“用户界面”）元素在屏幕上的显示方式。 即使您想以某种方式更改复选框以使它们更有趣，这也不应该影响用户的感知。
您可以创建图片或图标进行选择，而不必在小圆圈前写文本。
5.如果可能，排除可选字段
如果企业的目标是销售产品，那么作为设计师的目标是消除用户和系统之间的尽可能多的不便。
删除不必要的字段将使用户减少工作量。
申请时，了解不同类型的付款和交付方式非常重要。
如果销售部门想了解客户的喜好，则可以通过确认电子邮件进行。
始终寻找使用最少可见字段的方法。
如果要优化在线商店，请最小化收货地址和结帐字段的数量。
如果要创建用于预订机票的界面，请向用户显示查看可用航班所需的最少字段数。
然后，您可以提供更多条件：袋数等
6.对大型表格使用自动完成功能
根据街道名称的不同，填写地址栏可能会花费很多时间，尤其是在电话上。 正确写入地址可能更加困难。
考虑使用GoogleMapsAPI，以便自动填充街道名称。 这意味着用户只需要输入几个字符并从建议的列表中选择所需的街道即可。 您也可以根据街道名称自动填写邮政编码，但稍后我们将进行讨论。
7.使用条件逻辑
使用逻辑为用户介绍一些信息，以使他的生活更轻松。
- 如果知道用户所在的国家，则设计中可能包含其他字段（如果您在美国，则为“州”，在爱尔兰为“县”，等等）
- 使用邮政编码输入城市，州或省的名称
- 如果要通过IP地址计算用户所在的国家/地区，是否可以在电话输入字段中插入国家/地区代码？
如果要为用户填写某些字段，请始终给他机会自己输入信息。 您可能会误会某些东西。
例如，您使用GoogleMapsAPI在德国找到一条街道。 了解街道名称后，您可以获取区号。 但是，德国的某些街道非常大，因此覆盖了不同的代码，因此对于边境街道，信息可能不正确。 如有必要，请始终为用户提供输入数据的能力。
在世界上所有国家/地区使用条件逻辑将需要进行大量工作，因此您需要了解自己所做努力的含义。 浏览最常收到订单的国家/地区，然后首先开始对其进行优化。 如果这会带来更高的收入，请与其他国家/地区一样。
8.正确使用占位符
我们之前讨论过，占位符并不总是使用，因为在输入信息时占位符会消失。 但是我们没有考虑使用其他可以帮助用户的方法。
占位符是向用户展示如何输入信息的绝佳机会。 一个很好的例子是进入电话。 用户是否需要输入国家/地区代码？ 还是城市代码？
当您需要特定格式的电话或卡号时，请通过提供占位符示例来告知用户。 这是通过简单指出所需信息（国家代码等）来修复错误的好方法。
9.报告下一步。
如果在填写其他表格进行输入之后，通知用户。
代替“下一步”或“付款”，您可以编写“支票订单”或“ PayPal付款”。
单击按钮后添加指示下一步的消息。 订购过程会完成还是用户有时间检查所有内容？ 他会去付款吗？
始终寻找使用户感到舒适的方法，尤其是当它与他的银行帐户关联时。
每次在亚马逊上购物时，我都会感到恼火，因为直到最后一步，我都没有得到包括运费在内的所有信息。 对您的用户诚实。 通过在填充的每个步骤中提供必要的信息来赢得信誉，清楚地说明将来的预期用途。
10.继续寻找优化方法
启动新的明亮表格后，请继续对其进行分析。 如果发现许多用户离开该站点，请找出原因。 进行调查以找出用户不舒服的原因，然后努力解决这种不便之处。 对于设计师而言，工作永远不会“完全完成”。
结论
有时，表单的设计并不是那么有趣，但是如果做得好，它们可以改变用户对站点或应用程序的感知。 仔细设计表单，使用户更轻松。 清楚地给出进一步的指导，提供提示和占位符提示，并建议自动完成，以免用户输入过多内容。