Menu

Web Accessibility Text Links Color Tables Dynamic Content Forms Navigation Style Sheets Frames Structural Mark-up Units: Sizes/Lengths Deprecated Elements Page Re-Direct Page Refresh Document Validation Priority 1 Priority 3

Users with visual impairments may not be able to determine which label applies to which form control and therefore will not know what data to enter. Proper positioning of the label helps to avoid this.

For each form control, place its label in a <LABEL>. A label is attached to a specific form control using the FOR attribute. The value of the FOR attribute equals the value of the ID attribute.

For example:

<LABEL FOR="firstname">First Name:

<INPUT type="text" id="firstname" tabindex="1">

</LABEL>

produces the following:

First Name:

For example:

<input type="radio" name="button" value="Personal Development" id="dev">

<LABEL FOR="dev">Personal Development</LABEL>

<input type="radio" name="button" value="Management Skills" id="skills">

<LABEL FOR="skills">Management Skills</LABEL>

produces the following:

Personal Development

Management Skills

For example:

First Name:

Last Name:

For example:

Choose a city:

Poway

Sacramento

Make sure that the <LABEL FOR=> is right next to the identifying text as any formatting will not allow this to work properly with assistive computer technology (or some browsers).

Do not forget to close off the label tag with a </LABEL> after the identified text.

As a result of this coding, a screen-reader will report back the "Choose a city:" information whenever the user moves the focus from one radio button to the next radio button. This provides additional feedback in order to move through the form.

Note: HTML 4.0 does not permit nested <OPTGROUPS>. While a future version may add this capability, it is advisable to create only a single grouping level with this element.

For example:

produces...

Choose an institution --COLLEGES-- Big Ben College College of Blue River --UNIVERSITIES-- University of the Red Herring

For example:

Personal information

First name:     Last name:

Address

Street address:     City: