無論是注冊流程妆绞，多視圖步進或單調(diào)的數(shù)據(jù)輸入界面，表單都是數(shù)字產(chǎn)品的設(shè)計中最重要的組成部分之一枫攀。本文重點介紹了常見的表單設(shè)計樣式和要避免的注意事項括饶。但請記住，這些都是一般準則来涨，每一個規(guī)則都有例外图焰。
1、表單應(yīng)該排成一列
多列排布會分散用戶的豎向注意力
2蹦掐、標(biāo)簽頂部對齊
相比使用左對齊的標(biāo)簽技羔，使用頂部對齊的標(biāo)簽后，更高比例的用戶會完成表單的填寫卧抗；頂部對齊的方式也更適用于小屏幕的手機藤滥。不過，在面臨多選項多數(shù)據(jù)的輸入時社裆，盡量還是考慮左對齊標(biāo)簽拙绊，這樣用戶更容易一起瀏覽，
3浦马、將標(biāo)簽跟輸入框作為綁定的一組
把標(biāo)簽和輸入框靠在一起时呀，相鄰輸入框間設(shè)置合適的距離避免用戶困惑
4张漂、避免全部大寫
全部大寫的標(biāo)簽會造成閱讀和瀏覽上的困難
5晶默、如果可選項少于6個，全部顯示出來
若將選項隱藏至下拉列表中航攒，用戶需要執(zhí)行兩次點擊才能完成選擇磺陡；這種方法最好在選項數(shù)量多于5個時再去使用，當(dāng)數(shù)量甚至超過25個時，最好將搜索也融入其中
6币他、避免使用占位文本作為標(biāo)簽
使用占位文本確實能優(yōu)化屏幕空間的利用坞靶，但其會帶來一些可用性問題，詳見這里：https://www.nngroup.com/articles/form-design-placeholders/
7蝴悉、將復(fù)選框（或單選按鈕組）垂直排列
將復(fù)選框垂直排列易于閱讀
8彰阴、使“行為召喚”類按鈕具有描述性
一個行為召喚類按鈕應(yīng)該描述其目標(biāo)意圖
9、在行內(nèi)指明錯誤
在錯誤發(fā)生的地方告訴用戶拍冠，并指明原因
10尿这、在用戶完成輸入后再執(zhí)行行內(nèi)校驗（除非在輸入過程中執(zhí)行有用）
用戶輸入過程中不要使用行內(nèi)校驗——除非確實能幫到用戶——比如在設(shè)置密碼、用戶名過程中字符長度唱超過限制時
11庆杜、不要隱藏基本的幫助文本
要盡可能顯示出基本的幫助文本射众。對于復(fù)雜的幫助文本，可以考慮在輸入框獲得焦點后將其放置于輸入框旁邊
12晃财、主要選項和輔助選項要做區(qū)分
關(guān)于是否應(yīng)該顯示輔助選項甚至在哲學(xué)界引發(fā)了一場很大的爭論
13叨橱、使用合適的輸入框長度
輸入框的長度應(yīng)該令用戶可預(yù)見能夠輸入的字符長度，面對有明確長度邊界的字段時（比如手機號断盛、郵編）罗洗，最好這樣做
14、避開使用*钢猛，標(biāo)示出可選項
用戶并不總是知道標(biāo)簽后的*暗示什么栖博，還是最好將可選項標(biāo)示出來
15、將關(guān)聯(lián)信息分組顯示
批量性的長表單通常令用戶無法忍受厢洞，通過將相關(guān)信息分成合理的一組仇让，用戶能夠更快的理解表單元素間的關(guān)聯(lián)
譯自：https://uxdesign.cc/design-better-forms-96fadca0f49c#.q9x1ddl3n
