Radio Button 單選按鈕

概述

單選按鈕是一種允許使用者在一組互斥的選項中僅能選擇一個選項的控制元件。

使用時機

單選按鈕常用於以下情境:

  • 單選情境:當選項之間互斥,使用者只能選擇一個選項時。
  • 表單輸入:在表單中收集使用者的單一選擇。
  • 設定切換:讓使用者在多個互斥的設定選項中選擇一個。
  • 問卷調查:讓使用者從多個答案中選擇一個。

使用規範

當您取用單選按鈕元件進行設計時,應考慮以下原則:

  • 文字易讀性:按鈕文字應保持清晰簡潔、易於理解。避免冗長或語意模糊的用詞。
  • 預設選項:根據使用情境,設定一個單選按鈕在預設狀態下被選中。
  • 考量選項涵蓋範圍:確保選項能涵蓋用戶選擇的範圍,若無法全面涵蓋,請提供一個標有「其他」的選項並輔以輸入框。
  • 分組明確:多個單選按鈕應在視覺上進行分組,以表示它們屬於同一組。
  • 提供用戶回饋:當使用者選取或取消選取單選按鈕時,應提供清晰的回饋。

設計範例

  1. 群組標籤 (Group Label)(選擇性):描述選群組或提供選擇指引。
  2. 單選按鈕 (Radio Button):選擇項目元件。
  3. 標籤 (Label):描述您要選擇或取消選擇的資訊。 單選按鈕標籤位於其輸入的右側,採用從左到右閱讀的語言。如果有單選按鈕分組,則可以根據用例和 UI 結構垂直或水平佈局。如果可能,請垂直排列單選按鈕和複選框組以便於閱讀。
回頁首