想學更多的設計知識可以到我們的群（801466587）來交流哦~
無論是登錄檔、多檢視步進器還是單調資料輸入介面，表單都是產品設計中最重要的組成部分之一。本文著重論述了表格設計的常見問題和不足之處。記住，這些是一般準則，每個規則都有例外。
表格應該是一列
多欄會干擾使用者垂直動量。
標籤頂部對齊
頂部對齊的標籤可以很好地在手機上被翻譯。
組標籤及其輸入
把標籤和輸入放在一起，確保欄位之間有足夠的間距，這樣使用者就不會感到困惑。
不要全為大寫字母
全為大寫字母都比較難閱讀。
如果低於6個選項，可以顯示所有可以選擇的選項
在選擇器下拉中放置選項需要兩次單擊，並隱藏選項。如果有超過5個選項，請使用輸入選擇器。如果有超過25個選項，可以在下拉選單中加入上下文搜尋。
將選框放在彼此之下
將選框放在彼此下方可以方便使用者選擇
準確陳述按鈕作用
對按鈕應準確陳述意圖。
顯示錯誤提示
向使用者顯示錯誤發生的地方並提供原因。
在使用者填寫欄位後使用內聯驗證（除非在過程中幫助它們）
在使用者鍵入“--”時不要使用內聯驗證，除非它幫助他們-例如在建立密碼、使用者名稱或帶有字元計數的訊息的情況下。
不要隱藏基本的幫助文字
儘可能地公開基本的幫助文字。對於複雜的幫助文字，請考慮在聚焦狀態下將其放置在輸入旁邊。
區分主次
需要區分按鈕的主次關係。
使用欄位框長度作為啟示
框的長度提供了答案的長度。如電話號碼、郵政編碼等。
顯示出可選欄位
使用者並不會都知道所需的欄位標記（*）所隱含的內容。相反，最好是表示出可選欄位。
群體相關資訊
長長的表單會讓人感到不知所措。通過建立邏輯組，使用者將更快地理解視窗。
使它有趣
生命短暫。沒有人想填寫表格。有趣可以使使用者逐步參與。設計師的角色是表達他們公司的品牌以引起情感上的反應。如果你能正確運用上面的技巧，可以提高你的完成率。
如果你想學習更多關於網頁前端設計的技巧，網頁排版的知識可以去學習一下《歐美範網頁設計實戰課程》，如果你沒有ps基礎可以去學習一下《PS網頁前端設計基礎》這是一套完全免費的教程，相信你將會有更多的收穫~ 如果你喜歡這篇文章或發現它有用，可以點❤，也可以點選分享它，這樣更多的人可以從中受益~