表單設(shè)計很大程度上影響著用戶的使用體驗感，ui設(shè)計中的表單設(shè)計也是非常重要的，不過它有一定原則可以遵循，下面我們跟隨小編一起來了解一下表單ui設(shè)計原則的相關(guān)資料吧。

　　表單ui設(shè)計原則一頂部標簽對齊

　　標簽和輸入框縱向排列靠左對齊的設(shè)計，比起兩者并排擺放效果更好。一方面，這種設(shè)計在桌面端和移動端都足夠友好，另一方面，這樣的ui設(shè)計可以更好兼容不同類型、長短的標簽，便于用戶視線的縱向掃視。不過標簽置于輸入框左邊的設(shè)計也有其優(yōu)勢所在：布局更為緊湊，表單長度被壓縮，顯得更短，在特定的頁面布局需求下，可能是更好的選擇。

表單ui設(shè)計原則

　　表單ui設(shè)計原則二關(guān)聯(lián)標簽和輸入框

　　多列的表單容易讓人分心，無法完全垂直瀏覽一口氣完成填寫。讓相關(guān)聯(lián)的標簽和輸入框更靠近，組成分組，讓不同的分組保持相對大的距離，確保用戶不會產(chǎn)生困惑。

　　表單ui設(shè)計原則三低于6個選項就全部展示

　　當表單中需要選取不同選項的時候，低于6個選項就不要使用下拉選框來選取了，因為下拉選框需要兩次點擊完成結(jié)果的選擇，而直接選擇來的更快。而超過5個選項的時候，選項過多，適合下拉選框的展示形式。

　　表單ui設(shè)計原則四避免將標簽作為占位符使用

　　為了讓布局更緊湊，將標簽作為占位符放置于輸入框內(nèi)是很有誘惑力的做法，但是這樣存在一定的可用性問題：讓部分用戶迷惑內(nèi)容已經(jīng)被填寫;點擊輸入的時候占位符消失，有的用戶會忘記輸入內(nèi)容屬性。

　　表單ui設(shè)計原則五讓內(nèi)容長度和輸入框長度對應(yīng)

　　輸入框的長度應(yīng)該同輸入內(nèi)容進行對應(yīng)。諸如郵政編碼、電話號碼和銀行卡號這樣的字段，長度都是固定的，在設(shè)計它們的輸入框的時候，輸入框的長度是很好確定的。

表單ui設(shè)計原則

　　表單ui設(shè)計原則六不要隱藏基本的幫助文本

　　將基本的幫助文本直接展示出來，除非你的幫助文本超過100個單詞，信息量過大。如果幫助文本內(nèi)容過長，建議置于靠近標簽或者輸入框的地方，光標懸停時展示。

　　表單ui設(shè)計原則七相關(guān)信息分組

　　過長的表單常常會讓用戶感到煩躁和不知所措，應(yīng)當根據(jù)特定的邏輯、內(nèi)容屬性將相關(guān)的內(nèi)容分組，強化表單整體的形式感，用戶覺得更容易填寫表單，也更容易完成。

　　相信有了小編為你整理的這一份超級詳細且超級實用的表單ui設(shè)計原則以后，一定可以幫助你界面設(shè)計出更加符合用戶使用需求的ui表單哦!