top of page

Writing Checkboxes and Radio Buttons

Most of us know when to use them: checkboxes are for when more than one option can be selected, or when a user can opt into something specific; radio buttons are used when one specific option should be selected.


Checkboxes


Checkboxes, like any other UI component, should be consistent. If you capitalize one, capitalize the rest, and try to keep the length fairly equal. Users will have an easier time reading the options if they're in the same format.

Wix uses checkboxes for blog categories.

A common mistake made by UX writers is putting repetitive information in each checkbox, instead of in the title. The option on the right is shorter, easier to understand, and doesn't repeat the same action on every box.

Subscriptions

[ ] Subscribe to newsletters

[ ] Subscribe to deals and discounts

[ ] Subscribe to weekly summaries

​Subscribe to

[ ] Newsletters

[ ] Deals and Discounts

[ ] Weekly Summaries

Checkboxes can also be used when users need to accept terms and conditions, or when they opt in to communication. Be sure not to use double negatives, and clearly lay out any consequences of ticking (or not ticking) the box.


Also have a conversation with your designer about the default state of the box. Will it be selected automatically, or unselected? Whatever you choose, make sure it's in the best interest of the user.


As shown by NNG, requiring a box to be ticked for an action NOT to occur is bad UX.

Radio Buttons


Radio buttons are a bit simpler, since users can only select one option.


The same basic principles apply: keep formatting and content consistent, and order the options in a logical way. Consider whether one of the options should be pre-selected, and keep the copy to one line when possible.


Slack uses radio buttons often within its settings.

Also remember that good UI allows users to undo an option. Users should be able to deselect the option they selected; talk to your designer to make sure this is possible.


Some radio buttons have both subtitles and titles. If you choose this design, use the subtitle to give more context about the option, and use the format for all options.



Android offers specifics in their subtitles when saving a file.

Like any other UX writing, keep it simple. Users typically don't mind making choices when they're presented in a clear way.

Comments


Thanks for subscribing

bottom of page