HTML and XHTML
This technique relates to:
JAWS and WindowEyes all provide navigation via headings and provide information about the level of the heading. The Opera browser provides a mechanism to navigate by headings. Additional plugins support navigation by headings in other user agents.
The objective of this technique is to demonstrate how using the heading elements, h1
- h6
, to markup the beginning of each section in the content can assist in navigation. Most assistive technologies and many user agents provide a mechanism to navigate by heading elements by providing keyboard commands that allow users to jump from one heading to the next. Using heading elements to markup sections of a document allows users to easily navigate from section to section.
This example organizes the sections of a search page by marking each section heading using h2
elements.
<h1>Search Technical Periodicals</h1> <h2>Search</h2> <form action="search.php"> <p><label for="searchInput">Enter search topic: </label> <input type="text" size="30" id="searchInput"> <input type="submit" value="Go"></p> </form> <h2>Available Periodicals</h2> <div class="jlinks"> <a href="pcoder.com">Professional Coder</a> | <a href="algo.com">Algorithms</a> | <a href="jse.com">Journal of Software Engineering</a> </div> <h2>Search Results</h2> ... search results are returned in this section ...
Resources are for information purposes only, no endorsement implied.
For all content which is divided into separate sections,
Check that each section is marked with one of the elements h1-h6
.
Check #1 is true.