Barrierefreiheit testen #

Diese Seite richtet sich an Website-Ersteller, die eine Website vor dem Start und nach Änderungen prüfen. Automatische Werkzeuge finden einen Teil der Probleme; der Rest braucht einen Menschen mit Tastatur und Screenreader. Diese Routine dauert für eine typische Website ein paar Stunden und findet die meisten Probleme.

Inhalt #

1. Die Seiten auswählen
2. Automatische Prüfungen
3. Durchgang mit der Tastatur
4. Durchgang mit dem Screenreader
5. Zoom, Farbe und Bewegung
6. Befunde festhalten
7. Nach dem Start

Die Seiten auswählen #

Testen Sie eine Seite je Template, nicht jede Seite:

• die Startseite und jedes Layout einer Landingpage;
• eine Vollansicht jeder Klasse (Artikel, Veranstaltung, Produkt ...);
• eine Ordnerliste mit Seitenaufteilung;
• Suchergebnisse, mit und ohne Treffer;
• jedes Formular: Kontakt, Registrierung, Anmeldung, Newsletter, Kasse;
• Fehlerseiten (nicht gefunden, Zugriff verweigert);
• jeden Sprach-Siteaccess, einschließlich derer mit Schreibrichtung von rechts nach links.

Automatische Prüfungen #

Lassen Sie auf jeder Seite ein automatisches Prüfwerkzeug für Barrierefreiheit laufen (zum Beispiel eine Browsererweiterung oder ein Kommandozeilenwerkzeug auf Basis von axe). Beheben Sie jeden gemeldeten Fehler; lesen Sie die Warnungen. Lassen Sie es auch mit Ihren Farbschemata und bei Smartphone-Breite laufen. Automatische Werkzeuge finden fehlende Alternativtexte, Beschriftungen, Kontrastprobleme und falsches ARIA, nicht aber, ob die Reihenfolge sinnvoll ist.

Durchgang mit der Tastatur #

Legen Sie die Maus weg, und verwenden Sie Tab, Umschalt+Tab, Eingabe, Leertaste, Escape und die Pfeiltasten:

• To do: Der Sprunglink erscheint beim ersten Tab und funktioniert.
• To do: Jeder Link und jedes Bedienelement ist in einer sinnvollen Reihenfolge erreichbar.
• To do: Der Fokus ist immer sichtbar.
• To do: Menüs öffnen und schließen sich mit der Tastatur; Escape schließt Pop-ups und gibt den Fokus zurück.
• To do: Nichts hält den Fokus gefangen (eingebettete Karten, Videoplayer, CAPTCHAs).

Durchgang mit dem Screenreader #

Mit einem Screenreader, den Ihr Betriebssystem anbietet:

• To do: Der Seitentitel sagt, wo Sie sind.
• To do: Landmarks und Überschriften ergeben eine brauchbare Gliederung.
• To do: Bilder werden wie beabsichtigt beschrieben oder übersprungen.
• To do: Formularfelder kündigen ihre Beschriftung, den Pflichtstatus und Fehler an.
• To do: Sprachwechsel werden in der richtigen Sprache vorgelesen.

Zoom, Farbe und Bewegung #

• To do: 200 % Zoom und 320 CSS-Pixel Breite: kein horizontales Scrollen, nichts abgeschnitten.
• To do: Kontrast mindestens 4,5:1 für Text, 3:1 für großen Text und Bedienelemente.
• To do: Informationen werden nicht allein durch Farbe vermittelt.
• To do: Wenn reduzierte Bewegung angefordert ist, halten Slider und Animationen an.

Befunde festhalten #

Teilen Sie die Behebungen in Template-Arbeit (einmal, für jede Seite) und Inhaltsarbeit (Redaktion, Seite für Seite) auf.

Nach dem Start #

• Lassen Sie die automatischen Prüfungen nach jeder Designänderung erneut laufen, als Teil Ihrer Release-Prüfungen (Anwendungen testen).
• Bringen Sie der Redaktion die Regeln für Inhalte bei (Barrierefreiheit für Website-Ersteller).
• Geben Sie Besuchern eine Möglichkeit, Barrieren zu melden (ein Kontaktformular), und beantworten Sie die Meldungen.

Verwandte Seiten #

• Barrierefreiheit für Website-Ersteller
• Checkliste für den Start
• Qualitätstore und Abnahme
• Freie Dokumentation: Diese Seite darf unter der GNU FDL 1.3 frei kopiert, übersetzt und verbessert werden.