Checkbox Labels
Give every checkbox a descriptive label that states what selecting it means, and associate the label with the control so assistive technology and the clickable target work correctly.
Write a clear label for every checkbox and programmatically associate that label with the control.
Key details
Further guidance
Association
In HTML, associate the label and checkbox explicitly where possible so the accessible name and clickable area are reliable.
Label Text
The visible label should describe the purpose or choice represented by the checkbox.
Placement
For left-to-right layouts, checkbox labels are conventionally placed to the right while remaining visually close to the control.
Sources and evidence
Sources are shown with the role they play in this guide. Historical or style-sensitive claims are kept within the evidence boundary described above.
- Labeling Controls — W3C WAI Forms Tutorial (opens in a new tab)W3C Web Accessibility Initiative · Descriptive labels for checkboxes and explicit label/control association