WAI-ARIA
Tester znaczników WAI-ARIA
Comparison of ARIA landmark roles and HTML5 structural elements
| ARIA Landmark Role | HTML5 Sectioning Element |
|---|---|
role="application"
Represents a region of the page representing a unique software unit executing a set of tasks for its users. It is an area where assistive technologies should also return browse navigation keys back over to the web application in this region.
note:It is strongly recommendedthat role="applicat
i
on"be used very sparingly. Refer to Using role="application"
|
No HTML5 element equivalent.
Recommend using on a semantically neutral element such as a div . |
role="banner"
A region that contains the prime heading or internal title of a page. Most of the content of a
banneris site-oriented, rather than being page-specific. Site-oriented content typically includes things such as the logo of the site sponsor, the main heading for the page, and site-specific search tool. Typically this appears at the top of the page spanning the full width.
Note:Within any document
or
application
, the author
SHOULDmark no more than one element with the
banner role. |
No HTML5 element equivalent.
Recommended to be used on one header element per page if the header element is used as described for role=”banner”. |
role="complementary"
A supporting section of the document that remains meaningful even when separated from the main content.There are various types of content that would appropriately have this role. For example, in the case of a portal, this may include but not be limited to show times, current weather, related articles, or stocks to watch. The content should be relevant to the main content; if it is completely separable, a more general role should be used instead. |
<aside>
The
asideelementrepresents a section of a page that consists of content that is tangentially related to the content around the aside element, and which could be considered separate from that content. Such sections are often represented as sidebars in printed typography. |
role="contentinfo"
Metadata that applies to the parent document.For example, footnotes, copyrights, and links to privacy statements would belong here.
Note:Within any
document
or
application
, the author
SHOULDmark no more than one element with the
contentinforole. |
No HTML5 element equivalent.Recommended to be used on one footer element per page if the footer element is used as described for role=”contentinfo”. |
role="form"
A region of the document that represents a collection of form-associated elements, some of which can represent editable values that can be submitted to a server for processing. |
Recommend using on a semantically neutral element such as a div
not on a
formelement, as the element already has default role semantics exposed. |
role="main"
The main content of a document. This marks the content that is directly related to or expands upon the central topic of the document. Within any document or application, the author SHOULD mark no more than one element with the
mainrole.
Note:Within any document
or
application
, the author
SHOULDmark no more than one element with the
mainrole. |
The
mainelementrepresents the
main contentof the
bodyof a document or application. The main content area consists of content that is directly related to or expands upon the central topic of a document or central functionality of an application. |
role="navigation"
A collection of navigational elements (usually links) for navigating the document or related documents. |
The
navelementrepresents a section of a page that links to other pages or to parts within the page: a section with navigation links. |
role="search"
The search tool of a web document. This is typically a form used to submit search requests about the site or to a more general Internet search service. |
No HTML5 element equivalent.
Recommend using on a semantically neutral element such as a div or on a formelement, if the form contains only search related
controls and instructions. |