Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Table of Contents

...

  • List options in a logical order:

    • Most likely to least likely to be selected.

    • Simplest to most complex operation.

  • Make the most likely or convenient radio button option the default.

  • If you need to have an unselected state, include a None option.

  • If you can't have a comprehensive list of all possible options, include an Other option.

Use a radio button when the options being presented are important enough to occupy all of the necessary screen space.

Do not use a radio button if:

  • You need to allow the user to make multiple selections . Use → use Checkboxes, because radio buttons only allow single-selection.

  • You need to present more than 8 options . Use → use a Dropdown menu.

  • The default option is recommended for most users in most situations. Consider a Dropdown list instead, which uses less space by not immediately showing all options.

  • There are only two mutually exclusive options. Combine them into a single Checkbox or Toggle switch. For example, use a checkbox for “I agree” (e.g. to terms and conditions) instead of two radio buttons for “I agree” and “I don’t agree”.

  • The options are numbers with fixed steps . Use → use a Slider.

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 select if your age is 20?

  • Forgetting to include choices. e.g. Select age: Below 20, Above 20 - What do you select if you are exactly 20?

...