4个鼓舞人心的表格设计模式[免费]

HubSpot进行的一项研究发现，82%的受访者表示曾因不良或不完整的表单而放弃了网站购买漏斗，其中93%的人是在台式电脑上首次遇到这些表单。

表单是您的网站和业务的重要组成部分，无论您是进行投票、为潜在客户提供联系您的方式，还是鼓励通讯注册。有很多方法可以制作一个漂亮的、有效的网络表格，但总是有改进的余地。

4个鼓舞人心的表单设计模式[免费]

一个精心设计的表单可以为整个设计增加价值，而不会减损其实用性。此外，这样的表单表现也会好很多。在Salesforce的新UI设计框架Lightning中，小的表单设计变化可能会改善表单转换。让我们深入了解一下。

无框表单

无框网络表单是指没有可见框或边框的网络表单。它使Web表单看起来更现代、更有现代感，因为它们没有传统的、周围有框的Web表单的外观。

基于曲线的网络表格利用弯曲的线条和边角来创造趣味。曲线可以在形状和布局中找到。设计良好的曲线盒不一定需要遵循传统的盒式设计。如果做得正确，曲线甚至可以引导人们的视线围绕整个网页形式，增加负空间和正空间之间的张力。

动画形式

动画形式设计是在表单本身中设计一些动画。它可以在许多不同的层面上进行，从帮助创造兴趣和吸引注意力的简单动画（如跳动的箭头和按钮）到更复杂和精心设计的动画网页设计，如背景动画或页面之间的过渡。使用这种动画效果的主要目的是使你的用户体验尽可能有吸引力--我们都知道用户在那些乏味的网站表格中很纠结！

从底部或侧面滑入

这个webflow模板使用户可以在任何时候提交一个联系表格，而不影响整体外观。你可以通过在网站底部添加一个联系按钮，让消费者随时与你取得联系。

你也可以利用一个滑出式菜单让人们访问你的表格。与其把访问者送到联系页面，不如把表格从屏幕的侧面拉进来。这是一个很好的模式，当有人可能想在协助时查找网站上的信息。

全屏表单

将注意力带到你的表单的一个很好的技巧是消除干扰因素。与其将您的表单塞进您网站上一个已经被划定的位置（如页脚），不如尝试纳入一个参与点，使其成为全屏。它可以帮助您的用户以一种简单而集中的方式输入他们想要的信息，使他们更容易完成。

自然语言表单

如果网络表单可以说话，它们可能听起来像这样。"您即将提交您的信息。你确定吗？这是必须的。"网络上的表单并不总是像我们希望的那样简单明了。今天，我们期望网络体验和用户界面更加人性化和熟悉；例如，与网页的互动应该感觉更像说话而不是打字。自然语言输入是我们可以让网页表单感觉更有对话性的方法之一--也就是说，不只是另一段需要填写的书面文字。自然语言界面通过提出问题来帮助用户，使人类提出问题。它允许你创造一个对话的环境，同时也通过利用传统的表单标签和输入框模式减少误解。它也有一种独特的、精心设计的感觉。

分步式（程序式）表单设计

分步式网络表单设计允许你将信息部分分解成易于消化的部分，以便于遵循。

这个网页为用户提供了一条清晰的路径来完成网页表单的步骤，标题和视觉提示都在引导他们前进。

让人们以易于理解的方式添加信息，可以鼓励人们向前迈进，并提供一个比简单地一次性显示所有字段更集中的体验。

结论

网络是一条双向的道路，我们必须为用户创造有价值的网络内容，并通过令人兴奋的网络表单设计来保持他们的参与度。表单是网络浏览体验中不可或缺的一部分，所以为什么不花一些额外的时间来思考如何使你的网络表单尽可能地吸引人呢？通过思考这些模式，并在我们的网页表单设计中加入更多的人情味，我们可以帮助减少辍学率，同时鼓励更好的参与，减少混淆。