Informationen
Schriftzug <<header> über <<main> und <<footer>. <<main> steht über einem vertikal ausgedehnten Bereich.

Seitenregionen
[Materialsammlung]

Wer mit seinen Augen am Bildschirm arbeitet, kann sich zweidimensional rasch einen Überblick über Seitenbereiche schaffen. Wer hingegen auf einen Screen Reader angewiesen ist, muss sich den Seiteninhalt linear erarbeiten.

Für einzelne Seitenbereiche stehen semantische Elemente zur Kennzeichnung zur Verfügung. Diese Kennzeichnungen liefern für Screen Reader bei der linearen Wahrnehmung eine grobe Struktur des Seiteninhalts.

HTML Regionen

Seit HTML5 stehen folgende Tags zur Kennzeichnung von Seitenregionen zur Verfügung.

aside
Ergänzende Informationen zum Hauptinhalt, etwa Begriffsklärungen.
footer
Der Fußbereich einer Webseite, üblicherweise der Platzt für grundlegende Angaben zu Kontaktmöglichkeiten, dem Impressum und der Barrierefreiheitserklärung.
form
Bereich für Formulare, beginnend mit relevanten Informationen etwa zu Pflichtfeldern oder zum Datenschutz.
header
Der Kopfbereich einer Webseite, üblicherweise mit Logo, Suchbereich und anderen Navigationsbereichen für den gesamten Webauftritt.
main
Der Hauptinhalt einer Webseite beginnend mit einer aussagekräftigen Überschrift der Ebene 1 und dem individuellen Seiteninhalt.
nav
Linksammlung, wie eine Hauptnavigation. Weitere Navigationsbereiche sollten nur mit Vorsicht gekennzeichnet werden.
section
wf

ARIA Landmark Roles

Seitenregionen mussten ursprünglich mit ARIA-Anweisungen gekennzeichnet werden. Die entsprechenden Anweisungen werden als Landmark Roles bezeichnet.

Wo jedoch HTML-Elemente gleichbedeutend mit ARIA-Landmarks verfügbar sind, müssen die HTML-Tags bevorzugt werden. Eine redundante Kennzeichnung mit ARIA-Anweisungen ist nicht mehr erforderlich.

Seitenregionen mittels HTML und ARIA
HTML Element ARIA Landmark
<header> banner
<main> main
<footer> contentinfo
<nav> navigation
<aside> complementary
<section> region
(sofern durch aria-label oder aria-labelledby ein Name verfügbar ist.)

Screen Reader Funktionalitäten

Falls Sie das Auflisten von Regionen testen wollen und über den Screen Reader verfügen: Der JAWS-Befehl lautet: JAWS-Taste + STRG + R.