Tastaturzugänglichkeit und ARIA: die gesetzliche Pflicht, die zum Geschäftsvorteil wird

Seit Juni 2025 verlangt der European Accessibility Act digitale Barrierefreiheit für die meisten Online-Dienste. Test #35 erkennt die Tastaturnavigationsprobleme, die Websites gefährden.

Tastaturzugänglichkeit gehört zu den Themen, die die meisten Webprofis als wichtig anerkennen — und dann sofort ignorieren. Die Argumentation ist immer dieselbe: „Unsere Nutzer verwenden eine Maus." Aber diese Annahme ist falsch, und seit Juni 2025 ist sie für eine wachsende Zahl von Unternehmen in der Europäischen Union auch illegal.

Der European Accessibility Act (EAA, Richtlinie 2019/882) verlangt, dass Produkte und Dienstleistungen, die an Verbraucher verkauft werden — einschließlich Websites und mobiler Apps — für Menschen mit Behinderungen zugänglich sind. Tastaturnavigation ist einer der grundlegenden Pfeiler der Web-Barrierefreiheit. Wenn ein Nutzer nicht durch die Oberfläche tabben, Schaltflächen aktivieren oder Menüs ohne Maus navigieren kann, scheitert die Website am grundlegendsten Barrierefreiheitskriterium.

Test #35 von Orilyt analysiert statische HTML-Signale, um die häufigsten Probleme der Tastaturzugänglichkeit zu erkennen: negative Tabindex-Werte, die Elemente aus der Tab-Reihenfolge entfernen, per CSS deaktivierte Fokus-Stile, fehlende Skip-Links und ARIA-Attribute, die mit fokussierbaren Elementen in Konflikt stehen. Es ist kein vollständiges WCAG-Audit — aber es erkennt die wichtigsten Probleme.

Test #35: Was prüft Orilyt?

Test #35 führt eine statische Analyse des HTML und Inline-CSS der Seite durch, um Signale der Tastaturzugänglichkeit zu erkennen. Er prüft sechs spezifische Indikatoren:

1. Negativer Tabindex — Elemente mit tabindex="-1" werden aus der natürlichen Tab-Reihenfolge entfernt. Das ist manchmal beabsichtigt (Modale, Offscreen-Elemente), aber bei Missbrauch entstehen unsichtbare Barrieren. Jedes Vorkommen senkt die Bewertung auf 60
2. Positiver Tabindex — Werte wie tabindex="5" erzwingen eine benutzerdefinierte Tab-Reihenfolge, die fast immer den logischen Lesefluss unterbricht. Der Test markiert diese Fälle als Warnsignal
3. Fokus-Outline deaktiviert — wenn das CSS outline: none enthält, ohne eine entsprechende :focus- oder :focus-visible-Regel mit alternativem Stil bereitzustellen, können Tastaturnutzer nicht sehen, wo sie sich auf der Seite befinden. Die Bewertung fällt auf 60
4. Skip-Link-Erkennung — ein „Zum Inhalt springen"-Link (der auf #main, #content oder ähnliche Anker zeigt) ermöglicht Tastaturnutzern, die Navigation zu überspringen. Sein Vorhandensein ist ein positives Signal, das die Konfidenz erhöht
5. ARIA-hidden-Konflikte — Elemente mit aria-hidden="true", die fokussierbare Kinder (Links, Buttons, Inputs) enthalten, erzeugen eine gefährliche Falle: Screenreader verstecken das Element, aber der Tastaturfokus kann trotzdem darauf landen
6. Fokus-CSS-Präsenz — der Test prüft, ob die Seite :focus- oder :focus-visible-CSS-Regeln enthält, was darauf hinweist, dass der Entwickler die Tastaturnavigations-Gestaltung berücksichtigt hat

Eine saubere Seite ohne offensichtliche Probleme erhält 80. Der Test kann 80 nicht überschreiten, da die statische HTML-Analyse allein die Tastaturnavigation nicht vollständig validieren kann — echte Tab-Tests sind weiterhin nötig. Bei gefundenen Problemen sinkt die Bewertung je nach Schweregrad auf 60 oder 55.

Der European Accessibility Act: Was sich im Juni 2025 geändert hat

Der EAA wurde 2019 verabschiedet, aber die Mitgliedstaaten hatten bis zum 28. Juni 2025 Zeit, ihn in nationales Recht umzusetzen. Seitdem müssen Unternehmen, die Dienstleistungen für Verbraucher in der EU erbringen, Barrierefreiheitsanforderungen erfüllen, die eng an WCAG 2.1 Level AA angelehnt sind.

Der Geltungsbereich ist breit: E-Commerce-Websites, Bankdienstleistungen, Verkehrsticketing, E-Books und jeder digitale Dienst, der an Verbraucher verkauft wird. Kleinstunternehmen (weniger als 10 Mitarbeiter und unter 2 Millionen Euro Umsatz) sind ausgenommen, aber die Schwelle ist niedrig — die meisten Kunden von Agenturen fallen in den Geltungsbereich.

Die Sanktionen variieren je nach Mitgliedstaat, umfassen aber Geldbußen, einstweilige Verfügungen und verpflichtende Korrekturmaßnahmen. Wichtiger noch: Die Verordnung schafft einen Compliance-Markt — Unternehmen brauchen Audits, Sanierungspläne und laufendes Monitoring — Dienstleistungen, die Agenturen verkaufen können.

Tastaturnavigation ist nicht das einzige WCAG-Kriterium, aber es ist dasjenige, das am spektakulärsten scheitert. Ein Nutzer, der nicht über die Navigation hinaustabben kann oder in einem Modal ohne Escape-Taste-Handler gefangen ist, erlebt einen totalen Zusammenbruch der Oberfläche. Es ist das Erste, was Auditoren prüfen.

Die 5 häufigsten Fehler bei der Tastaturzugänglichkeit

In der Praxis fallen die meisten Probleme der Tastaturzugänglichkeit in fünf Kategorien. Jede ist erkennbar und behebbar:

1. Benutzerdefinierte Komponenten ohne Tastaturunterstützung — Dropdown-Menüs, Akkordeons, Karussells und Modale, die mit <div> und JavaScript gebaut wurden, aber keine Tastatur-Event-Handler haben. Sie funktionieren per Mausklick, sind aber für die Tab-Navigation völlig unsichtbar. Korrektur: semantisches HTML verwenden (<button>, <details>) oder korrekte Keydown-Handler und ARIA-Rollen hinzufügen
2. Fehlende Fokusindikatoren — CSS-Resets oder Design-Systeme, die outline: none global einschließen, ohne einen alternativen :focus-visible-Stil bereitzustellen. Tastaturnutzer können buchstäblich nicht sehen, wo sie sind. Korrektur: einen sichtbaren Fokusring im CSS definieren — ein 2px solider Outline in einer kontrastierenden Farbe funktioniert für die meisten Designs
3. Tab-Fallen — modale Dialoge oder eingebettete Widgets, die den Fokus einfangen und keinen Weg bieten, per Tastatur zu entkommen. Der Nutzer steckt fest. Korrektur: Fokus-Trapping implementieren, das innerhalb des Modals zykliert und den Fokus bei Escape freigibt
4. Falsche Tab-Reihenfolge — positive Tabindex-Werte (tabindex="1", tabindex="99"), die die natürliche DOM-Reihenfolge überschreiben. Die Tab-Sequenz wird unvorhersehbar. Korrektur: alle positiven Tabindex-Werte entfernen und sich auf die DOM-Reihenfolge verlassen
5. Fehlende Skip-Links — auf Seiten mit komplexer Navigation müssen Tastaturnutzer durch jeden Link im Header tabben, bevor sie den Hauptinhalt erreichen. Ein „Zum Inhalt springen"-Link oben auf der Seite löst dies mit einer einzigen HTML-Zeile

Wie man Probleme der Tastaturzugänglichkeit behebt

Die gute Nachricht: Die meisten Korrekturen der Tastaturzugänglichkeit sind unkompliziert und erfordern kein Redesign. Sie fallen in drei Kategorien:

1. Semantisches HTML verwenden — <div onclick="..."> durch <button> ersetzen, <a> für Navigation verwenden, <details>/<summary> für aufklappbare Abschnitte. Semantische Elemente sind standardmäßig per Tastatur zugänglich
2. Fokus-Stile hinzufügen — eine :focus-visible-Regel im CSS definieren. Ein einfaches outline: 2px solid #2563EB mit Offset bietet Sichtbarkeit, ohne Mausnutzer zu beeinträchtigen. Niemals outline: none ohne Alternative verwenden
3. Mit der Tab-Taste testen — der effektivste Barrierefreiheitstest kostet nichts: Maus abstecken und die Website mit Tab, Shift+Tab, Enter und Escape navigieren. Wenn Sie feststecken, werden es Ihre Nutzer auch

Speziell für WordPress-Websites ist der häufigste Übeltäter das Theme. Premium-Themes priorisieren oft visuelles Design über Barrierefreiheit. Prüfen Sie die Navigationsmenüs des Themes, Kontaktformulare und alle JavaScript-basierten Komponenten (Slider, Lightboxes, Mega-Menüs).

Barrierefreiheit als Geschäftschance für Agenturen

Für Freelancer und Agenturen hat der EAA einen Compliance-Markt geschaffen, der vor Juni 2025 nicht existierte. Das Geschäftsmodell ist überzeugend:

1. Gesetzliche Pflicht = garantierte Nachfrage — jeder Kunde mit einer E-Commerce-Website oder einem Verbraucherservice in der EU braucht ein Barrierefreiheits-Audit. Das ist nicht optional. Es ist Gesetz
2. Wiederkehrende Einnahmen — Barrierefreiheit ist keine einmalige Korrektur. Websites ändern sich, neue Seiten werden veröffentlicht, Plugins werden aktualisiert. Laufendes Monitoring und regelmäßige Re-Audits sind für dauerhafte Compliance notwendig
3. Geringe Konkurrenz — die meisten Webagenturen bieten noch keine Barrierefreiheits-Services an. Früh dabei zu sein schafft einen Positionierungsvorteil. Die Agenturen, die jetzt handeln, werden dieses Marktsegment dominieren

Im Orilyt-Bericht generiert Test #35 eine klare FIA-Empfehlung, wenn Probleme gefunden werden. Eine Bewertung von 55 oder 60 bei der Tastaturzugänglichkeit ist ein Gesprächsstarter mit jedem Kunden. Die Empfehlung erklärt, was gefunden wurde (z. B. „Fokus-Outline deaktiviert ohne Alternative"), wo es auftritt und was zu tun ist.

Von der gesetzlichen Pflicht zum Wettbewerbsvorteil

Tastaturzugänglichkeit ist kein Nischenthema. Sie betrifft motorisch eingeschränkte Nutzer, Power-Tastaturnutzer, Screenreader-Nutzer und jeden mit einem kaputten Trackpad an einem Dienstagnachmittag. Der EAA hat sie zur gesetzlichen Pflicht für Millionen europäischer Unternehmen gemacht.

Test #35 ersetzt kein vollständiges WCAG-Audit — aber er erkennt die Signale, die darauf hinweisen, ob Tastaturzugänglichkeit überhaupt berücksichtigt wurde. Fehlende Fokus-Stile, Missbrauch negativer Tabindex-Werte und ARIA-hidden-Konflikte sind die Warnsignale, die tiefere Probleme vorhersagen.

Für Agenturen ist dies eine Marktchance mit integriertem Verkaufsargument: „Ihre Website muss gesetzlich barrierefrei sein. Hier ist, was unser Audit gefunden hat. So beheben wir es." Das Gesetz hat den Verkauf für Sie erledigt.