技術資訊
表單中的重置與取消按鈕
2008-11-10 22:28:00
Article copyright by Jakob Nielsen
Jakob Nielsen版權所有
作者:Jakob Nielsen
譯者:UCD翻譯小組,Link
大在大部分網頁表單中,移除重置按鈕會有效提升可用性,同樣的,取消按鈕對網頁的意義也不太大。
啟發(fā)式的交互設計中最基本的一點是在任何情況下為用戶提供“緊急出口”,離開當前環(huán)境。撤銷功能是最好的解決方法之一,基本原則只是告訴我們要提供撤銷功能但并沒有告訴我們怎么做。往往,不同的原則適用于不同的用戶界面:
在基于窗口環(huán)境的用戶界面中,取消按鈕可以讓用戶通過對對話框的操作,實現探索性的學習。相比較而言,你在老些的系統中下達了錯誤的命令往往意味著你將陷入絕境。
在編輯系統中通常會有撤銷命令來使文檔回復到用戶編輯之前的狀態(tài)。有時,多級撤銷和重復命令是很有用但又令人困擾的功能。
網頁試圖通過重置和取消按鈕來復制以上特性,但用戶往往更愿意通過瀏覽器的后退按鈕來離開誤入的頁面。
不要使用重置按鈕!
如果去掉所有重置按鈕,網頁將變?yōu)橐黄瑑敉?。這些按鈕非但不能幫助用戶,還可能傷害到他們。
重置功能會把用戶輸入到表單中的所有信息清除掉,但為什么用戶要使用這樣的功能呢?用戶瀏覽網頁的時候會在頁面之間頻繁轉換,他們很少重復訪問相同的表
單,因此,表單在呈現給用戶的時候就是干干凈凈的。而當用戶使用相同的進程重新訪問一個表單時,編輯原有的數據往往比重新填寫更便捷。
重置按鈕會在以下三個方面?zhèn)τ脩簦?/p>
最糟糕的問題是用戶想點擊提交卻誤點了重置,他們填寫的信息將一下子付之東流。
在表單底部提供兩個按鈕將混淆交互界面并讓用戶難以搞清下一步要做什么。用戶會把一小部分時間浪費在瀏覽無用的按鈕和決定哪一個才是該點的上面。
當用戶希望在表單中修改已經填寫的信息時,面對額外的按鈕會做出以下兩個選擇:
在輸入框中修改不正確的內容
點擊重置,在清空的輸入框中重新填寫內容
額外的選擇會迫使用戶進行額外的思考,而使用最佳的交互方式所節(jié)省的時間往往小于用戶考慮決定使用最常用的方式所花費的時間。這將浪費用戶一到兩秒的時間來從中取舍,這也是盡量不要讓用戶選擇的原因。(一秒鐘聽起來沒什么了不起,但它意味著每年一億美元左右的生產力浪費。)
讓所有輸入可撤銷
去掉了重置按鈕,我們有必要為用戶提供其他的修改錯誤輸入的方式。對于文本框和選擇框來說,用戶可以隨時輸入或恢復到最初的狀態(tài)。
不幸的是,有些使用了非標準風格的單選框(radio button)和下拉菜單的表單并沒有提供回到初始狀態(tài)的選項,而這是網頁設計的典型錯誤之一。往往,一旦用戶選擇了一個選項,就沒有辦法作出“什么都不
選”的選擇。永遠別忘了在單選按鈕和下拉菜單中加入明確的默認選項,否則你用戶的麻煩就大了。(請參考復選框和單選按鈕設計的13條軍規(guī))
例外:重復輸入表單的重置按鈕
當同時滿足以下兩個條件時,重置按鈕將發(fā)揮它的作用:
表單總是由一個用戶反復填寫
填寫的內容每次都有較大差異
即使某個用戶經常使用一個表單,當填入的數據每次都很相似時重置按鈕也不是十分必要的。在這種情況下編寫原有的數據要比重新來過簡單得多。
保守地使用取消按鈕
網頁并不像軟件一樣擁有對話框,而是一個用戶游走于各個頁面之間的導航環(huán)境。自從超文本導航成為用戶的使用習慣,人們開始依賴后退按鈕來逃離窘境。每當用戶誤入了不想進入的頁面,他們就會自然而然地把鼠標放到后退按鈕上。
因為后退是網頁瀏覽中很常規(guī)的行為,單獨的取消功能也就不是那么重要了。如果用戶不喜歡當前的頁面,可以肯定,后退按鈕就要出場了。
當用戶害怕自己提交了不想提交的信息時,可以為他們提供取消按鈕,這樣能夠提供給他們比直接退出更安全的的感覺。
在需要多步填寫的表單中用戶會在超過一個頁面上進行輸入,這時取消按鈕是個不錯的選擇,因為后退按鈕不會撤銷之前的輸入。
當然,不能指望用戶每次都點取消,應該有一個后端/后臺邏輯來處理點擊后退來中斷多步輸入的行為。額外的復雜性是我不推薦在網頁中加入復雜應用的原因之一,更好的辦法是使用另一種形式來實現。
購物車中的移除按鈕
很有必要在購物車中添加特殊的按鈕來幫助用戶移除商品,我們無法知道用戶是不是了解他們能夠通過購買“0”件商品來取消購物。(但是反正這個小技巧也不影響其它用戶,所以還是應該實現出來給懂的人用)
(作者:請參考拙作購物車的可用性,來了解更多表單設計中的規(guī)則)
到底什么時候使用用取消按鈕就
Lisa Padol 問道:
"當你討論取消和重置按鈕時并沒有提及停止(即在載入時停止頁面)和刷新按鈕,不是嗎?
我覺得這不僅是可以接受的,也很必要為比如下載文件的過程加入取消按鈕。"
她的假定完全正確,瀏覽器的“停止”按鈕很好地加強了用戶的控制權。而對于文件傳輸和其它一些得花好幾秒鐘的操作也應該這樣做。設計師必須給Applet(網頁上的Java應用)和
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網品牌數字化
- [2023-05-06 10:32:26] 青島網站建設公司,高端網站定制,一站式網站服務——力圖數字科技
- [2023-04-27 13:47:54] 高端定制網站建設——從滿足預期到走向卓越
- [2023-04-11 09:17:49] H5頁面設計開發(fā)——移動端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數字科技配套網站服務支持
- [2021-05-18 10:14:11] 青島網站建設的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網建設項目
- [2021-03-05 10:34:45] 移動互聯時代房地產行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網站建設最容易忽略的人性化設計
- [2020-12-16 16:55:32] 建設一個常規(guī)的公司網站建設成本大概是多少?
延伸閱讀
- [2008-08-25 11:38:00] 向左還是向右,向上還是向下?
- [2015-07-16 21:42:58] 織夢自定義表單獲取到當前時間
- [2008-08-13 12:16:00] 注冊表單的規(guī)則
- [2008-02-26 14:20:00] 何時用按鈕,何時用鏈接
- [2016-11-08 12:33:00] 青島網站制作如何實現自定義表單系統?
- [2008-10-31 11:24:00] web表單按鈕的使用
- [2008-11-12 11:58:00] “確定”與“取消”按鈕:如何正確排序?
- [2008-11-20 12:01:00] 網頁表單中的主、次要動作
- [2009-02-15 22:38:00] 表單設計中的常見問題
- [2009-02-12 08:58:00] 回車鍵觸發(fā)表單提交的問題
- [2011-11-14 17:38:57] 如何設計好網頁表單的細節(jié)
- [2008-11-14 11:06:00] 表單可用性5原則