表單肯定是我們頁面設(shè)計(jì)中經(jīng)常遇到的部分，當(dāng)遇到單選按鈕、復(fù)選按鈕、下拉菜單、問題組合等等聯(lián)合在一個頁面時，我經(jīng)常會顧此失彼，同時也感覺沒有一個outline之類的東西給我指導(dǎo)。
直到——對，你猜對了——讀完這本《web表單設(shè)計(jì)》，感覺自己對表單設(shè)計(jì)的技能點(diǎn)終于被點(diǎn)亮了。下面把書中一些要點(diǎn)羅列一下：
0，少即是多的大原則：去掉不必要的問題，甚至可要可不要的問題。
1、大家都知道用戶在頁面上的視線軌跡是近似Z字形眼動，那么將表單放到用戶可視的第一位。
2、如果有多個并列的問題，一般使用輸入框高度的50%-70%作為問題之間的間隔高度。
3、問題之間都是有聯(lián)系的，可以進(jìn)行分塊，有邏輯的組織各個問題。
4、表單應(yīng)該少使用復(fù)雜的交互和視覺樣式，以免增加用戶負(fù)擔(dān)。
5、但是各組問題之間需要區(qū)隔，使用很簡單的方法（比如虛線、淡背景色）來區(qū)分各組。
6、除了表單自身，頁面其他位置盡可能不要讓用戶注意到，也即是說，頁面其他地方的信息用戶也不應(yīng)該注意到，那么最好不放內(nèi)容。
7、整體流程欄上不要加表示步驟的數(shù)字，因?yàn)樵谔顚懕韱蔚倪^程中，某個步驟可能會被增加（登錄、選擇支付方式等）
8、只在必要的地方出現(xiàn)表單。表單上每個問題都要多問自己幾次：是不是一定得在這兒讓用戶填寫？
9、不要僅僅用顏色來傳遞功能（如出錯時候的提示），各個用戶對顏色的理解是會有偏差的。解決方法是應(yīng)同時使用文字。
10、如果要使用Tab鍵作為表單內(nèi)容間的跳轉(zhuǎn)，要考慮到對于兩欄表單的從第一欄底部跳到第二欄頂部時的顯示問題。
11、一定要有表單名稱，并且符合人們的期望，并簡述表單的目的
12、頂部對齊/左對齊/右對齊，各有優(yōu)劣。頂部，符合眼動效率。右對齊，標(biāo)簽和輸入框距離近。左對齊，方便用戶快速掌握問卷內(nèi)容。根據(jù)場景和表單目的來選擇。
13、如果屏幕空間珍貴，標(biāo)簽內(nèi)容放到輸入框中提示。但這并不適用于問題很多或答案很長的情況，因?yàn)閷懲隉o法check回答的內(nèi)容是不是符合問題。
14、輸入框的長度要和用戶對答案的預(yù)期長度基本符合。
15、如果要對“必填項(xiàng)”還是“選填項(xiàng)”進(jìn)行標(biāo)注，那只有在這兩種問題數(shù)量差異懸殊時標(biāo)注有意義。同時要標(biāo)注問題少的那個。
16、單獨(dú)出現(xiàn)“ * ”是沒有意義的，因?yàn)闆]有圖例說明這是必填還是選填。直接用文字。
17、表單完成時有主動作和次動作之分，一般來說“提交”為主動作。主動作標(biāo)示要顯眼。如果可能，去掉次動作的按鈕。
18、主動作按鈕和主輸入框?qū)R。
19、提交時應(yīng)有動作提示表單已在提交（特別是網(wǎng)絡(luò)不好的時候），避免重復(fù)提交。
20、幫助文字在需要時才出現(xiàn)，不遮擋頁面其他文字，與當(dāng)前輸入框融為一體?！?
21、幫助文字在當(dāng)前輸入時不能消失，否則就失去了幫助文字的意義。
22、如果有多輸入框都需要相同的幫助文字，該幫助文字保持顯示。
23、如果輸入有誤，先告知“出錯”。在出錯的地方用不同的顏色/字號/圖形顯示錯誤
24、多采用即時驗(yàn)證，比如支付寶的驗(yàn)證碼。最適合錯誤率高，或有特殊格式要求的表單項(xiàng)，但要在輸入完成后驗(yàn)證，不要在輸入過程中驗(yàn)證。
25、減少問題是必要的，但是不能增加其他問題的復(fù)雜程度。
26、盡可能在所有地方提供默認(rèn)答案，可以根據(jù)用戶信息或是普遍用戶行為推斷，要符合大多數(shù)用戶的預(yù)期。
以上是書中諸多要點(diǎn)的一小部分，強(qiáng)烈建議大家都去讀一下這本書，去豆瓣看看。
快報
根據(jù)《網(wǎng)絡(luò)安全法》實(shí)名制要求，請綁定手機(jī)號后發(fā)表評論