<blockquote id="muoge"></blockquote>
<input id="muoge"></input>
  • <blockquote id="muoge"></blockquote>
    <menu id="muoge"><bdo id="muoge"></bdo></menu>
  • <xmp id="muoge"><menu id="muoge"></menu>
  • <dd id="muoge"></dd>
    15100177676

    聊聊打造優質WEB表單的9個實用方法

    日期:2017-2-7

    1. 標簽推薦使用右對齊方式

    馬泰奧·彭佐在20067月的眼動研究發現,標簽如果采用頂對齊方式,用戶的視線從標簽移動到輸入框只需要50毫秒,右對齊方式需要240毫秒,左對齊方式需要500毫秒。如果從高效上講,應該是優先考慮標簽頂部對齊。

    我們都知道淘寶注冊頁的表單采用了右對齊方式,是考慮到頂部對齊會占用過多的垂直空間,一旦表單項過多,對表單頁的操作也會造成不便,所以采用了右對齊方式。

    所以建議大家,如果表單項不多,有限考慮標簽頂部對齊;而同時要兼顧高效和頁面的垂直空間,則選擇右對齊方式吧。那是不是左對齊標簽無用呢?其實并不是,研究也有表明,在涉及到專業性過強,用戶不熟悉的表單,需要更長時間理解的標簽項時,則可以考慮左對齊方式。

    2. 必填和選填

    本書里提出一個觀點,如果必填字段比較多,把選填項標記出來則足夠;如果選填字段比較多,則標記必填字段。

    這的確能最高效率區分出來必填字段和選填字段,然而現在大部分互聯網用戶對于「*」就代表必填這都已領會,所以筆者還是推薦在表單中盡可能用「*」去區分必填和選填,畢竟這屬于最通用的方案。不過登錄表單可以不遵循這個規則,大家都知道登錄表單中的標簽項都為必填,同時也可以根據標簽項是否輸入的狀態來激活「登錄」按鈕。

    3. 即時反饋

    早期的表單里面對標簽項的說明文字都直接放置在標簽旁邊,但很多用戶不會去看這些文字,或者直接忽略掉。其實可以結合用戶操作表單行為來動態顯示幫助信息,例如用戶聚焦在哪一個標簽項,則顯示哪一項對應的解釋文案。當用戶輸入郵箱已經被注冊過,則會即時給出相應的提示,節省用戶輸入額外注冊信息的成本,而不是讓用戶填寫完再點擊「提交」按鈕交給服務器去做一次判斷。

    當然除了這條,還有密碼強度和密碼要求的即時校驗,旨在節省用戶輸入時的思考時間,讓用戶更高效率地填寫表單。

    4. 錯誤消息

    表單中的錯誤提示信息,或者一些不合規的提示信息展示也是表單設計中影響比較大的元素。

    在表單項比較多的情況下,可能在小尺寸屏幕中需要滾動頁面才能看到完整表單信息,而因為采用了點擊「提交」按鈕之后交給服務器校驗數據,所以在多個表單項出現錯誤的情況下,則需要統一在表單頭部提示出來錯誤信息,并且最好要有錨點,點擊之后能夠直接到錯誤的位置,節省用戶尋找的時間。

    然而如之前所說,如果能夠在前臺即時校驗的信息,就盡量交給前臺校驗,除了可以節省用戶的表單操作時間,可以保證體驗的一致。

    5. 智能默認

    表單設計中可以通過智能默認的方式幫助用戶填寫一些需要重復填寫的表單,這樣可以節省大量的時間。例如淘寶/天貓購物車頁面,用戶在每次購買之后都需要經過收貨地址填寫環節,如果說將填寫過的地址幫助用戶保存起來并設置成默認,在后來的每次購買過程,可以直接進入到下一個環節,省去了這一步的時間。

    6. 設置 Tab 鍵跳轉

    筆者認為 Tab 鍵跳轉也是一個能夠提高用戶操作表單效率的一個方式,也是設計師在表單設計中必須要考慮到的一個細節,Tab 鍵的跳轉和表單項視覺先后順序保持一致。

    這個細節很小,但是影響面卻很大。很多網站并沒有在這個細節上做的很好。

    7. 同意&提交

    在很多注冊表單的最后一項表單項是讓用戶勾選同意***協議,很多情況下完全是廢話。所以這一步與提交按鈕可以合并在一起,省去一步操作。

    8. 正在進行的動作

    表單填寫完成,最后一步就是提交了,這一步至關重要。不僅僅是說在提交之后要將后面的結果反饋給用戶(上面說到的即時反饋),如果網絡條件比較慢,或者信息量比較大,導致等待時間過長(很多情況下會這樣),那么我們應該告訴用戶這一切,讓用戶并不會覺得等待時間很長。同時也減少了用戶重復點擊「提交」按鈕的情況。

    9. 對話形式表單

    這算是一些附加信息。一個個表單項其實可以轉化成一條條問題,讓用戶覺得像是在和互聯網的另一邊聊天,從而以最輕松愉悅的心情來進行表單填寫。


    九帆網絡技術有限公司 Copyright© 2012-2016 備案號: 冀ICP備19037213號-1

    友情鏈接:石家莊網站建設石家莊塑料編織袋西柏坡培訓

    国产成人免费高清激情视频_好大好爽好湿免费视频_欧美日韩亚洲中文字幕二区_超碰97人人做人人爱