每个表单都至少有三个基本要素:标签、输入框、动作。标签则负责提出问题。
标签除了要简洁清晰让人们明白外,还应具备良好的布局。
一、三种常见的标签对齐方式
输入框标签包括顶对齐、右对齐和左对齐。如下图所示:
下表中详细列明了三种对齐方式的优缺点:
马泰奥·彭佐的眼动研究发现三种对齐方式的填写速度:
可见,填写速度分别是顶对齐最快,其次是右对齐,左对齐最慢。
二、输入框内标签
这种做法可以节省宝贵的屏幕空间,但是填写时输入框内的标签会消失,如果突然忘记了要回答什么问题,可能一时半会找不到标签。因此该方案并不适用于表单太长甚至中等长度的表单。
该方式更适用于问题只有一个的表单如搜索框,或者问题很熟悉如通讯录。
不明显的问题不建议采用输入框内标签。
现在开发人员通常使用placeholder属性来设置输入框内表签。
三、混合对齐方式
如果考虑在同一工具或网站不同表单采用不同的对齐方式,应当平衡情景和一致性。而情景常常比一致性更重要。
同一表单中不建议使用不同标签对齐方式,会破坏明确完成路径,让人们感到迷惑。