Barrierefreiheit
Was wir getestet haben und wo wir stehen
moiree.eu orientiert sich an WCAG 2.1 Level AA. Diese Seite zeigt, was wir tatsächlich geprüft haben — und wo es noch Lücken gibt.
Testergebnisse
Stand: März 2026. Getestet mit axe DevTools, WebAIM Contrast Checker, VoiceOver (macOS) und manueller Tastaturprüfung.
| Bereich | Status | Details |
|---|---|---|
| Farbkontrast | Bestanden | Alle Text-Kontraste ≥ 4,5:1 (AA). Primärfarbe auf Weiß: 5,1:1. Dunkel-Modus angepasst. |
| Tastaturnavigation | Bestanden | Alle interaktiven Elemente per Tab, Enter und Escape erreichbar. |
| Fokus-Indikatoren | Bestanden | Sichtbare :focus-visible-Stile auf allen interaktiven Elementen. |
| Skip-Link | Bestanden | Auf jeder Seite vorhanden, sichtbar bei Fokus. |
| Screenreader | Bestanden | Semantisches HTML, ARIA-Labels, aria-live für dynamische Inhalte. Getestet mit VoiceOver. |
| Modal-Dialoge | Bestanden | Focus-Trapping, role="dialog", aria-modal. Escape schließt. |
| Formulare | Bestanden | Labels auf allen Feldern, Fehlermeldungen als Text, aria-invalid bei Validierung. |
| Touch-Ziele | Bestanden | Mindestens 44 × 44 px auf allen interaktiven Elementen. |
| Zoom 200 % | Bestanden | Kein horizontales Scrollen, Inhalte fließen korrekt um. |
| Diagramme (Plotly.js) | Teilweise | SVG-Charts nicht für Screenreader zugänglich. Daten als Tabelle und CSV verfügbar. |
| Überschriftenhierarchie | Teilweise | Startseite überspringt eine Ebene (h1 → h3). Übrige Seiten korrekt. |
| Sprachumschalter | Teilweise | Funktional, aber ohne explizites ARIA-Role-Attribut. |
Bekannte Einschränkungen
- Plotly.js-Diagramme auf dem Dashboard werden als SVG gerendert und sind nicht für Screenreader interpretierbar. Die zugrunde liegenden Daten sind über die Datenbank-Seite als Tabelle einsehbar und als CSV exportierbar.
- Die Startseite verwendet h3-Elemente ohne vorheriges h2 — ein Hierarchie-Fehler, der Screenreader-Navigation beeinträchtigen kann.
- Der Sprachumschalter (DE/EN) ist per Tastatur erreichbar, hat aber kein role="button" oder aria-label.
Barriere melden
Wenn du auf eine Barriere stößt, schreib uns: kontakt@moiree.eu (wird nach Launch eingerichtet)
Standards
Diese Seite orientiert sich an WCAG 2.1 Level AA, EN 301 549 und der EU-Richtlinie 2019/882 (European Accessibility Act). Als Forschungsprototyp sind wir nicht rechtlich verpflichtet — wir tun es, weil Barrierefreiheit zum Projektanspruch gehört.