Skip to content

Erstellen von Landmarken (HTML5, ARIA)

Verwenden Sie entweder HTML5-Landmarks oder deren ARIA-Entsprechungen.

Hier findet ihr eine Liste mit HTML5-Punkten und ihren ARIA-Entsprechungen

Die Zuordnung von ARIA-Rollen und HTML5-Elementen ist nicht genau. Die beiden Spezifikationen haben unterschiedliche Ziele. Die folgende Tabelle zeigt, wo es Gemeinsamkeiten gibt.

HTML5ARIA-RolleVon den meisten Screenreadern als Orientierungspunkt aufgeführt
<header>role=“banner”Ja
<nav>role=“navigation”Ja
n/arole=“search”Ja
<main>role=“main”Ja
<footer>role=“contentinfo”Ja
<aside>role=“complementary”Ja
<section>role=“region”

Die meisten Bildschirmleseprogramme zeigen sie nur an, wenn ihnen ein Name gegeben wird. Benutzer von Bildschirmleseprogrammen können sich anhand von Überschriften durch den Text bewegen. Deshalb muss man nicht jedem Abschnitt oder jeder Region einen Namen geben. Es ist sogar schlecht, zu viele Orientierungspunkte auf einer Seite anzugeben, weil das den Benutzer verwirrt.

<article>role=“article”

JAWS listet es auf, andere Programme aber nicht.

<form>role=“form”

Gemischte Unterstützung: Bildschirmleseprogramme listen Formulare nur auf, wenn sie als role=„form“ markiert sind (das <form> Element wird in Landmark-Listen ignoriert).

Die nützlichsten Elemente sind Header/Banner, Nav/Navigation, Main und Footer/Contentinfo. Die anderen können ebenfalls verwendet werden, sind aber nicht so weit verbreitet.