HTML and CSS Reference
ARIA document structure
and landmark roles
WAI-ARIA defines several roles that tell assistive technology
about landmarks and the structure of a document. Some of
Looking at a simple page from an ARIA perspective, you might
see what is shown in Figure 2.18 .
FIguRE 2.18 A simple page
with a header, sidebar, and
main content area and ARIA
Some of these obviously match HTML5 elements, such as
<article> , <form> , <header> , and <nav> .
Others lack an obvious one-to-one correspondence. For exam-
ple, role=banner “typically includes things such as the logo or
identity of the site sponsor, and site-specific search tool. A ban-
ner usually appears at the top of the page and typically spans
the full width.” That initially seems to match HTML5 <header> , but
as you've seen, there can be multiple <header> s on a page. So
the “page header” is the only one allowed to have role=banner .