Use the label control if:
- You need a label for a control. We recommend that you always use labels for form controls.
Do not use the label control if:
- You want to insert a heading in the column header of a table.
- You want to use it as an alternative for the text control, such as in display-only forms; do not use the label to display the data.
There are two types of labels:
- Not required
To indicate that a field is mandatory, set the property:required. An asterisk will be automatically set in front of the label.
- Always use a label for form controls.
- Use title case for labels.
- Do not use a placeholder (input prompt) as a replacement for the label.
- Do not use bold labels.
The layout can sometimes be simplified by using a placeholder instead of the label control. This exception can be applied in the following cases:
- When the form pattern is easily understood, such as on a login screen. Since this screen consists of only two input controls (username and password), the labels do not have to be used.
- When the form is extremely small and has fewer than three input fields, such as in messaging and small feedback forms.
- In search fields. For more information, see search.