原文鏈接：

UI/UX筆記之如何設(shè)計(jì)好表單 | 須臾所學(xué)免費(fèi)設(shè)計(jì)資源網(wǎng)?presentationvip.com

無(wú)論是注冊(cè)流程，多視圖步驟程序還是單調(diào)的數(shù)據(jù)輸入界面，表單都是數(shù)字產(chǎn)品設(shè)計(jì)中最重要的組成部分之一。本文重點(diǎn)介紹表單設(shè)計(jì)的常見(jiàn)事項(xiàng)。請(qǐng)記住，這些只是一般準(zhǔn)則，每條規(guī)則都有例外。

表單應(yīng)為一欄

多列破壞了用戶(hù)的垂直動(dòng)力。

頂部對(duì)齊標(biāo)簽

相對(duì)于左對(duì)齊，頂部對(duì)齊標(biāo)簽使得用戶(hù)能以更快的速度完成表單填寫(xiě)，頂部對(duì)齊的標(biāo)簽在移動(dòng)設(shè)備上的翻譯效果也更好。但是，左對(duì)齊的標(biāo)簽可以用于大型數(shù)據(jù)集輸入的表單，因?yàn)榕c頂部對(duì)齊的標(biāo)簽相比，它們更易于一起瀏覽，在減小高度的同時(shí)也可提示更多注意事項(xiàng)。

將標(biāo)簽和輸入框分為一組（親密性原理）

將標(biāo)簽和輸入端放在一起，并確保字段之間有足夠的高度，以免使用戶(hù)感到困惑。

切勿文字全部大寫(xiě)

所有大寫(xiě)字母使用戶(hù)更難以閱讀和瀏覽。

如果選項(xiàng)低于6個(gè)，則顯示所有

將選項(xiàng)放置在選擇器下拉菜單中需要單擊兩次，然后將其隱藏。如果有5個(gè)以上的選項(xiàng)，請(qǐng)使用輸入選擇器。如果有25個(gè)以上的選項(xiàng)，則將下拉列表和文本搜索輸入選擇器結(jié)合一起

拒絕使用占位符文本作為標(biāo)簽

通過(guò)使用占位符文本作為標(biāo)簽來(lái)優(yōu)化空間是很誘人的。這會(huì)導(dǎo)致許多可用性問(wèn)題，這些問(wèn)題可參考Nielsen Norman Group的Katie Sherwin總結(jié)。

將復(fù)選框（和單選按鈕）上下排列放置以提高可讀性

使CTA召喚動(dòng)作按鈕更具瀏覽可讀性

按鈕文字要更精準(zhǔn)，減少用戶(hù)思考

就近提醒出錯(cuò)

向用戶(hù)顯示錯(cuò)誤發(fā)生的位置并說(shuō)明原因

用戶(hù)填寫(xiě)字段完成后再提醒/驗(yàn)證（除非在此過(guò)程中有幫助）

用戶(hù)鍵入時(shí)不要使用提醒/驗(yàn)證（除非有幫助），例如創(chuàng)建密碼，用戶(hù)名或帶有字符數(shù)的消息時(shí)。

不要隱藏基本的幫助提示文字信息

盡可能公開(kāi)基本的幫助提示文字信息；對(duì)于復(fù)雜的幫助提示文字信息，請(qǐng)考慮在其聚焦?fàn)顟B(tài)下將其放置在輸入框旁邊。

將主要?jiǎng)幼髋c次要?jiǎng)幼靼粹o區(qū)分開(kāi)

關(guān)于是否應(yīng)包括次要選擇權(quán)，存在著更大的哲學(xué)爭(zhēng)論。

使用特定字段長(zhǎng)度設(shè)置表單輸入框長(zhǎng)度

字段的長(zhǎng)度提供了表單輸入框長(zhǎng)度；將其用于具有已定義字符計(jì)數(shù)的字段，例如電話號(hào)碼，郵政編碼等。

放棄*并用文字提示可選信息

用戶(hù)并不總是知道所需字段標(biāo)記（*）隱含的含義。相反，最好用文字提示可選信息。

分組相關(guān)信息

讓用戶(hù)分批思考，長(zhǎng)篇幅會(huì)讓人感到不知所措。通過(guò)創(chuàng)建邏輯組，用戶(hù)將更快地理解表單。

總結(jié)

以上是生活随笔為你收集整理的什么标签用于在表单中构建复选框_UI/UX笔记之如何设计好表单的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。