B端/G端设计中的Form表单思考和解决方案

很多时候我们把G端项目归于B端，他们有很多类似之处，但G端群体确实特殊，在众多To G项目实践中，Form表单是最重要的一环，旨在收集业务数据，监督业务过程，对所收集数据进行统计分析，为政府决策做数据支撑。

Form表单包含标签、输入域、提示信息、必填图标、提示信息、操作按钮等。其中让人头疼的就是标签和输入域到底怎样排列比较合适，常用的有左右结构、上下结构和行内结构三种。在左右结构中，标签又分左对齐和右对齐两种。至于每一种的适用情况和优缺点有很多大神已做过透彻分析，此处不再赘述。

由于政府项目专业性强、系统使用角色众多、业务逻辑复杂、专有名词多，数据采集量大。标签字数长短不一且字数差距较大，很多时候字段顺序不允许调换、长字段不允许简化、一个模块里的字段不允许拆开、输入框填报的字数长短不确定等一系列限制。怎么做到视觉上美观统一又兼顾各种限制情况是我需要思考的问题。

最后落实的解决方案如下图所示（所填个人信息非真实）：

1、标签加了淡淡的背景色，与输入框进行明显区分。标签使用线框规范视觉长度，看上去更加整齐统一，避免了左对齐和右对齐都显混乱的
尴尬。

2、标签文字和输入内容都没有过长的情况下，使用左右结构且一行两组（当然也可以用栅格断点控制组数）。

3、标签过长但输入内容不多时使用上下结构，且一行两组（如最后一组）。

4、标签正常或过长且输入内容过多时，使用上下结构且一行一组（如简历那组，简历输入框的高度会随着内容的增加而增加）。

以上是个人的一点小小浅谈，欢迎大家批评指正，交流不同意见！