Prüf-Tools zum Testen auf Barrierefreiheit

Die hier gelisteten Tools wurden im Projekt getestet und als empfehlenswert befunden. Sie stellen eine Auswahl ohne Anspruch auf Vollständigkeit dar.

1. Prüfen von PDF

PDF-Accessibility-Checker (PAC)

Der PDF-Accessibility-Checker wird von der Schweizer Stiftung ‘Zugang für alle’ kostenfrei bereitgestellt. Die Webseite der Stiftung bietet zudem Hinweise zum Erstellen barrierefreier PDF-Dokumente.

Geeignet für:

  • Experten- und Betroffenen-Tests
  • alle Anwender

VIP-PDF-Reader – ein innovatives Tool für Sehbehinderte

Der PDF-Reader für Sehbehinderte ist ein kostenfreies, einfach zu bedienendes Tool, das vom Schweizerischen Zentralverein für das Blindenwesen (SZB) – dort die Links für den Download sowie Handbücher – in Verbindung mit der Stiftung “Zugang für alle” und der xyMedia GmbH entwickelt und bereitgestellt wird.

Auch wenn dieses Werkzeug primär dem barrierefreien Lesen von PDF-Dokumenten durch Sehbehinderte (nicht blinde Menschen!) und weniger als Prüftool dient, bietet es nennenswerte Vorzüge für Ersteller und Provider von PDF-Dokumenten:

  • Der VIP-PDF-Reader erkennt optimal korrekt erstellte barrierefreie PDF-Dokumente und ermöglicht Sehbehinderten ein barrierefreies Arbeiten im Netz. Wird ein Dokument vom Reader als nicht barrierefrei erkannt, stellt dieser auf den herkömmlichen PDF-Reader von Adobe um.
    Somit kann das Tool etwa auch als Service in Repositorien angeboten werden, ohne dass nicht-barrierefreie PDF zu Barrieren für Alle werden.
  • Beim Einsatz des Readers in einem barrierefreien Dokument werden dem Sehenden bzw. dem Hersteller am praktischen Beispiel jene Komponenten visuell vermittelt, die für das barrierefreie Lesen im Netz durch Anwender mit einer Sehbehinderung elementar sind.
    Testen Sie den Reader mit folgendem Dokument: Barrierefreies Publizieren

Tipp: Kommentar von Fritz Weisshart (25.06.2013)

2. Prüfen von Webseiten

2.1 Browser-Add-ons für Mozilla Firefox

HeadingsMap

HeadingsMap eignet sich hervorragend, um die Struktur einer Webseite sichtbar zu machen. Das Add-on zeigt die Überschriftenstruktur der aktuell geöffneten Internetseite in einem Extrabereich des Browserfensters an. Auf einen Blick wird deutlich, ob

  • die Webseite überhaupt <h>-Tags zum Auszeichnen von Überschriften verwendet
  • die Struktur der Seite sinnvoll ist; das heißt, es wird nur eine Überschrift <h1> verwendet, darauf folgen <h2>, <h3>, usw.

Mit einem Klick auf die Baumstruktur der Überschriften im Extra-Fenster wird der entsprechende Bereich auf der Webseite markiert.

Geeignet für:
  • einen schnellen Überblick und die Beurteilung der Struktur selbst komplexer Webseiten
  • alle Anwender, da nichts programmiert oder voreingestellt werden muss und außer den HTML-Tags in der Ergebnisanzeige keine Codes erkannt und/oder ausgewertet werden müssen

WAVE-Toolbar

Die Wave-Toolbar wird von Mozilla Firefox in der aktuellen Version des Browsers leider nicht mehr unterstützt. Sie funktioniert nur noch mit älteren Versionen des Browsers. Auch ein Download über die AddOn-Seite von Mozilla ist nicht mehr möglich.

Mit Google Chrome kann die Wave-Toolbar weiterhin verwendet werden.

Das Schweizer Taschenmesser unter den Prüftools. 😉

Die WAVE Toolbar bringt die wichtigen Prüftools für einen sehr guten Überblick über die Zugänglichkeit einer Webseite mit. Die Ergebnisse werden direkt in die geprüfte Seite eingeblendet.

Chrome:
Übersicht / Klemmbrett-Symbol: Zeigt eine Übersicht über alle getesteten Bereiche, die farblich unterschieden werden. Hinter der Bezeichnung findet sich die Anzahl der Fehler.

Fähnchen-Symbol: Zeigt die Fehler im Detail, vergleichbar zu “Error, Features and Alerts” bei der Firefox-Version. Eine Erklärung des Fehlers wird angezeigt, wenn man mit der Maus darauf zeigt.

Info-Symbol: Liefert links eingeblendet eine genaue Erklärung zum aktuell markierten Hinweissymbol in der Webseite.

Textseite-Symbol: Entspricht dem Punkt “Structure/Order” in der Firefox-Version und arbeitet ähnlich wie HeadingsMap, ist aber vielleicht für den ungeschulten Betrachter als Ergebnis weniger eindeutig, wenn es darum geht, Strukturmängel aufzuzeigen.

Zusätzlich lassen sich noch zu Testzwecken das Stylesheet der Webseite in der Ansicht deaktivieren und die Kontraste der verwendeten Farben überprüfen.

 

Firefox:
Errors, Features and Alerts: Alle erkannten Seitenelemente werden dargestellt, fehlende oder falsche Auszeichnungen, zum Beispiel von Suchfeldern, werden rot markiert; eine Erklärung des Fehlers wird angezeigt, wenn man mit der Maus darauf zeigt.
Structure / Order: Arbeitet ähnlich wie HeadingsMap, ist aber vielleicht für den ungeschulten Betrachter als Ergebnis weniger eindeutig, wenn es darum geht, Strukturmängel aufzuzeigen.
Text Only: Bilder werden nicht mehr angezeigt.
Outline: Nur die Überschriften werden angezeigt (dient zur Struktur-Überprüfung)
Disable Styles: Prüft, ob die Seite auch bei deaktivierten Style-Anweisungen noch bedienbar ist.
Reset Page: Setzt einen soeben absolvierten Testschritt wieder zurück und zeigt die Seite normal an.

Soll dem Betreiber einer Website schnell und deutlich ein Mangel an einer Seite dargestellt werden, sind die Ergebnis-Ansichten der WAVE Toolbar hervorragend geeignet, insbesondere Entscheidungsträgern die Problematik zu vermitteln.

Geeignet für:
  • etwas umfassendere Schnelltests, Probleme auf einer Seite werden sofort offensichtlich;
  • Anwender mit HTML-Kenntnissen (notwendig zur Beurteilung der Ergebnisse).

Greasemonkey

Mit Greasemonkey kann man die Anzeige einer Webseite beeinflussen, indem man dem Add-on einen JavaScript Code übergibt (den man selber schreiben  oder aus JavaScript-Bibliotheken kopieren muss) – dieses Script beeinflusst die Anzeige des Browers und kann so zu Testzwecken bestimmte Voraussetzungen des Nutzers einer Webseite simulieren.

Geeignet für:
  • aufwendigere Tests, eher zur Optimierung eigener Seiten
  • Anwender mit Programmierkenntnissen

Juicy Studio Accessibility Toolbar

Juicy Studio Accessibility Toolbar kann gleich mehrere Dinge: Sie prüft auf Auszeichnung mit ARIA Elementen wie Live Areas oder Roles; der Table Inspector hilft bei der Prüfung der Zugänglichkeit von Tabellen; der wohl wichtigste Punkt für einen Schnelltest auf Zugänglichkeit jedoch ist die Prüfung der Farbkontraste nach WCAG oder AERT.
Ein Klick auf „alle Tests“ kombiniert die Verfahren. Das Ergebnis wird in einem neuen Browser-Tab angezeigt und lässt auf einen Blick erkennen, ob alle Seitenbereiche den nötigen Kontrast aufweisen.

Geeignet für:
  • Schnelltests von Webseiten, aber auch zur Optimierung eigener Seiten;
  • alle Anwender; HTML-Kenntnisse sind von Vorteil, um die Ergebnisse zu verstehen, da stets der Quelltext betroffener Seitenbereiche anzeigt wird.

Web Developer

Beim Add-on Web Developer handelt es sich um ein Werkzeug zur Entwicklung von Webseiten. Da sich aber mit Hilfe des Add-ons Teile der Seitenprogrammierung aktivieren oder deaktivieren lassen, kann man es ähnlich wie die WAVE Toolbar auch zum Testen bereits fertiggestellter Webseiten einsetzen.

Geeignet für:
  • aufwendigere Tests (eigener Seiten)
  • Web-Administratoren und -Designer, Anwender mit Programmierkenntnissen

2.2 Browser-Add-ons: Microsoft Internet-Explorer

Web Accessibility Toolbar (WAT for IE)

Die Web Accessibility Toolbar für den Internet Explorer löst die ältere IE Developer Toolbar (nur bis IE 7) ab.
Die Web Accessibility Toolbar bringt wichtige Prüftools für einen Überblick über die Zugänglichkeit einer Webseite mit. Die Ergebnisse werden teils direkt in die geprüfte Seite eingeblendet.

Hier einige der geeigneten Funktionen für Schnelltests:
Check: Hier kann man die angezeigte Seite im W3C Validator auf valides HTML prüfen.
CSS: Das CSS-Stylesheet, das der Seite ihr Erscheinungsbild gibt, deaktivieren – alle Texte müssen danach so noch lesbar sein und die Navigation zugänglich.
Images: Über ‘List Images’ kann man sich alle Bilder auf der Seite samt Grafikinformationen, wie z.B. Alternativtexte, auflisten lassen.
Structure: Überschriftenstruktur der Seite prüfen (Headings blendet die Auszeichnung der Überschriften ein, Heading Structure liefert einen Überblick über die Überschriftenstruktur).
Tables: Überprüfen der Strukturen von Datentabellen.

Geeignet für:
  • umfassendere Schnelltests, Probleme auf einer Seite werden sofort offensichtlich;
  • Anwender mit HTML-Kenntnissen (notwendig zur Beurteilung der Ergebnisse).

2.3 Weitere nützliche Add-ons: Mozilla Firefox

Wappalyzer

Wappalyzer erkennt das System, mit dem der Webserver der betrachteten Seite läuft, sowie eventuell verwendete Anwendungen der Webseite (CMS, Forensoftware etc.).

Geeignet für:
  • umfangreichere Tests; die Ermittlung des eventuell verwendeten Systems hilft beim Suchen bzw. Nachweis von Zugänglichkeitsproblemen, da bestimmte Schwierigkeiten für einige Systeme „typisch“ sind.
  • ACHTUNG: Add-on sammelt Daten über das Surfverhalten, wenn es nicht entsprechend konfiguriert wird.

2.4 Andere Tools (browserunabhängig)

HTML-Validator

Der HTML-Validator des W3C erlaubt einen schnellen Blick auf den HTML-Code der angezeigten Webseite. Fehler werden im Ergebnisfenster gelistet und in der Regel mit einem Vorschlag zur Lösung angezeigt.

Geeignet für:
  • Teilschritte eines umfangreicheren Tests, da oft eine fehlerhafte, nicht Webstandard konforme Programmierung zu Problemen bei der Zugänglichkeit führt;
  • Anwender mit HTML-Kenntnissen

CCA2 (Color Contrast Analyzer)

CCA2 ist ein Werkzeug, das dabei hilft, den Kontrast zwischen Vorder- und Hintergrundfarbe zu analysieren. Zusätzlich kann es verschiedenere Sehbehinderungen und ihre Auswirkungen auf den gerade angezeigten Inhalt simulieren. Die Berechnung des Kontrastverhältnisses basiert auf dem Algorithmus Contrast Ratio Algorithm, der vom W3C vorgeschlagen wird.

Anwendung für:
  • umfangreiche Tests oder auch Schnelltests
  • alle Anwender

Imergo

Imergo Web Compliance Produkte gelten als TIPP für Programmierer, die umfangreichere Webauftritte managen. Im Projekt konnten diese nicht getestet werden.

2.5 Selbst-Tests auf Barrierefreiheit von Webseiten

Seite drucken