| Techniques |
- The preferred technique for labeling standard HTML form controls is by reference: First, include an
id attribute on the form control to be labeled; then use the label element with a for attribute value that references the id value of the control.
- NOTE: The alternative technique of using the
label element to encapsulate a the form control element does not fully support some assistve technologies, like speech input for activating the control.
- The
fieldset and legend elements can be used add a grouping label to the form controls contained in the fieldeset element.
- For ARIA widgets and special cases of standard HTML form controls, the
aria-labelledby attribute can be used to reference the id(s) of the elements on the page that describe its purpose.
- For ARIA widgets and special cases of standard HTML form controls, the
aria-label attribute can be used to provide an explicit text description of its purpose.
- For ARIA widgets and special cases of standard HTML form controls, the
title attribute can be used to provide an explicit text description of its purpose.
- For
input[type=submit] the default label is "Submit", but the label can be changed using other labeling techniques if there is more than one submit button on the page.
- For
input[type=reset] the default label is "Reset", but the label can be changed using other labeling techniques if there is more than one reset button on the page.
- For
input[type=image] the default label is defined using the alt attribute.
- For
input[type=button] the default label is defined using the value attribute.
- For the
button element, the child text content can be used to define its purpose.
- For some ARIA widgets (e.g.
menuitem, tab, treeitem), the child text content can be used to define its purpose.
- EXCEPTION: When form controls are in a
table, grid or treegrid the row number and the header cells is a common practice to identify the purpose of the form control. While this technique is widely used it has not been identified as a definitive way to meet WCAG labeling requirements.
|