国产一精品一aⅴ一免费-国产一精品一av一免费-国产一精品一av一免费爽爽-国产一久久香蕉国产线看观看-国产一卡2卡3卡四卡高清-国产一卡二卡3卡4卡视频

當前位置: 首頁 > 設計資訊 > 理論文摘 > 正文

必考考點!這些表單設計的基本準則你都知道嘛?

2017-12-05 2044 0

表單可能是日常UI設計中最常見的設計元素了,它廣泛的應用范疇、多年來的積淀使得表單設計牽涉到大量的、約定俗成的設計規則。今天我們來聊聊這些最常見的表單設計準則~

表單可能是日常UI設計中最常見的設計元素了,它廣泛的應用范疇、多年來的積淀使得表單設計牽涉到大量的、約定俗成的設計規則。今天我們來聊聊這些最常見的表單設計準則~

無論是注冊網站還是內容輸入,總是回避不了表單這種UI控件。表單幾乎是每一個數字產品都無法規避的組成部分,它的作用近乎無可替代。不過,表單這種控件應用范疇極為廣泛,應用情況牽涉到方方面面,所以請注意,今天的文章里我們所提及的設計準則都只是一般準則,每一種其實都有例外的情況。不過作為一般準則,它們可以很好地引導你設計出一個可用性極佳的表單,同時,作為設計師的你還需要根據實際情況,靈活地調整細節。

接下來,我們一起來看看這些準則都包含了哪些內容吧。

盡量使用單列設計

1-XhzxeTnAuWoaeJmlPBP0bw.jpeg

多列的表單容易讓人分心,無法完全垂直瀏覽一口氣完成填寫。

頂部標簽對齊

2.jpeg

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

關聯標簽和輸入框

3.jpeg

讓相互關聯的標簽和輸入框更加靠近,組成分組,讓不同的分組保持相對較大的距離,確保用戶不會產生迷惑。

避免字母全大寫

4.jpeg

全部字母大寫會難于閱讀和快速掃視。

低于6個選項就全部展示

5.jpeg

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

避免將標簽作為占位符使用

6.jpeg

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

復選框應當縱向排列

7.jpeg

縱向排列復選框讓用戶可以更快的掃視內容,便于進行選取。

表述清晰的行為召喚按鈕

8.jpeg

行為召喚按鈕中的標簽必須使用簡短而明確的詞匯,讓用戶明確行為的意圖和功能。

指明出錯的內容

9.jpeg

當用戶填寫內容出錯的時候,應當指明發生錯誤的條目,以及錯誤的原因。

在用戶填寫完后再驗證

10.jpeg

除了需要在輸入過程中進行實時驗證,普通的內容輸入應當在用戶輸入完成之后再對內容的格式、屬性進行驗證,這些時候盡量避免使用內嵌驗證。

不要隱藏基本的幫助文本

11.jpeg

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

區分主要操作和次要操作

12.jpeg

主要操作和次要操作是要進行區分的,而這個要根據使用場景和需求來分析和區分。

讓內容長度和輸入框長度對應

13.jpeg

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

正確區分必填字段和選填字段

14.jpeg

用戶有的時候并不知道哪些字段是必須填寫哪些可以不用填寫的 ,通常會使用星號(*)來區分兩者,但是星號有的時候并不能為用戶理解,所以盡量用文字來標識差異。

相關信息分組

15.jpeg

過長的表單常常會讓用戶感到煩躁和不知所措,應當根據特定的邏輯、內容屬性將相關的內容分組,強化表單整體的形式感,用戶覺得更容易填寫表單,也更容易完成。

值得思考的問題

設計師應當考慮可選字段是否真的必要,并且盡量從更多的渠道搜集數據。

用戶數據的搜集和錄入日趨完善甚至日益復雜化。智能設備本身所搜集的用戶信息越來越多,通過用戶授權,APP和網頁可以獲取大量不同類型、不同體量的數據,這些數據還可能來自第三方的帳號,有或者某個其他的APP,這些信息對于產品而言都有巨大的價值,而體現在表單設計上最直接的好處,就是用戶可以少填寫很多重復的信息。

讓表單有趣

時間寶貴,生命短暫,誰想將大量的時間耗費在填寫表單上呢?其實表單的填寫可以更加有趣的,設計師可以將情緒、情感通過合理的表單設計強化品牌的氣質與特征。在不違反上述一般法則的基礎上,設計師能做的事情還有很多,為什么不讓表單更有趣呢?



17
評論區(0)
正在加載評論...
相關推薦
主站蜘蛛池模板: 亚洲免费高清 | 9热这里只有真品 | 精品亚洲永久免费精品 | 欧美图片一区 | 久青草视频免费视频播放线路1 | 日韩第一页在线 | 久久久999久久久精品 | 亚洲欧美成人永久第一网站 | 亚洲国产系列一区二区三区 | 麻豆日韩区久久综合 | 日本一级特黄毛片免费视频9 | 亚洲已满18点击进入在线观看 | 26uuu亚洲| 久青草国产在线 | 国产精品久久久久久久久福利 | 午夜欧美精品久久久久久久久 | 欧美一级别| 91在线高清| 毛片随便看 | 婷婷激情亚洲 | 18在线观看 | 黄色毛片a | 九九99九九精彩 | 精品黑人一区二区三区 | 中文字幕亚洲综合久久2 | 免费看一级做a爰片久久 | 激情九月天 | 中文字幕欧美一区 | 国产精品国产三级国产无毒 | 欧美黄色免费网址 | 精品久久久久久蜜臂a∨ | 青青青爽视频在线观看 | 成人免费淫片免费观看 | 性一交一乱一视频免费看 | 日本一级淫片a免费播放 | 久久综合久久自在自线精品自 | 国产玖玖视频 | 韩国网站爱久久 | 久操综合| 五月婷婷在线免费观看 | 成人看黄色大片 |