Das Frontend-Panel — live, auf jeder DigElite-Seite
Klicke unten links auf den Barrierefreiheit-Button (das kleine Icon mit der Person im Kreis). Das Panel öffnet sich und du kannst die 8 Anpassungen direkt ausprobieren. Genau dieses Panel bekommen deine Besucher:innen, wenn du das Plugin auf deiner Site einsetzt.
Ein Werkzeugkasten — kein Verkaufs-Overlay
Der Unterschied zu Overlay-Widgets: das Panel ist standardmäßig geschlossen. Nur ein kleiner, dezent gestalteter Button am Rand der Seite. Keine roten Banner, keine „Achtung, Barrierefreiheit!"-Pop-ups. Wer es nicht braucht, sieht es kaum.
Wenn jemand das Panel öffnet, bleiben die Einstellungen pro Besucher persistent — über `localStorage`, DSGVO-konform (keine Cookies, keine Server-Speicherung). Bei der nächsten Sitzung sind dieselben Anpassungen sofort wieder aktiv.
Was Besucher:innen einstellen können
- Schriftgröße. 4 Stufen rauf, 4 runter, plus Zurücksetzen. Skaliert ALLES proportional, nicht nur Body-Text.
- Kontrast-Modi. Standard · Hoch · Invertiert · Saturierung-aus. Hoch-Modus garantiert AAA-Kontrast 7:1.
- Animations-Stopp. Friert alle CSS-Animationen, GIFs und Video-Auto-Plays ein. Auch wenn das Theme `prefers-reduced-motion` nicht respektiert.
- Lesehilfe. Eine horizontale Lese-Maske, die sich mit der Maus mitbewegt. Hilft bei Konzentrationsstörungen.
- Cursor vergrößern. Großer Kontrast-Cursor — gut für Screen-Sharing und Sehschwäche.
- Vorlese-Modus. Browser-eigene Speech-API. Klick auf Text startet Vorlesen ab dem Absatz. Kein externes TTS, keine Cloud-Abhängigkeit.
- Sprachumschaltung. Die komplette Webseite wird übersetzt (nicht nur das Bedien-Panel), umgesetzt über die TranslatePress-Integration. Eine Zusatzsprache ist in der Grundversion enthalten, weitere Sprachen sind optional zubuchbar.
- Einstellungen speichern. Auto-Save in `localStorage`. Reset-Button für sauberen Standard zurück.
Das Panel ist 100 % mit der Tastatur bedienbar
- Tab — Navigiert durch alle Panel-Bedienelemente
- Enter oder Leertaste — Aktiviert Buttons / Toggles
- Pfeiltasten — Bewegen Schieberegler (Schriftgröße, Kontrast)
- Esc — Schließt das Panel
- Alt + A — Öffnet das Panel von beliebiger Stelle (Tastenkürzel filterbar)
Fokus-Indikator ist immer sichtbar (3 px Outline-Ring, AAA-Kontrast). Tab-Order folgt der visuellen Reihenfolge. Keine Tastatur-Fallen.
Auf dem Smartphone genauso bedienbar
Auf kleinen Bildschirmen schiebt sich das Panel als Bottom-Sheet hoch — alle Anpassungen mit dem Daumen erreichbar. Buttons sind mindestens 44×44 px (WCAG 2.5.5 „Target Size"). Kein horizontales Scrollen.
Auf Tablets erscheint das Panel als seitliche Schublade. Auf Desktop als kompakte Liste links unten.
3 Selbst-Tests, die du jetzt sofort machen kannst
- Schriftgröße rauf: Öffne das Panel, drücke 3× auf „Schrift größer". Diese Seite skaliert mit — keine Überlappung, kein abgeschnittener Text.
- Animationen stoppen: Aktiviere „Animationen anhalten". Schau dann z. B. auf die Hero-Animationen — alle bleiben stehen.
- Tastatur-Test: Drücke Tab 10× hintereinander. Du siehst immer einen kräftigen orangen Fokus-Ring. Keine versteckten Sprünge.
Wenn etwas davon nicht klappt, schreib uns — das ist dann ein Bug bei uns, kein „Feature" im Plugin.
Plugin auf eigener Seite testen?
Im Erstgespräch installieren wir das Plugin auf einer Staging-Kopie deiner Seite — du siehst die Wirkung direkt im echten Layout, ohne Risiko für die Live-Site.
