Selection controls guidelines
Labels
Checkbox and radio button labels
A label should be succinct, short, and descriptive with one to two words. This way users can quickly scan the available options.
Do: Use one to two descriptive words.
Don't: Repeat the same words. They make labels difficult to scan.
Use positive and active wording.
Do: Tell users what happens when the selection control is on.
Don't: Use negatives. They're unnatural and confusing.
Use sentence case (capitalize the first word).
Do: Sentence case makes titles easier to read.
Don't: Title case can feel more cluttered.
Use consistent label structures for options within the same group.
Do: Use sentences only or fragments only.
Don't: Mix label structure within the same group of options.
Do: Start all with a verb, all with a noun, or all with a number.
Don't: Use ending punctuation. Exception: Question marks can be used if they add clarity.
Legends
For groups of options, add a legend that gives meaning to the options. Legends appear like a title.
Do: Use nouns that describe the choices to make.
Don't: Repeat choices or use the title as instructions.
Switch labels
The label should be static, action-oriented, and describe the feature. Avoid verbs that are less conversational such as "enable" unless they are your only option.
Do: Use a static noun describing the setting to turn on or off.
Don't: Start with statements such as "If true" or "If enabled".
Do: If relevant, start with a verb ("Use A", "Show B") and add help text to provide more info.
Don't: Use only a verb. Generic verbs alone make options unclear.
Use past tense only when labelling a list of previously created items, like in a table header.
Enabled | |||
---|---|---|---|
Do: In a list of already created items, use the past tense.
Don't: Change the label to represent the current state of the switch.