每個表單至少都有三個基本要素:標(biāo)簽唬涧、輸入框和動作疫赎。標(biāo)簽負責(zé)提出問題;輸入框供給人們填寫信息碎节;動作允許人們提交答案捧搞。
一、標(biāo)簽對齊
左對齊钓株、右對齊、頂對齊
如何選擇視情況而定陌僵。正確的解決方案都取決于具體目標(biāo)和制約因素轴合。
1、頂對齊標(biāo)簽
優(yōu)點(advantage):標(biāo)簽和相關(guān)輸入框相鄰碗短,處理起來毫不費力減少了表單填寫時間受葛;人們一般只需在一個方向移動(向下),因此為填完表單提供了清晰的完成路徑;大量橫向空間可用于多種方式組合相關(guān)輸入框(如圖1.3)总滩。
缺點(disadvantage):垂直空間增加
2闰渔、右對齊
優(yōu)點(advantage):標(biāo)簽和相關(guān)輸入框相鄰席函,能快速填完;占用較少垂直空間冈涧。
缺點(disadvantage):左側(cè)不齊茂附,降低快速瀏覽表單問題的效率;標(biāo)簽長度和輸入框組合彈性較小督弓。
3营曼、左對齊
優(yōu)點(advantage):占用較少垂直空間。
缺點(disadvantage):標(biāo)簽長度和輸入框組合彈性較杏匏怼蒂阱;填寫速度最慢
4、輸入框內(nèi)的標(biāo)簽
優(yōu)點(advantage):節(jié)省屏幕空間狂塘。
缺點(disadvantage):填寫時標(biāo)簽消失录煤,檢查困難。
總結(jié):
1、如果要減少填寫時間硝训,或者出于本地化原因响委,標(biāo)簽長度需要靈活多變,可采用頂對齊標(biāo)簽窖梁。
2赘风、如果與上述目標(biāo)類似,但垂直屏幕空間有限纵刘,可采用右對齊標(biāo)簽邀窃。
3、如要求人們?yōu)g覽表單標(biāo)簽假哎,知道必填問題或者回答多個問題中的若干特定問題瞬捕,可采用左對齊標(biāo)簽。
4舵抹、 如果表單非常短肪虎,屏幕空間極度有限,可采用輸入框內(nèi)標(biāo)簽惧蛹,同時應(yīng)當(dāng)確保合適的交互和情境扇救。