選項按鈕
注意
此設計指南是針對 Windows 7 所建立,但尚未針對較新版本的 Windows 更新。 大部分的指導方針仍適用主體,但簡報和範例不會反映 我們目前的設計指導方針。
使用選項按鈕,使用者可以在一組互斥的相關選項之間進行選擇。 使用者可以選擇一個選項,而只能選擇一個選項。 因此會呼叫選項按鈕,因為它們的運作方式就像選項按鈕上的通道預設值一樣。
一般選項按鈕群組。
選項按鈕群組的行為就像單一控制項一樣。 只有選取的選項可以使用 Tab 鍵來存取,但使用者可以使用方向鍵來迴圈流覽群組。
這是正確的控制項嗎?
若要決定使用時機,請考量下列問題:
控制項是否用來從一組互斥的選項中選擇一個選項? 如果不是,請使用其他控制項。 若要選擇多個選項,請改用 核取方塊、 多重選取清單 或核取方塊清單。
兩到七之間的選項數目是否為 ? 由於使用的螢幕空間與選項數目成正比,因此請將選項數目保留在介於 2 到 7 之間的群組中。 如需八個或多個選項,請使用 下拉式清單 或單一 選取清單。
核取方塊是否為較佳的選擇? 如果只有兩個選項,您可以改用單一 核取方塊 。 不過,核取方塊僅適用于開啟或關閉單一選項,而選項按鈕可用於完全不同的替代方案。 如果這兩個解決方案都可行:
如果已清除核取方塊的意義不明顯,請使用選項按鈕。
不正確:
正確:
在正確的範例中,選擇不是相反的,因此選項按鈕是較佳的選擇。
在精靈頁面上使用選項按鈕來清除替代專案,即使核取方塊是可接受的。
如果您有足夠的螢幕空間,而且選項很重要,足以充分使用該螢幕空間,請使用選項按鈕。 否則,請使用核取方塊或下拉式清單。
不正確:
在此範例中,選項不足以使用選項按鈕。
正確:
在此範例中,核取方塊是有效使用此周邊選項的螢幕空間。
如果頁面上有其他核取方塊,請使用核取方塊。
下拉式清單是否為較佳的選擇? 如果大部分的使用者都建議使用預設選項,選項按鈕可能會比必要更注意選項。
如果您不想要注意選項,或不想鼓勵使用者進行變更,請考慮使用下拉式清單。 下拉式清單著重于目前的選取範圍,而選項按鈕則同樣強調所有選項。
在此範例中,下拉式清單著重于目前的選取範圍,並禁止使用者進行變更。
如果頁面上有其他下拉式清單,請考慮下拉式清單。
一組命令按鈕、命令連結或分割按鈕是否為較佳的選擇? 如果選項按鈕只用來影響命令的執行方式,最好改為呈現命令變化。 這麼做可讓使用者選擇具有單一互動的正確命令。
選項是否呈現程式選項,而不是資料? 選項的值不應以內容或其他資料為基礎。 針對資料,請使用下拉式清單或單一選取清單。
如果在精靈頁面或控制台上使用控制項, 控制項是否為主要指令的回應,而且使用者稍後是否可以變更選擇? 如果是的話,請考慮使用命令連結,而不是選項按鈕,讓互動更有效率。
指導方針
一般
以邏輯順序列出選項, 例如最可能選取為最少、最簡單且最複雜或風險最低的選項。 不建議依字母順序排序,因為它與語言相關,因此無法當地語系化。
如果沒有任何選項是有效的選項,請新增另一個選項來反映這個選擇, 例如 None 或 Not apply。
偏好垂直對齊選項按鈕,而不是水準對齊。 水準對齊較難閱讀和當地語系化。
正確:
在此範例中,選項按鈕會垂直對齊。
不正確:
在此範例中,水準對齊較難閱讀。
請重新考慮使用群組方塊來組織選項按鈕群組,這通常會導致不必要的螢幕雜亂。
請勿使用選項按鈕標籤作為群組方塊標籤。
請勿使用選項按鈕的選取專案來:
- 執行命令。
- 顯示其他視窗,例如對話方塊來收集更多輸入。
- 動態顯示或隱藏與選取控制項相關的其他控制項, (螢幕助讀程式無法偵測這類事件) 。 不過,您可以根據選取範圍動態變更文字。
次級控制項
將次級控制項放在或下方 (縮排,並排清選項按鈕標籤) 選項按鈕及其標籤。 以冒號結束選項按鈕標籤。
在此範例中,選項按鈕及其次級控制項會共用選項按鈕標籤及其便捷鍵。 在此情況下,方向鍵會將焦點從選項按鈕移至其次級文字方塊。
如果相依的可編輯文字方塊和下拉式清單共用選項按鈕的標籤,請保持啟用。 當使用者在方塊中輸入或貼上任何專案時,請自動選取對應的選項。 這麼做可簡化互動。
在此範例中,輸入頁碼會自動選取 [頁面]。
避免巢狀選項按鈕與其他選項按鈕或核取方塊。 可能的話,請將所有選項保持在相同的層級。
正確:
在此範例中,選項位於相同的層級。
不正確:
在此範例中,使用巢狀選項會增加不必要的複雜度。
如果您使用其他選項按鈕或核取方塊進行巢狀選項按鈕, 請停用這些從屬控制項,直到選取高階選項為止。 這樣做可避免混淆次級控制項的意義。
預設值
因為一組選項按鈕代表一組互斥的選項, 所以預設一律選取一個選項按鈕。選取最安全 (,以防止資料或系統存取) 和最安全且最私人的選項遺失。 如果安全性和安全性不是因素,請選取最可能或方便的選項。
異常: 如果沒有下列專案,請勿使用預設選取專案:
- 安全性、安全性或法律理由沒有可接受的預設選項,因此使用者必須做出明確的選擇。 如果使用者未進行選取,請顯示錯誤訊息以強制一個。
- 使用者介面 (UI) 必須反映目前的狀態,而且尚未設定選項。 預設值不正確地表示使用者不需要進行選取。
- 目標是收集不偏差的資料。 預設值會偏差資料收集。
- 選項按鈕群組代表處於混合狀態的屬性,這會在顯示多個沒有相同設定的物件屬性時發生。 在此情況下,請勿顯示錯誤訊息,因為每個物件都有有效的狀態。
將第一個選項設為預設選項,因為使用者通常會預期,除非該順序不是邏輯的。 若要這樣做,您可能需要變更選項標籤。
不正確:
在此範例中,預設選項不是第一個選項。
正確:
在此範例中,會重新建立選項標籤,讓第一個選項成為預設選項。
建議的大小和間距
選項按鈕的建議大小和間距。
標籤
選項按鈕標籤
- 為每個選項按鈕加上標籤。
使用 句子樣式大寫。
將標籤撰寫為片語,而非句子,而且不會使用結尾標點符號。
- 例外: 如果選項按鈕標籤也會標示其後面的次級控制項,請使用冒號結束標籤。
使用平行片語,並嘗試為所有標籤保留大約相同的長度。
將標籤文字放在選項之間的差異上。 如果所有選項都有相同的簡介文字,請將該文字移至群組標籤。
使用正片語。 例如,使用 do 而非 do not,而 print 而不是 print。
只描述標籤的選項。 讓標籤保持簡短,以便輕鬆地在訊息和檔中參考這些標籤。 如果選項需要進一步說明,請使用完整的句子和結尾標點符號,在 靜態文字 控制項中提供說明。
在此範例中,選項會使用個別的靜態文字控制項來說明。
注意
將說明新增至選項按鈕並不表示您必須提供所有選項按鈕的說明。 如果可以,請在標籤中提供相關資訊,並在必要時才使用說明。 不要只重新設定標籤的一致性。
如果強烈建議使用選項,請將「建議 () 」新增至標籤。 請務必新增至控制項標籤,而不是補充附注。
如果選項僅適用于進階使用者,請將「 (進階) 」新增至標籤。 請務必新增至控制項標籤,而不是補充附注。
如果您必須使用多行標籤,請將標籤頂端與選項按鈕對齊。
請勿使用次級控制項、其包含的值或其單位標籤來建立句子或片語。 這類設計無法當地語系化,因為句子結構會隨著語言而有所不同。
選項按鈕群組標籤
使用群組標籤來說明群組的用途,而不是如何進行選取。 假設使用者知道如何使用選項按鈕。 例如,不要說「選取下列其中一個選項」。
所有選項按鈕群組都需要標籤。 使用靜態文字或群組方塊,將標籤寫入為單字或片語,而不是以冒號結尾的句子。
例外: 如果標籤只是對話方塊 的主要指令的重新整理,請省略標籤。 在此情況下,主要指令會採用冒號 (,除非它是問題) ,如果有一個) ,則 (存取金鑰。
可以接受:
在此範例中,選項按鈕群組標籤只是主要指令的重新整理。
較佳:
在此範例中,會移除備援標籤,因此主要指令會採用冒號。
請勿將存取金鑰指派給標籤。 不需要這麼做,它會使其他存取金鑰更難指派。
- 例外: 如果並非所有控制項都可以有唯一的存取金鑰,您可以將存取金鑰指派給標籤,而不是個別控制項。 如需詳細資訊,請參閱 鍵盤。
文件
參考選項按鈕時:
- 使用確切的標籤文字,包括其大寫,但不包含便捷鍵底線或冒號。
- 在程式設計和其他技術檔中,請參閱選項按鈕作為選項按鈕。 其他任何地方都會使用選項按鈕,特別是在使用者檔中。
- 若要描述使用者互動,請使用 click。
- 可能的話,請使用粗體文字格式化標籤。 否則,只有在需要防止混淆時,才將標籤放在引號中。
範例:按一下 [目前] 頁面,然後按一下 [ 確定]。