Barrierefreiheitsprüfung Materialkompass im vzbv

Barrierefrei bzw. –arm gestaltete Unterrichtsmaterialien erleichtern Teilhabe und ermöglichen Inklusion. Wir möchten mit dem Materialkompass dazu beitragen, die Entwicklung inklusiver Materialien voranzutreiben. Daher werden wir künftig verschiedene Aspekte barrierefreier/-armer Gestaltung von Lehr- und Lernmaterial anhand einer Positivliste im Materialkompass abbilden.

Während ein Teil dieses Prozesses durch die Gutacher:innen übernommen wird, erfolgt die Überprüfung der Barrierefreiheit technischer Details durch die Mitarbeitenden des Materiakompasses. In der Regel sollte dieser Anteil der Prüfung durchgeführt werden, während die Gutachtenmaske im Backend angelegt wird. Im Folgenden werden die dafür nötigen Schritte ausführlich erläutert.

Zur Überprüfung der Barrierefreiheit browser-basierter Medien benötigen Sie sogenannte Bookmarklets. Dabei handelt es sich um kleine Programme, die als Lesezeichen im Browser gespeichert und dann auf jeder Website ausgeführt werden können. Installieren Sie die Bookmarklets, indem Sie den verlinkten Text (blau markiert) in die Lesezeichenleiste Ihres Browsers ziehen. Wechseln Sie nun auf die gewünschte Seite und aktivieren Sie das Bookmarklet, indem Sie das Lesezeichen anklicken.

Überschriften

Dieses Bookmarklet extrahiert die Überschriftenstruktur aus einer Seite und stellt sie anschaulich dar.

Überschriften (zur Installation Link in die Lesezeichen-Leiste Ihres Browsers ziehen)

Alternativtexte von Bildern & Grafiken

Dieses Bookmarklet blendet den Alternativtext aller Bilder auf der aktuellen Seite ein, sodass dieser auf Sinnhaftigkeit geprüft werden kann. Bilder mit technisch gültigem Alternativtext werden grün gekennzeichnet — die Sinnhaftigkeit muss allerdings manuell sichergestellt werden. Dekorative Bilder werden orange hervorgehoben, damit ihr Status geprüft werden kann. Bilder ohne Alternativtext werden rot gekennzeichnet und stellen Fehler dar.

Alternativtexte von Bildern & Grafiken (zur Installation in die Lesezeichen-Leiste Ihres Browsers ziehen)

Wurden maschinenlesbare Überschriften verwendet, um das Material nicht nur optisch, sondern auch für assistive Technologien (Hilfsmittel) sinnvoll zu gliedern?

Browser-basierte Medien

Besuchen Sie die zu prüfenden Seiten mit Ihrem Browser. Sind die Seiten durch visuell erkennbare Überschriften gegliedert? Falls ja, führen Sie das Bookmarklet „Überschriften“ aus. Eine Überschriftenhierarchie wird eingeblendet.

• Sind die sichtbaren Überschriften auch wirklich in der Überschriftenhierarchie enthalten?
• Bonus: Ist die Überschriftenhierarchie fehlerfrei? Es werden also keine Überschriftenebenen übersprungen (rote Markierungen)?

→ Einzige zulässige Ausnahme (trotz roter Markierung): Die erste Überschrift im Dokument darf auch auf der 2. Ebene liegen, wenn es weiter unten eine Überschrift 1. Ordnung gibt.

PDF-Dokumente

Ist das Dokument durch visuell erkennbare Überschriften gegliedert? Falls ja, laden Sie es mit dem kostenfreien PDF Accessibility Checker 2021 (PAC 2021), indem Sie die PDF-Datei ins Anwendungsfenster ziehen. Öffnen Sie anschließend die „Screenreader-Vorschau“ (Schaltfläche unten links). Sie erhalten eine abstrakte Darstellung der Dokumentinhalte (siehe Grafik).

Suchen Sie stichprobenhaft die Textpassagen, die im Dokument optisch als Überschriften wahrgenommen werden. Sind diese in der Screenreader-Vorschau als Überschriften gekennzeichnet, also mit H1 - H6 (rot in der Vorschau)?

→ Außerdem: Wenn Sie das Dokument in Adobe Acrobat öffnen und es eine adäquate, maschinenlesbare Struktur beinhaltet, blendet das Programm diese Gliederung in der linken Bildschirmspalte unter „Lesezeichen“ (ggf. „Bookmarks“) ab.

Können alle wichtigen Funktionen mit der Tastatur erreicht und bedient werden?

Browser-basierte Medien

Besuchen Sie die zu prüfenden Seiten mit ihrem Browser und drücken Sie mehrfach hintereinander die TAB-Taste.

• Sie sollten dabei deutlich sehen können, dass bestimmte Elemente fokussiert werden.
• Es sollten alle interaktiven Elemente — also Links, Schalter und Formularelemente — den Fokus erhalten. Die Reihenfolge sollte sinnvoll sein und nicht wild umherspringen.
• Stellen Sie sicher, dass insbesondere die Navigation und andere wichtige Funktionen fokussiert werden können.
• Prüfen Sie stichprobenhaft durch Aktivieren der Eingabetaste, ob fokussierte Links (zum Beispiel in der Navigation) verfolgt und Schalter (zum Beispiel zum Einblenden der Navigation) aktiviert werden können.

PDF-Dokumente

Öffnen Sie das Dokument im Adobe Acrobat und drücken Sie mehrfach hintereinander die TAB-Taste.

• Wenn das Dokument Links zu Internet- oder E-Mail-Adressen enthält, sollten die Links in einer sinnvollen Reihenfolge nacheinander fokussiert werden.
• Prüfen Sie stichprobenhaft durch Aktivieren der Eingabetaste, ob fokussierte Links verfolgt werden können.

Bilder und Grafiken, die wichtige Informationen vermitteln oder mit Funktionen belegt sind (zum Beispiel als verlinkte Bilder), benötigen einen maschinenlesbaren Alternativtext, der den Bildinhalt beschreibt.
Alle anderen Bilder sollten vor assistiven Technologien (Hilfsmittel) verborgen werden.

Browser-basierte Medien

Nutzen Sie das Bookmarklet „Alternativtexte von Bildern & Grafiken“ auf Seiten mit Bildern und prüfen Sie, ob:

• informationstragende Bilder einen aussagekräftigen Alternativtext haben,
• dekorative Bilder als solche gekennzeichnet sind,
• keine fehlerhaften Bilder ohne Textalternative vorhanden sind.

PDF-Dokumente

Öffnen Sie das Medium im Adobe Acrobat, fahren Sie mit der Maus über einzelne Bilder und warten Sie, ob ein Alternativtext in einer Einblendung dargestellt wird.

• Haben informationstragende Bilder und Grafiken einen aussagekräftigen Alternativtext?
• Zeigen dekorative Bilder und Grafiken keine Einblendung?

Eignet sich das Material zur Nutzung in verschiedenen Darstellungsgrößen und auf unterschiedlichen Geräten?

Digitale Medien

Öffnen Sie stichprobenhaft Seiten des Materials auf unterschiedlich ausgelegten Geräten, zum Beispiel auf einem Desktop-Computer, einem Tablet und / oder einem Smartphone. Verändern Sie auf dem Desktop-Computer die Fenstergröße und betrachten Sie unterschiedliche Darstellungsgrößen.

• Passt sich die Darstellung an die unterschiedlichen Fenstergrößen an?
• Bleibt das Material in allen Situationen gut les- und bedienbar?

PDF-Dokumente

Wechseln Sie in Adobe Acrobat in den „Umfließen“-Modus, indem Sie die Menüoption „Ansicht › Zoom › Umfließen“ aktivieren (soweit die Option zur Verfügung steht). Es ändert sich dadurch womöglich die Darstellung mancher Seiten.

• Sind alle wichtige Elemente weiterhin zu erkennen und die Texte lesbar?
• Wird das Layout weiterhin sinnvoll dargestellt?
• Bleibt die Reihenfolge der Inhalte erhalten?