注册表单是要左对齐还是右对齐

上一篇围绕对齐和连续流这两个设计原则，谈了信息设计中用到的几种对齐方法以及和连续流的关联，这一篇尝试用这些原则分析注册表单选项该怎么设计。

注册表单，也就是我们在注册网络产品或者填写信用卡申请表时的东西，目前主流的表单有两种，一种是项目左对齐，另一种是项目靠着输入框作右对齐。目前两者都有很多实例存在，不能说谁对谁错，不过相信经过下面的分析，我们能对这两种方式产生更理性的认识。

首先看左对齐的优点
1、有两条对齐引导线（选项左对齐线与输入框对齐线），适合浏览（从上往下查看表单各个选项）
2、整体外观规整，视觉效果好，容易配合各种页面。

从前面的对齐原理看，左对齐方式做的很棒，有整齐划一的信息和整体的美感，并且有效引导人们的目光以一定的规律移动，也就是从上往下，然后问题也出在这里了。

用户在填写表单的时候，并不是先从上往下阅读选项，接着从上往下填写右侧输入框。正常的用户是看一个选项填写一个输入框，然后再换下一行，这在几天前的讨论中我也提到了，所以用户在这里的目光移动轨迹实际是一个不断重复Z字形的折线。

那么，左对齐方式存在的问题就很明显——当选项文字长短不一时，个别字数较少的项目和输入框间距会很大，从连续流原理上看，较大的间距使得两者对齐于同一横向直线的视觉引导减弱，也就降低了两者的关联度，没有很好的引导用户按照合理的视觉路径，换个更简单的说法就是，我填写的时候有点瞄不准当时填的输入框对应是左侧哪一行。而且选项相互左对齐，产生的对齐引导线非常醒目，更加干扰用户左右来回的浏览。

另外，这种方式也势必导致目光的每次来回移动的Z字距离都是最长的。

再来看右对齐。选项与输入框之间的距离缩小到最小，很方便的从选项顺势浏览到右侧的输入框，有良好的连续流，使两者的关联度得到加强，符合用户左右来回的视觉行为；另外，选项右对齐线与输入框左对齐线靠在一起，相当于二者都有对齐，并且对齐与同一直线，这样，不仅使选项及输入框两者分别有从上往下的对齐暗示，也兼顾到了整体视觉美感。

所以，我的观点还是和那天一样，选项右对齐在注册表单中更为合理。

不过右对齐也有它的缺点，相比左对齐，整个表单外部的规整性就不如左对齐，尤其当选项数很多，长短参差不齐时，左侧会产生一条很乱的不规则锯齿，像是蝴蝶翅膀剪了碎发，毛毛糙糙的。所以，使用右对齐方式时最好控制一下表单项目数，缩短左侧不整齐边缘，弥补整体美观。

比如亚马逊的注册表单，控制了左侧选项数目。

有的时候设计需求就有很多，选项不可能减少，那么合理的分割选项，使得本来大片的不规则边缘变成几个短的区块，这也是一种有效的办法。参见开心网的注册表单。

如果分割开了还是觉得不够整洁呢？那就从根源解决这个问题。

导致外观不规整的原因是失去左侧的对齐引导线，不如我们再额外给他补上，最有效的办法就是直接给表单画上可见的表格线，还可以给需要加强的行或列增加底色，进一步强化对齐。参看淘宝注册页面。

前面介绍的都是适应性较强的方式，能普遍应用到大部分注册表单，还有一些特殊的设计形式，把选项和输入框完全揉在一起设计，看似有点乱，但是按照用户实际使用操作时目光轨迹而设计的，虽然不能产生良好的整齐划一感，但是实际用起来却是非常有效。比如百度和豆瓣的注册表单。

注册表单差不多就这么几种形式，具体使用哪一种还要根据实际情况再决定，遵守设计原则能帮助设计师在设计信息时不犯错误，并且建立一个有效的评估标准。

最后引用《最佳设计100细则》作者威廉·利德威尔的忠告：优秀的设计师有时并不理会设计原则，但是，他们这样做，尽管因违反原则而付出了代价，他们往往会进行一些补救，取得最佳的效果。如果没有这个水平，还是遵循设计原则为好。