1.1.1 文本框標簽

文本框標簽主要用于向用戶介紹該文本框用來輸入什么信息，主要分為文字標簽和引導圖標兩種類型。圖1-2（a）與（b）分別展示了以“用戶名”和“密碼”為例的文字標簽和引導圖標。在產品設計過程中，在保證用戶明確輸入信息的前提下，是否使用標簽、使用哪種（一種或者兩種）標簽可自由選擇。

圖1-2 文字標簽和引導圖標

文本框標簽的位置很靈活，它可以在本文框的上方、左側、內部，同時還可以設置為左對齊、右對齊或頂部對齊等。圖1-3（a）~（f）分別展示了文本框標簽頂部左對齊、頂部右對齊、外部左對齊、外部右對齊、內部左對齊和內部右對齊的效果。

圖1-3 文本框標簽的效果

從圖1-3中可以看出，在有頂部、外部、內部3種標簽的文本框中，對于頂部標簽，用戶眼球移動的效率最高。這種樣式節省水平空間，但是會占用更多的垂直空間，不適合用于表單過多、空間不足的頁面。如果表單信息不多，優先考慮頂部樣式；如果較多，則考慮使用外部樣式或內部樣式。

標簽的外部對齊樣式或內部對齊樣式可以兼顧眼球移動效率和垂直空間的有效利用，但當標簽較長時，會占用更多的水平空間，它們適用于表單多、不需要專業理解能力的橫向頁面。

在對齊方式中，人們對左對齊標簽的閱讀效率是較高的，因為現代人的閱讀習慣是從左至右閱讀。采用左對齊方式，在不同樣式標簽的視覺跳轉過程中能比較清晰地展示閱讀的起點，幫助讀者理解標簽信息。

右對齊標簽的好處是在視覺的終點，很好地保證了標簽的整齊程度，使頁面看起來更簡潔。在常見的產品設計案例中，大多數文本框標簽采用的是右對齊方式。至于在原型設計過程中最終選擇哪種對齊方式，我們可以根據實際的表單信息和樣式綜合考慮。