Barrierefreiheit
WCAG 2.2 AA Compliance
WCAG 2.2 AA Konformitätsanalyse. Ursprünglich ~80 Verstöße identifiziert. Alle 10 priorisierten Kategorien per 07.06.2026 behoben.
Re-Test 07.06.2026
Alle priorisierten Verstöße behoben
Die ursprüngliche externe Prüfung identifizierte ~80 WCAG 2.2 AA Verstöße. Der Re-Test am 07.06.2026 bestätigt: alle 10 priorisierten Kategorien sind behoben.
✅
Kontrast
✅
Fokus-Ring
✅
Touch-Targets
✅
Skip-Link
✅
ARIA-Labels
Aktuelle Compliance — Re-Test 07.06.2026
| WCAG | Level | Status | Beschreibung |
|---|---|---|---|
| 1.4.3 Kontrast (Minimum) | AA | Behoben | Behoben: text-slate-300 für Fließtext, Fokus-Ring 3px cyan (#06b6d4). Cookie-Banner: #1e40af Button, #93c5fd Icon. |
| 2.4.7 Fokus-Sichtbarkeit | AA | Behoben | Behoben: Globales :focus-visible { outline: 3px solid #06b6d4 !important } im Layout-CSS. |
| 2.5.8 Zielgröße (Minimum) | AA | Behoben | Behoben: min-height:44px; min-width:44px für alle interaktiven Elemente (a, button, input, select, textarea, [role="button"]). |
| 1.3.1 Info und Beziehungen | A | Behoben | Behoben: Alle Formulare haben <label> mit for-Attribut. Newsletter-Form, Suche, Login. |
| 1.1.1 Nicht-Text-Inhalt | A | Behoben | Behoben: Dekorative SVGs haben aria-hidden="true". Logo hat alt-Text. |
| 2.4.1 Bereiche überspringen | A | Behoben | Behoben: sr-only focus:not-sr-only mit fixierter Position und hohem z-index. |
| 2.1.1 Tastatur | A | Behoben | Behoben: aria-expanded, aria-controls, Escape-Key-Handler, tabindex="-1" bei geschlossenem Menü. |
| 4.1.2 Name, Rolle, Wert | A | Behoben | Behoben: Feature-Cards haben unique aria-labels. Cookie-Banner hat role="alert". Mobile-Menü aria-label. |
| 1.4.11 Nicht-Text-Kontrast | AA | Behoben | Behoben: border-white/20 oder /30 für Karten und interaktive Elemente. |
| 3.3.2 Beschriftungen | A | Behoben | Behoben: Jedes Input-Feld hat <label> oder aria-label. |
Technische Implementierung
- ·
:focus-visible { outline: 3px solid #06b6d4 !important }im globalen Layout-CSS - ·
min-height: 44px; min-width: 44pxfür alle interaktiven Elemente - ·
.sr-onlyKlasse für Screenreader-Only-Inhalte - ·
aria-expanded+aria-controlsam Mobile-Menü-Button - ·
aria-hidden="true"an dekorativen SVG-Icons - ·
aria-labelan Feature-Card-Links für eindeutige Beschreibung - ·
role="alert"am Cookie-Banner,aria-live="polite"