作者：Luke Wroblewski & Etre
譯者：UCD翻譯小組，Li Douis
原文地址： http://www.lukew.com/resources/articles/PSactions.asp
近幾個月來，我一直忙于我的新書《網頁表單設計最佳實踐》，使用大量的真實案例數(shù)據對一些設計規(guī)范進行提煉。接近尾聲的時候，我有幸參加了Etre設立于倫敦的可用性團隊組織的一些研究工作。這些研究主要是針對網頁表單設計的特定元素，進行了一些眼動追蹤和可用性測試。其中一項測試，重點考察了網頁表單中主次要動作的差異。
主要動作與次要動作
一個典型的網頁表單，通常帶有一些“結束性”動作－比如【提交】、【保存】或者【繼續(xù)】－用于完成表單任務。因為這些動作會觸發(fā)表單的最重要的行為（結束表單），所以它們通常屬于主要動作。
相反，次要動作相對用的較少，而且通常允許用戶撤銷已經輸入的數(shù)據。比如【取消】、【重置】或【返回】，與用戶完成表單的主要目標相對而言，它們處于次要地位。
由于次要按鈕有可能引發(fā)負面后果，特別是無意中被觸發(fā)時，我過去經常主張把它們從表單中去掉。試想一下，你填寫了一個超長的表單后，只是誤點了一下【重置】按鈕，所有的數(shù)據都不見了。
有人說有時候次要動作也是合理的（【另存為】、【導出】等）。在這種情況下，我的經驗是把主次要按鈕從視覺上區(qū)分開，這樣用戶就不至于混淆主要目的：完成表單。
弱化次要動作的視覺表現(xiàn)，可以將潛在錯誤的風險降到最低，同時把用戶引導向正確的結果。但是，區(qū)別主次動作的最佳方案是什么呢？主要動作與次要動作應當有多大差異？他們應該怎樣放置？為了解答這些問題，我和Erte進行了一些測試。
為了研究主次動作的最佳顯示方案，我們使用6種方案測試了23名用戶，使用了眼動追蹤法和可用性度量法。測試用戶按隨機順序查看6種設計方案（以便克服熟悉度偏誤），他們都被要求“完整而正確的填完表單”。
視覺差異
6個方案中，有5個方案完美的完成了任務。A/B/C/D/F方案的正確率為100％，沒有引發(fā)任何一個錯誤。它們完成任務的時間大致相當，并且滿意度評價也一樣高。
其中，B方案的效果最佳。用戶注視的時間最短，而且注視量最少。與其他方案相比，用戶能更快更有效的完成任務。
但是評論A方案的時候，一些用戶認為把【取消】按鈕顯示成鏈接形式比較有效。一名用戶提到，雖然這種隱性顯示法會讓他找不到按鈕，但卻有效避免了意外的（也是災難性的）取消操作。另一名用戶認為，【提交】按鈕是用戶界面里最重要的按鈕，【取消】按鈕理所當然的不配享用前者般的同等待遇。
還有一些用戶對C方案把【取消】按鈕“灰掉”的做法表示反對。此外，有一人說顏色可以讓人更容易找到“正確的按鈕”（比如【提交】），而另一人卻說不同顏色的按鈕“影響速度（并且）讓你回頭檢查你是否點擊了正確的東西”。
有趣的是，處理C方案的用戶和處理B方案（使用了幾乎相同的綠色左對齊按鈕）的相比，平均多了8個以上的注視 。這似乎說明，雖然用戶的確認可C方案這種灰色【取消】按鈕更容易識別，但是在處理速度方面，C方案的確效率不佳。據稱，使用B方案時，一部分用戶感覺到有點擔心他們“也可能很容易點擊了錯誤的按鈕”。
總的來說，似乎人們更喜歡那種【取消】按鈕靠邊站的設計，即便這些設計會拖一點后腿。這證明用戶更加關心數(shù)據的安全，而不是更快的提交。
布局
整個測試中，E方案表現(xiàn)的最差。有6名用戶錯誤的點擊了【取消】按鈕，而更多的人則在按鈕前徘徊，直到他們發(fā)現(xiàn)差點犯錯為止。整體上看，使用E方案的用戶比B方案的平均慢了6秒（當認為按鈕的布局是兩種方案唯一的不同時，這個6秒的差距還是相當大的）。完成任務需要作出的注視也大大高于平均值（高于平均注視總時長平和均注視時長）。
根據我們收集的數(shù)據顯示，A、B、C方案是最有效的三個。這三個原型有著一個共同特點：【提交】【取消】按鈕全部放置在頁面左側。這說明這兩個操作的最佳設計選擇是左對齊 － 特別當表單控件也同樣左對齊時。把這兩個按鈕放在左側也使得用戶眼睛移動的距離最少。
從眼動的情況來說，F(xiàn)方案效率最差。雖然所有的用戶都成功的完成了任務，但我們的眼動跟蹤設備數(shù)據還是證明了其他方案更加高效。使用F方案時，用戶的注視時間最久，相對于其他方案來說，他們注視的也更加頻繁了。我們認為這是由于用戶本來以為按鈕會在左側（比如直接顯示在表單最后一個控件下方），結果卻發(fā)現(xiàn)并非如此，不僅這樣，他們還得到處搜索去尋找按鈕。
這一發(fā)現(xiàn)很好的符合了一個表單設計方面的長久以來的原則：引導用戶正確完成。按一個明顯的垂直方向排列輸入框和動作按鈕，可以清晰的告訴用戶如何按順序完成表單。這一點，可以從下面的熱區(qū)圖中看到：用戶的注視路徑形成了非常顯著的垂直形狀。
（注意：心理預期因素可能影響了測試結果。因為在我們測試的所有方案中，【提交】按鈕都是擺在【取消】按鈕左側的。）
總結
雖然，大部分網頁表單的設計目標都是讓用戶能夠快速準確的完成表單，但是在某種情況下的確有必要減慢用戶的速度。需要幫助用戶對主、次要動作進行選擇的時候，視覺上的區(qū)分會是一個有效途徑。
這種區(qū)分應做到何種程度？象A方案一樣做成按鈕vs鏈接，還是象C方案一樣僅改變不同的顏色？A方案在完成時間、平均注視量和平均注視總時長方面更優(yōu)，這表面用戶完成的更快，但并沒有快很多。
當然，如果沒有次要動作的時候，這種區(qū)分顯然是多余的。應當確定你是否有必要在表單中放置次要動作，并且不要亂用一氣。把動作按鈕與表單的輸入域對齊，可以給用戶照亮前進的路途，幫助他們更快的完成表單。要記住，直接把主要動作按鈕與輸入域對齊能夠提高工作效率并且減少耗費的時間，用戶也將更加開心。
粵公網安備 44010402000282號