Skip to end of banner
Go to start of banner

Radio Button

Skip to end of metadata
Go to start of metadata

You are viewing an old version of this content. View the current version.

Compare with Current View Version History

« Previous Version 18 Next »

 Expand for table of Content

Description

ONGOING 

Radio buttons are used when a list of two or more options are mutually exclusive, meaning the user must select only one option. 

Behaviour

When the radio buttons are focused on, it is possible to change selection with the arrow keys. If it is disabled, the cursor will indicate that the selection cannot be made.

Content guidelines 

  • List options in a logical order:
    • Most likely to least likely to be selected.
    • Simplest to most complex operation.
    • Least to most risk.
  • Make one radio button option the default. Select the safest, most secure, and private options first. If safety and security aren’t factors, select the most likely or convenient option.
  • If you need to have an unselected state, add a radio button with a None option.
  • If you can't have a comprehensive list of all possible options, add an Other option.
  • Labels should be concise and provide context.

Try to avoid

  • Putting things in alphabetical order because it is language dependent and not localizable.
  • Overlapping choices. e.g. Select age: 0-20, 20-40 - What do you pick if your age is 20?
  • Forgetting to include choices. e.g. Select age: Below 20, Above 20 - What do you pick if you are exactly 20?



LUX design 


  • No labels