1.1.1 文本框标签

文本框标签主要用于向用户介绍该文本框用来输入什么信息，主要分为文字标签和引导图标两种类型。图1-2（a）与（b）分别展示了以“用户名”和“密码”为例的文字标签和引导图标。在产品设计过程中，在保证用户明确输入信息的前提下，是否使用标签、使用哪种（一种或者两种）标签可自由选择。

图1-2 文字标签和引导图标

文本框标签的位置很灵活，它可以在本文框的上方、左侧、内部，同时还可以设置为左对齐、右对齐或顶部对齐等。图1-3（a）~（f）分别展示了文本框标签顶部左对齐、顶部右对齐、外部左对齐、外部右对齐、内部左对齐和内部右对齐的效果。

图1-3 文本框标签的效果

从图1-3中可以看出，在有顶部、外部、内部3种标签的文本框中，对于顶部标签，用户眼球移动的效率最高。这种样式节省水平空间，但是会占用更多的垂直空间，不适合用于表单过多、空间不足的页面。如果表单信息不多，优先考虑顶部样式；如果较多，则考虑使用外部样式或内部样式。

标签的外部对齐样式或内部对齐样式可以兼顾眼球移动效率和垂直空间的有效利用，但当标签较长时，会占用更多的水平空间，它们适用于表单多、不需要专业理解能力的横向页面。

在对齐方式中，人们对左对齐标签的阅读效率是较高的，因为现代人的阅读习惯是从左至右阅读。采用左对齐方式，在不同样式标签的视觉跳转过程中能比较清晰地展示阅读的起点，帮助读者理解标签信息。

右对齐标签的好处是在视觉的终点，很好地保证了标签的整齐程度，使页面看起来更简洁。在常见的产品设计案例中，大多数文本框标签采用的是右对齐方式。至于在原型设计过程中最终选择哪种对齐方式，我们可以根据实际的表单信息和样式综合考虑。