ARIA-Landmarks sind benannte Regionen, die eine Seite in logische Bereiche aufteilen: Kopfbereich, Navigation, Hauptinhalt, Fußzeile. Screenreader bieten eine Liste dieser Landmarks an, über die Nutzer direkt zum gewünschten Bereich springen – ähnlich wie ein Inhaltsverzeichnis für die Seitenstruktur. Das macht die Orientierung schnell und ist eine der wirksamsten Maßnahmen für blinde Nutzer.
Landmarks entstehen aus HTML
Das Beste: Du brauchst meist gar kein ARIA. Setzt du semantisches HTML ein, erzeugen die Elemente die Landmarks automatisch:
<header>wird zur Landmark banner (im Seitenkontext).<nav>wird zur Landmark navigation.<main>wird zur Landmark main – nur einmal pro Seite.<footer>wird zur Landmark contentinfo.<aside>wird zur Landmark complementary.
Nur wenn du keine passenden Elemente nutzen kannst, ergänzt du WAI-ARIA-Rollen wie role="navigation" manuell.
Häufiger Fehler
Hast du mehrere gleichartige Landmarks – etwa zwei <nav> für Haupt- und Servicemenü – benenne sie eindeutig mit aria-label, damit Nutzer sie unterscheiden können. Ein weiterer Klassiker in WordPress: Der Hauptinhalt steckt nicht in einem <main>, sondern in verschachtelten <div>-Containern des Page-Builders. Dann fehlt die wichtigste Landmark komplett. Prüfe deine Templates und stelle sicher, dass jeder relevante Bereich genau einer Landmark entspricht. Landmarks arbeiten Hand in Hand mit Sprungmarken und einer sauberen Überschriftenstruktur.