W3C Logo

ARIA Landmarks Example

Visually outline the landmarks and/or headings on the page using the following buttons.

Contentinfo Landmark

A contentinfo landmark is a way to identify common information at the bottom of each page within a website, typically called the "footer" of the page, including information such as copyrights and links to privacy and accessibility statements.

ARIA 1.1 Specification: contentinfo landmark.

Design Patterns

  • Each page may have one contentinfo landmark.
  • The contentinfo landmark should be a top-level landmark.
  • When a page contains nested document and/or application roles (e.g. typically through the use of iframe and frame elements), each document or application role may have one contentinfo landmark.
  • If a page includes more than one contentinfo landmark, each should have a unique label.

A role="contentinfo" attribute is used to define a contentinfo landmark.

ARIA Example

<div role="contentinfo">

  <h2>Contact, Policies and Legal<h2>

  .... contentinfo area content ....

</div>
  • The HTML5 footer element defines a contentinfo landmark when its context is the body element.
  • The HTML5 footer element is not considered a contentinfo landmark when it is descendant of any of following elements:
    • article
    • aside
    • main
    • nav
    • section

HTML5 Example

<footer>

  <h2>Contact, Policies and Legal<h2>

  .... contentinfo area content ....

</footer>