Eine Schaltfläche im Bestellprozess kann ausgezeichnet aussehen und trotzdem keinen verständlichen zugänglichen Namen haben. Ein Formular kann alle Pflichtfelder anzeigen und dennoch Menschen darüber im Unklaren lassen, welche Angaben erwartet werden. Entscheidend ist, ob jemand seine Aufgabe erledigen kann, nicht die Farbe einer Kennzahl.
Prüfen Sie eine Seite, die Ihnen gehört oder für deren Prüfung Sie autorisiert sind, und halten Sie den Bericht neben dem Browser offen. Die statische Prüfung und der praktische Nutzungstest liefern unterschiedliche Nachweise. Weder eine kurze Mängelliste noch eine grüne Bewertung beweisen die vollständige Erfüllung der WCAG.
Umfang dieser Prüfung
Was messbar ist
- Statisches HTML einer angeforderten Seite mit Hinweisen zu Beschriftungen, Namen, Alternativtexten und Struktur.
- Ausgewählte Markup-Muster für Fokus, Formulare, Frames, Tabellen und Medien.
- Bestimmte explizite Vordergrund- und Hintergrundfarben in Inline-Stilen.
Was sie nicht belegt
- Keine vollständige Ausführung interaktiver Abläufe oder Prüfung mit einem Screenreader.
- Keine vollständige Bewertung berechneter CSS-Farben und aller Darstellungszustände.
- Keine WCAG-Zertifizierung und kein Nachweis rechtlicher Konformität.
Das Barrierefreiheitsmodul ist in Starter, Professional und Enterprise verfügbar; Free umfasst dieses Modul nicht. Die manuellen Schritte können Sie unabhängig davon durchführen.
Mit einer wichtigen Aufgabe beginnen
Wählen Sie einen konkreten Ablauf: ein Angebot anfordern, ein Konto erstellen, eine Spezifikation lesen oder den Support erreichen. Notieren Sie die genaue URL, die Sprache und das erwartete Ergebnis. Halten Sie außerdem fest, ob die Seite öffentlich erreichbar ist oder eine Anmeldung erfordert. Eine öffentliche Seitenprüfung belegt nicht, dass der angemeldete Ablauf funktioniert.
Beginnen Sie mit einer repräsentativen Seite und prüfen Sie anschließend andere Vorlagen gesondert. Ein Fehler in der gemeinsamen Navigation kann viele Seiten betreffen; eine unauffällige Startseite sagt dagegen wenig über ein Bestellformular oder ein Dialogfenster aus. Priorisieren Sie Hindernisse, die eine Aufgabe verhindern, vor kosmetischen Aufräumarbeiten. Die Auswirkung eines Befunds ergibt sich aus seinem Nutzungskontext.
Verstehen, was tatsächlich gemessen wurde
Der aktuelle Sitelemetry-Prüfer untersucht das statische HTML einer Seite. Er sucht unter anderem nach fehlenden Bildalternativen, Dokumenttitel und Sprache, möglicherweise unbeschrifteten Formularfeldern, namenlosen Links und Schaltflächen, problematischen Überschriftenfolgen, fehlenden Hauptbereichen, positiven tabindex-Werten und doppelten IDs. Einige Prüfungen sind bewusst Heuristiken und benötigen eine Bestätigung.
Er betrachtet auch ausgewählte Inline-Farbpaare. Das ist keine vollständige Kontrastprüfung: vererbte CSS-Werte, Hintergrundbilder, Überlagerungen und interaktive Zustände können fehlen. Bei fehlgeschlagenem Abruf, einer vorgeschalteten Prüfseite, unvollständigem Inhalt oder Nicht-HTML bleibt die Bewertung nicht verfügbar beziehungsweise nicht anwendbar. Das bedeutet nicht barrierefrei. Die W3C-Hinweise zur Werkzeugauswahl erläutern, weshalb menschliche Beurteilung unverzichtbar bleibt.
Den Nachweis lesen, bevor Arbeit zugewiesen wird
Ein hilfreiches Arbeitspaket nennt URL, betroffenes Element oder Beispiel, zu überprüfendes Verhalten und die möglicherweise blockierte Aufgabe. „Drei Bilder ohne alt“ ist konkreter als „Barrierefreiheit verbessern“. Ein vorhandener Alternativtext ist aber noch kein Beweis dafür, dass er die Funktion des Bildes beschreibt.
Prüfen Sie zweifelhafte Befunde im Browser. Ein statisches Muster kann eine umschließende Beschriftung übersehen oder ein aria-labelledby akzeptieren, dessen Ziel gar nicht existiert. Kontrollieren Sie den tatsächlich berechneten Namen im Barrierefreiheitsbaum. Auch eine Warnung zur Überschriftenfolge verlangt eine inhaltliche Prüfung und ist kein pauschales WCAG-Urteil. Fassen Sie wiederkehrende Befunde nach gemeinsamer Komponente zusammen, statt jede Seite isoliert zu reparieren.
| Beobachtung | Priorität im Kontext | Zu bestätigender Nachweis | Nächster Schritt |
|---|---|---|---|
| Ein Pflichtfeld hat keinen brauchbaren Namen | Hoch, wenn eine wichtige Aufgabe blockiert wird | Berechneten Namen prüfen und Formular ausfüllen | Beschriftung zuordnen und den Ablauf wiederholen |
| Einem Bild fehlt eine Alternative | Abhängig vom Bildzweck | Information, Funktion oder Dekoration bestimmen | Passende Alternative schreiben oder dekoratives alt leer lassen |
| Warnung zur Überschriftenfolge | Im Kontext prüfen | Dokumentstruktur und Inhalt lesen | Gemeinsame Struktur korrigieren, wenn sie das Verständnis erschwert |
Die zugrunde liegende Komponente reparieren
Bevorzugen Sie native HTML-Bedienelemente mit sichtbaren Beschriftungen. Bei einer expliziten Zuordnung muss for auf die richtige Feld-ID verweisen. Ein Platzhalter verschwindet bei der Eingabe und ersetzt keine verlässliche Beschriftung. Die W3C-Anleitung zu Formularbeschriftungen zeigt geeignete Zuordnungen. Bei einer reinen Symbolschaltfläche sollte der Name die Handlung erklären, etwa das Öffnen der Suche, nicht bloß das Symbol beschreiben.
Entscheiden Sie bei Bildern anhand ihres Zwecks: Information vermitteln, eine Handlung auslösen oder dekorieren. Ein funktionales Bild benötigt einen passenden Namen; für rein dekorative Bilder kann ein leerer Alternativtext richtig sein. Leeren Sie nicht sämtliche Texte, um Warnungen loszuwerden. Nutzen Sie die W3C-Bildanleitungen und korrigieren Sie Komponente oder Inhaltsmodell, damit neue Inhalte den Fehler nicht wiederholen.
Die Prüfung im Browser vervollständigen
- Erreichen und aktivieren Sie die Bedienelemente nur mit der Tastatur. Prüfen Sie sichtbaren Fokus, sinnvolle Reihenfolge und ob sich Dialoge wieder verlassen lassen.
- Prüfen Sie mit einem Screenreader Überschriften, Namen, Anweisungen und Fehlermeldungen. Verständlichkeit der Aufgabe zählt mehr als die Tatsache, dass überhaupt etwas vorgelesen wird.
- Messen Sie relevante Kontraste in Normal-, Hover-, Fokus- und Fehlerzuständen sowie bei Bildern oder Überlagerungen.
- Testen Sie Vergrößerung und schmale Ansichten. Achten Sie auf verschwundene Bedienelemente und unpraktisches Scrollen.
Diese Schritte sind ergänzende Nutzungstests, keine behaupteten Fähigkeiten des statischen Prüfers. Die W3C-Erstprüfungen bieten einen Einstieg. Beziehen Sie bei entsprechender Bedeutung der Anwendung Menschen mit unterschiedlichen Zugangsbedürfnissen ein.
Erneut testen und den verbleibenden Umfang dokumentieren
Prüfen Sie nach der Änderung dieselbe URL erneut und vergleichen Sie den konkreten Nachweis. Wurde die gemeinsame Komponente korrigiert? Sind neue Namens- oder Strukturprobleme entstanden? Wiederholen Sie auch den ursprünglichen manuellen Ablauf. Eine verschwundene Warnung bei weiterhin unbedienbarem Dialog ist keine abgeschlossene Reparatur.
Dokumentieren Sie Datum, Seite, Änderungen sowie statische und manuelle Ergebnisse getrennt. Für Kundenberichte sollte ersichtlich sein, welche Vorlagen und Interaktionen geprüft wurden und welche außerhalb des Umfangs lagen. Der Punktwert ist weder ein Anteil erfolgreicher Nutzer noch ein Rechtsnachweis. Lassen Sie offene manuelle Prüfungen sichtbar und nehmen Sie kritische Abläufe in die Prüfung vor künftigen Veröffentlichungen auf.
Häufige Fragen
Belegt eine hohe Bewertung die Erfüllung der WCAG?
Nein. Sie beschreibt die vom Prüfer untersuchten Muster innerhalb des angegebenen Umfangs. Interaktionen, Inhalte und weitere Anforderungen benötigen zusätzliche fachliche und manuelle Prüfung.
Braucht jedes Bild einen beschreibenden Alternativtext?
Entscheidend sind Zweck und Kontext. Informative und funktionale Bilder brauchen passende Alternativen; bei rein dekorativen Bildern kann ein leerer Alternativtext richtig sein.
Kann die Prüfung feststellen, ob ein Dialog bedienbar ist?
Sie kann Hinweise im verfügbaren Markup finden. Sie öffnet den Dialog jedoch nicht und belegt weder Tastaturführung noch Fokusverwaltung oder Verständlichkeit mit einem Screenreader.
Quellen und weiterführende Links
- W3C: Werkzeuge zur Bewertung auswählenwww.w3.org
- W3C: Formularfelder beschriftenwww.w3.org
- W3C: Bilder und Textalternativenwww.w3.org
- W3C: Erste Prüfungen der Barrierefreiheitwww.w3.org
Vom Sitelemetry-Team mit dem Prüfumfang des Produkts und verlinkten Primärquellen abgeglichen. Beispiele dienen der Veranschaulichung, sofern kein beobachteter Fall ausdrücklich genannt wird.
