Bedienbar mit Tastatur und Screenreader

Was umgesetzt ist

Die folgenden Punkte sind gebaut.

• Banner und Auswahl sind Dialoge mit Namen und Beschreibung (role="dialog", aria-labelledby, aria-describedby)
• In der Auswahl bleibt der Fokus im Dialog; nach dem Schließen kehrt er dorthin zurück, wo er war – auch auf das Widerruf-Symbol, wenn darüber geöffnet wurde
• Alle Schalter sind echte Kontrollkästchen mit Beschriftung; Knöpfe sind mindestens 44 Pixel hoch
• Sichtbarer Fokusrahmen an jedem Bedienelement
• Einblenden nur, wenn das System keine reduzierte Bewegung verlangt
• Das Banner steht am Anfang des Dokuments und ist mit der Tastatur zuerst erreichbar
• Auf einem 320 Pixel breiten Bildschirm ist die erste Ebene mit den Standardtexten ohne Scrollen bedienbar

Kontraste

Die Farben wählst du selbst – innerhalb der Mindestkontraste nach WCAG 2.1 AA. Text auf dem Hintergrund und die Schrift auf den Knöpfen brauchen mindestens 4,5 zu 1, die Knöpfe und das Widerruf-Symbol gegen den Hintergrund mindestens 3 zu 1. Der Editor zeigt Verstöße sofort; veröffentlichen lässt sich ein Banner mit zu wenig Kontrast nicht.

Was noch fehlt

Geprüft ist das Banner mit automatischen Tests, auch in einem echten Browser (Chromium): gleiche Größe der Hauptknöpfe, Fokusführung, Bedienbarkeit bei 320 Pixeln. Eine Prüfung durch eine unabhängige Stelle, Tests mit Screenreadern und auf echten Telefonen gab es noch nicht. Deshalb sprechen wir von einem Ziel, nicht von einer bestätigten Konformität.

Überschreibst du Texte mit sehr langen eigenen Fassungen, kann das Banner auf kleinen Bildschirmen wieder Scrollen brauchen.

Häufige Fragen