2. 在上個層級的標簽和冒號同時存在時 ， 我們這時候怎么對齊呢？
我們最好確定統(tǒng)一的起點 ， 如下左圖 ， 當然在使用的過程中需要判斷用戶使用場景 ， 如下右圖是12306修改乘車人信息 ， 用戶注意力在信息上 ， 標題僅起到區(qū)分模塊的作用 。
問題四：為什么優(yōu)先進行在線驗證？
我最初入行和研發(fā)小哥哥就爭執(zhí)過登錄頁面 ， 密碼輸入后需要點擊登錄按鈕才能判斷密碼是否正確 ， 如果在輸入密碼后直接判斷密碼錯誤就少一步交互 ， 對老年用戶來說少一步就是進步一大步 。為什么密碼輸入后不能直接判斷密碼是否正確呢？
1. 在線驗證
在以往的網(wǎng)頁設(shè)計中 ， 信息填寫的正確與否都要等待用戶點擊「提交」按鈕后 ， 產(chǎn)品將用戶填寫的數(shù)據(jù)提供到服務(wù)器 ， 由服務(wù)器來判斷是否正確 。這種方法太過于依賴網(wǎng)速 ， 并且不符合用戶體驗中的「及時反饋」原則 。
所以現(xiàn)在產(chǎn)品設(shè)計 ， 在數(shù)據(jù)還沒有提供給服務(wù)器之前 ， 先在前端進行一些基礎(chǔ)的錯誤排查 ， 即在線驗證 。
一些基礎(chǔ)的規(guī)范 ， 如郵箱是否加上了 @xxx.com ， 都是可以通過在線驗證的 ， 而無需上傳到服務(wù)器去比對數(shù)據(jù)庫 。
理想情況下 ， 所有用戶填寫的信息都應(yīng)該先經(jīng)過在線驗證 。用戶填寫完字段后 ， 如果包含錯誤 ， 應(yīng)該立即給予反饋并將錯誤提示消息放置在用戶填寫字段到附近 。這樣 ， 錯誤提示容易引起用戶注意 ， 對于用戶的交互成本也低 。用戶不必要重新查找和導(dǎo)航到錯誤位置 。
需要比對數(shù)據(jù)庫的信息可能無法進行在線驗證 ， 那就還是當用戶提交將信息發(fā)送給數(shù)據(jù)庫后再提示錯誤 。也就是是說前端只能進行簡單的驗證 ， 比如手機號位數(shù)不對、郵箱格式不對等 ， 判斷密碼是否正確需要后端對比數(shù)據(jù)庫才能判斷 ， 這時候就需要點擊提交按鈕 。
左圖一輸入賬號后里面提示不可用 ， 方便用戶及時修正；而圖二需要輸入手機號驗證碼點擊提交后再提示錯誤信息 ， 從信息反饋上來看 ， 全部輸完了提示錯誤 ， 交互過于繁瑣 。
前端校驗：一般校驗顯示錯誤和格式錯誤：必填項、（郵箱、電話號、地址）格式、密碼強度等 ?？焖俜答?nbsp;， 直接提醒用戶錯誤內(nèi)容 ， 讓用戶及時知曉并更改 。后端校驗：唯一性驗證、驗證碼、敏感詞等 ， 觸發(fā)校驗請求后系統(tǒng)會去數(shù)據(jù)庫查詢校驗信息 ， 再給予用戶相應(yīng)的反饋 。
2. 復(fù)雜字段設(shè)置填寫成功指示器
同樣的 ， 在線驗證也可以用于提示用戶填寫的內(nèi)容符合規(guī)定 。謹記錯誤預(yù)防準則：提供給用戶相關(guān)的建議 ， 將用戶的輸入值限制為合規(guī)的范圍內(nèi) ， 并允許輸入錯誤、縮寫和不同的輸入格式的存在以保證產(chǎn)品的兼容性 。
對于復(fù)雜的輸入（例如輸入新密碼） ， 即時的在線驗證（在輸入字符的一瞬間提示）將防止用戶多次猜測或檢查輸入的內(nèi)容是否符合系統(tǒng)的設(shè)置 。在下面的示例中 ， 密碼強度指示符會隨著用戶的輸入而變化 ， 并幫助用戶確定到目前為止的輸入是否合規(guī) ， 還是要繼續(xù)改進 。
推薦閱讀
- 探探卸載和注銷的區(qū)別
- 立冬和冬至有什么區(qū)別 冬至和立冬一樣嗎
- 臘肉什么季節(jié)做最好 小雪為什么要腌臘肉
- 霜降吃柿子 霜降為什么要吃柿子
- 低血壓和低血糖的區(qū)別 如何區(qū)分低血壓和低血糖
- 烏鴉為什么像寫字臺是什么意思
- 指紋鎖全自動和半自動有什么區(qū)別 指紋鎖全自動和半自動哪個好
- 白蘿卜燉羊肉的家常做法 羊肉和白蘿卜是最佳搭檔
- 榆木家具和橡木家具哪個好 怎樣選擇合適的家具
- 滌綸是什么材料 生活中的錦綸和滌綸是一樣的嗎