7個方法幫你全面提升WEB表單填寫體驗

 　　如果網站是一座小院兒，注冊登錄頁就是那扇大門，用戶是走是留很大程度就取決於那道門檻的設計，今天騰訊的同學總結了7個實用的方法，能有效幫助用戶提升表單填寫的整體體驗，賓客臨門還是門可羅雀?就看這篇了。

　　我們幾乎每天都會接觸形形色色的表單，登錄賬號、填寫信息以獲取服務、發布內容等。然而填寫表單的過程往往不是特別愉悅的，我們需要消耗時間輸入信息，點擊提交，可能還需要等待審核;尤其是碰到較為復雜、流程長的表單，如果用戶體驗較差，很容易讓人產生挫敗感，在中途選擇放棄。

　　那麼，如何提高用戶填寫表單的效率，防止他們出錯或中途流失，提升愉悅度及轉化率呢?本文就Web表單設計，總結了以下的一些方法：

　　有效的說服用戶進行填寫

　　首先，告知用戶為什麼要填寫表單，他能獲得什麼，讓用戶看到把信息給你的好處。舉個例子，GitHub在其注冊表單的右側清晰的告訴你注冊使用它會得到的幫助：

　　除了告訴用戶填完整個表單可以得到什麼好處，你還可以更具體一點，告訴用戶你讓他填寫某一項信息是出於怎樣的考慮。

　　有效的說服用戶填寫表單，還需要剔除負面干擾，獲取他們的信任。大多數情況下，用戶對於填寫表單的最大顧慮是信息被網站收集之後的用途。用戶不希望源源不斷的收到垃圾推銷郵件，更不希望自己的隱私信息被公之於眾。此時，你可以通過引用一些具有影響力的權威人士的承諾，或者展示一些具有公共效應的證據，如相關媒體報道、來自現有用戶的贊許等任何能使人產生積極態度的元素。

　　你還可以做的更貼心一些，告訴用戶填寫表單預計需要花費的時間。

　　合理組織信息

　　對於較為復雜、填寫項多的表單，如果不對信息進行組織，很容易顯得繁雜混亂，讓用戶在一開始就產生抵觸的情緒，甚至選擇放棄。合理有層次的組織信息，可以利用框線、空間間隔、顏色的不同，按照不同信息的類別、屬性和相關性進行區塊的劃分，用步驟條指示當前的進程。

　　想處理好層次?來看搜狐同學的專題你分析，絕對大有收獲!《拍案叫絕的設計!聊聊那些讓頁面更加出彩的小細節》

　　一般來說，通知為藍色，警告為黃色，錯誤為紅色，成功確認為綠色。

　　清晰的浏覽線，合理的標簽、提示文字及按鈕的排布，避免不必要的信息重復出現，能夠降低用戶的視覺負擔和物理負擔。

　　恰當的隱藏信息能夠使表單看起來更加清爽怡人，有些信息可以設置在需要進行相關操作時才出現。

　　區分一級動作和二級動作。用按鈕定義一級動作，用鏈接定義二級動作，或者相對於二級動作按鈕來說，賦予一級動作按鈕更為明顯的風格。

　　為用戶節省時間

　　需要花大量時間填寫的表單容易讓人失去耐心，用戶是懶惰而繁忙的，試著刪去所有不必要的填寫項，考慮除了讓用戶機械的通過鍵盤在表單上輸入數據外，還有沒有別的更優方式(如後續進行用研調查)收集所需信息。

　　驗證碼永遠是表單上讓用戶頭疼的填寫項之一，他需要等待驗證碼的生成、確認驗證碼的內容、確保驗證碼輸入正確，才能點擊提交，而這整個過程對他來說並無實際價值，用戶不會因為多填寫一次驗證碼而得到額外的獎勵。我們可以通過改變輸入驗證碼的體驗，使其變得更簡單有趣，或者通過新的後台邏輯限制用戶每日提交次數等行為來取締驗證碼。

　　安全平台部打擊惡意組的同事就發明了一種有趣的圖片驗證碼的方式：

　　除了驗證碼以外，注冊填寫表單中經常存在的二次確認密碼也同樣費時。目前，很多國外的主流網站，如Facebook、Twitter、LinkedIn、Friendster等在填寫注冊表單時都不要求用戶確認密碼。WordPress甚至連都不需要用戶填寫，而是將密碼直接發送至用戶的郵箱。

　　除了上面這種簡單粗暴的方式以外，首次輸入密碼時使用明文確認同樣可以節省二次輸入密碼的時間，出於信息安全的考慮，需支持有需要的用戶隨時切換成暗文顯示。以下是筆者收集的幾種明文確認密碼的方式，可供參考：

　　鼠標點擊、拖拽操作相對於鍵盤輸入來說是更加有效率的方式。通過添加選取器、快捷選項、智能聯想、range滑塊、number微調等方式讓用戶可以更快速的完成表單。

　　添加選取器、快捷選項：

　　支持拖拽上傳：

　　智能聯想：

　　range滑塊：

　　number微調：

　　慎用下拉框。由於下拉框會對用戶造成信息的隱藏，需要而外的操作才能顯示，更適合用在選擇日期、省份等可選范圍較大的地方。對於數目有限且重要的選項來說，使用更明顯的選擇方式更合適。

　　放寬對用戶輸入的要求，包括格式、大小寫等。讓你的系統更靈活而非讓用戶為了你改變他們的輸入習慣。

　　錯誤預防。進行有效的即時校驗，讓用戶能及時修改、補充缺漏的信息;另外，我們還可以通過限制用戶的行為(如在預定機票時返回時間無法選擇出發時間之前的日期，出發城市不能跟到達城市一樣等)，或提供自動修正的方式來預防用戶犯錯。