Best Practices
Properties
Label
- Write a short label that corresponds to the value of the Checkbox. Use the help text or the Checkbox Group label to provide additional context when necessary.
- Use sentence case but capitalize proper nouns.
- Don’t use personal pronouns. For example, write Receive promotional emails instead of I want to receive emails.
- Don’t include negative words. For example, write Receive promotional emails instead of I don’t want to receive emails.
Help text
- Include when it’s necessary to explain the consequences of checking the option.
- Write as if completing the sentence “If you check this option, you or the system…”.
- Start with a verb in the simple present tense. For example, for the option Fragile the help text should be Prints this information on the shipping label.
- Use sentence case, but capitalize proper nouns.
- Don’t write more than one sentence and don’t use periods or commas.
Error text
- Prevent errors whenever possible. When the value of a field is modified, disable other incompatible fields or options automatically.
- Start with an imperative verb. For example, Check this option instead of This field is required.
- Don’t use incomplete sentences. For example, write Check this option instead of Check this.
- Don’t use periods or commas.
Position
Prefer placing a Checkbox at the start or end of a form section.
Behavior
Preselecting
- Check a common or recommended option by default when this can make the user more efficient and when it isn’t important for the choice to be conscious.
- When a recommended option is preselected, add (Recommended) to the end of its label so it can still be identified after edits.
Disabling
- Disable a Checkbox only if it becomes enabled in some condition. For example, an option that becomes unavailable when another field has an specific value.
- When the reason why the field is disabled might be unclear, include a ContextualHelp next to the label to explain.