下拉菜單用戶體驗很糟？這些是可替代的方案

雷鋒網(wǎng)按：本文由掘金翻譯計劃譯者邵輝Vista譯自《Why drop-down lists are bad for the user experience》校對者：L9m, circlelove。本文首發(fā)稀土掘金，未經(jīng)允許，禁止轉(zhuǎn)載。

一個完全不合理的行業(yè)標準

隨著在用戶界面和可用性方面的研究，尤其在用戶輸入表單上，我越來越意識到一個事實那就是下拉列表的用戶體驗幾乎總是不好的。

下拉列表經(jīng)常用于有多個選項，只允許用戶選擇一個的時候。它和單選按鈕的效用相同。使用它而不使用單選按鈕的理由，是因為它占用更少的空間，但是我已經(jīng)陳述過了我們不再需要節(jié)省網(wǎng)頁上的垂直方向上的空間。

下拉列表有一個很大的問題，那就是用戶不能直接看到所有選項，而是需要點擊查看所有的選項，然后瀏覽一遍，然后才能做出一個選擇。當用戶在大多數(shù)輸入表單上使用鍵盤時，下拉列表的體驗是特別不好的。

下面是一些替代下拉列表的可選方案

1、用多個單選按鈕替換下拉列表

這些選項應該直接出現(xiàn)在視野中，而不是在用戶點擊后才顯示。這樣用戶就能直接看到有哪些選項，然后做出知情的決策。一定要確認單選按鈕做得簡單明了，并且只能選擇一個。

2、兩個選項應作為一個開關按鈕

如果只有兩個選項，應該把下拉菜單替換成一個開關，并且最普遍的那個選項應該被預選上，一個很好的例子就是在一個注冊表單里選擇性別，如果用一個下拉菜單，每個用戶都需要做兩次點擊——選擇這個菜單然后選擇這個選項，用開關的話，女性（全部人口的 51%）被預選上，那么只有 9% 的人需要做1次點擊，這是一個巨大的差別，這里就有一個很糟糕的例子，來自 Yahoo.com：

3、許多選項應作為一個自動完成控件

一個被廣泛接受的觀點就是下拉列表里最多的選項數(shù)應該在15個左右（有人說是12，也有說是16），如果超過了一個范圍，很容易產(chǎn)生迷惑性，對用戶來說是一個很艱難的抉擇，瀏覽一個那么長的選項列表，那么多的選項放在用戶手里。我們應該努力盡可能地去除很多選項，因為我們已經(jīng)在后臺做了很多工作，這樣用戶要想的越少，越好。

一個很好的例子就是國家選擇器，到現(xiàn)在為止，當你選擇你的國家時，使用下拉列表仍是一個絕對的標準。ludacris，Smashing Mag一年前就這個問題寫過一篇很好的文章，叫做《重新設計國家選擇器》，當有很多可能的選項時，使用自動完成控件，讓系統(tǒng)去完成這樣的工作，而不是用戶。

所以，有沒有哪些位置用一個下拉列表才是最佳的選擇呢？是的，當然有，在任意一種你有多個選項的情況下，你都可以在你的表單里使用多個單選按鈕，用戶根本就不知道他們當前選的是哪一個的，但是這種情況發(fā)生得很少，如果這種事情真的發(fā)生了，那么重新思考一下，利用多樣的控件來讓用戶使用起來更簡單才是明智的，作為一個很好的表單應該怎么設計的例子，瀏覽一下Typeform，他們做的每一件事情都是對的。

最后幾句，我想說幾句雖然有些偏離主題但是需要說的：如果這個字段是可選的，那它就不應該出現(xiàn)在表單里，移除所有不必要的注冊流程和對用戶來說不必要的東西。這就通常意味著你需要在必選的模塊那加一個（如果在某些情況下，你仍然需要可選的輸入框，標出它們是可選的）。

雷峰網(wǎng)原創(chuàng)文章，未經(jīng)授權禁止轉(zhuǎn)載。詳情見轉(zhuǎn)載須知。