| Rule ID |
Landmark 2 |
| Definition |
All rendered content must be placed inside of container elements with appropriate ARIA landmark roles. |
| Purpose |
- Landmarks provide a way to organize the various types of content on a page for users of assistive technologies. The organization of content regions using landmarks is functionally similar to the way visual designers organize information for people who rely on a graphical rendering of the content.
- When content is not contained in a landmark, it will be unreachable using landmark navigation, which is an important feature provided by assistive technologies such as screen readers.
|
| Mappings |
-
HTML5 and ARIA Techniques
(Required)
|
| WCAG Success Criteria |
1.3.1 Info and Relationships (Level A, Primary Success Criterion)
Other Related Success Criterion:
|
| Rule Category |
Landmarks |
| Scope |
Element |
| Target Resources |
all rendered content
|
| Techniques |
- Use the appropriate landmarks to identify the different regions of content on a web page.
- The most important landmark roles are
main and navigation, as nearly every page will include at least those regions.
- Other commonly used landmark roles include
banner, contentinfo, complementary and search.
- Use HTML5 sectioning elements that have a default ARIA landmark role:
main (main), nav (navigation), aside (complementary) and in some situations header (banner) and footer (contentinfo). When using these elements, the role attribute should NOT be defined.
- In HTML4 and XHTML 1.0 documents, a landmark can be created using a
div element with a role attribute and the appropriate ARIA landmark role value (e.g., role="main").
- The
search role is typically placed on a form element or a div that surrounds the search form.
|
| Manual Checks |
object, embed and applet tags may be used to render content. Use inspection tools to determine if any of these elements actually render content on the page.
|
| Informational Links |
|