- The
label element content provides effective labels to form controls of following types:
input element of type="radio" and type="checkbox"select element
- Since the form controls of this survey form are densely packed, the
label element contents are hidden entirely or partially from the visual rendering using CSS technique of absolute positioning (i.e. use position: absolute; top: -20em; left: -200em).
- The hidden labels for
input element of type="radio" and type="checkbox" include the following information:
- the question number
- the type of question
- the rating value
- The hidden part of the labels for
select elements include the following information:
- Navigation and Orientation to Survey Questions
- The question numbers are available to the speech user as part of the
label elements to orient them to the question number before reading the question text, but are hidden for the graphical rendering.
- Question text is placed within headings (
h3) to provide direct navigation to questions using heading navigation commands.
tabindex attribute is used on the question text to help screen reader users orient to the question as they TAB through the form controls. Most browsers will move keyboard focus to any element that contains a tabindex attribute value greater than or equal to zero.- The
tabindex attribute is only valid on links and form controls, so using tabindex on other elements will result in validation errors. To get around this problem the tabindex value can be set using javascript after the page loads.
Navigation
Other HTML Best Practices
Working Group
Printer-friendly page
Screen-friendly page