Repozytorium Web Developera

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.