aside element role semantics. (Deprecated)

Rule ID Role 7
Definition aside element must only have role semantics of complementary (default do not set), note, region, search or presentation. NOTE: Deprecated in favor of HTML 3 a more general rule on role restrictions based on ARIA in HTML specification.
Purpose
  • The aside element has role restrictions as part of its definition in the W3C HTML5 Specification.
  • The aside element is used for tangentially related content to main content of the page and are often represented as sidebars in printed typography.
  • Tangentially related content should be identified as a role="complementary", role="search" or role of role="note".
  • The difference between complementary and search roles and the note role is that complementary and search are landmark roles and support and note is not a landmark role.
  • The search role should be used if the content of the aside element are form controls or widgets used for searching the website content.
Mappings
  • HTML4 Legacy Techniques (Recommended)
  • HTML5 and ARIA Techniques (Recommended)
WCAG Success Criteria

1.3.1 Info and Relationships (Level A, Primary Success Criterion)

Rule Category Styling/Content
Scope Element
Target Resources aside element
  • aside
Techniques
  • If the content of the aside element is used for tangentially related content to main content of the page use role="complementary" to make the content part of the landmark navigation of the page.
  • If the content of the aside element is used for website content search form controls use role="search" to identify the search semantics and make the content part of the landmark navigation of the page.
  • If the content of the aside element is used for tangentially related content to main content of the page use role="note". The note role is not part of the landmark navigation of the page and therefore is less commonly used.
  • If the content of the aside element is used as a sub-section of another landmark use role="region" with an accessible name to identify the sub-section.
  • If the content of the aside element is used for any other purpose than for tangentially related content to main content use role="presentation" to remove the aside semantics.
Informational Links