Radio Buttons

A radio button allows users to select one in a group of options.  

Guidelines

  • Use radio buttons when the following conditions apply:
    • You have seven or fewer options. For more than seven options, use a drop-down menu, list box, or datagrid.
    • You want users to see all available options.  This design is more aesthetically pleasing than using a drop-down menu and keeps user clicks to a minimum.
  • Favor vertical orientation of the buttons for readability. Use horizontal orientation only when vertical space is limited.
  • Select the recommended radio button by default.  Unless a reason exists otherwise, include the default button as the first item in the set of options.
  • If users need additional details to make the correct choice, consider placing the radio buttons in the first column of a datagrid and the details in the remaining columns.

  • For the button label:
    • Use four words or fewer.  If more information is needed, include instructional text below the option.
    • Use regular text (not bold text).  
    • Use sentence-style capitalization and no ending punctuation. 
  • If you include a group label:
    • Write text that describe the nature of the options. 
    • Use sentence capitalization and end in a colon (:).

Visual Specification

Related Topics

Average (0 Votes)