<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          如何設計更好的表單

          2019-8-14    ui設計分享達人



          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里


          介紹表單設計里經常會犯的錯誤~

          無論是注冊流程,還是信息輸入的界面,表單都是產品設計里最重要的組件之一。本文重點介紹了表單設計里常見的注意事項。不過這些只是通用的規則,實際應用中總有例外~



          少于6個選項的情況,建議全部顯示

          把選項內容放在下拉框里,不僅隱藏了選項內容,而且需要兩次點擊。如果大于5個選項,建議用輸入選擇器,如果超過25個選項,建議加上搜索功能~



          輸入框長度可以暗示內容長度

          輸入內容的長度決定了輸入框的長度。這種做法適合應用在一些固定長度信息的情況,比如銀行卡號、電話號碼、郵政編碼等。



          標簽頂部對齊

          相比左對齊,標簽頂部對齊的表單用戶完成率更高。移動設備屏幕大小有限,頂部對齊的效果也更好(標簽文案長度不可控)。然而在大量數據輸入時,還是可以考慮左對齊標簽,因為瀏覽更,還能節省高度。



          不要把占位符當做標簽

          用戶在輸入的時候就會看不到標簽內容是什么了。詳見Nielsen Norman團隊的總結。

          *也可以參考Google的做法,默認把占位符當作標簽,輸入時標簽移動到輸入框上方



          將復選框/單選框上下排列

          上下排列方便瀏覽閱讀,橫向排列選項內容會被選框控件隔開。



          指出錯誤在哪

          告訴用戶具體哪里出錯了,以及錯誤的原因。



          等用戶填完了再進行驗證

          不要在用戶正在輸入的時候就去驗證,除非這能幫到他。例如在創建一個有字數限制的密碼~



          不要隱藏幫助信息

          盡量默認顯示幫助信息。如果信息太復雜,考慮在輸入時放在輸入框的旁邊。



          不要用*星號表示必填項,標出選填字段

          用戶不一定知道星號代表什么含義。還不如明確的標出哪些是選填字段。



          標簽和輸入框成組

          標簽和對應的輸入框形成一組,他們之間的間距要比組與組之間的間距小,這樣用戶不會困惑標簽是屬于上面還是下面。



          按鈕的文案描述具體意圖

          比如按鈕上的文字建議寫“注冊”,而不是“提交”。



          主次按鈕有層次區分


          關系近的內容成組

          太長的表單讓用戶感到不知所措。有邏輯地分組能讓用戶更快地理解表單。

          轉自:站酷-大秘密mimi

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制  用戶體驗 、交互設計、 網站建設 、平面設計服務。

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合