SuperX barrierefrei

Wie barrierefrei ist SuperX?

Geltende Vorschriften

Die Verpflichtung zur Barrierefreiheit von Websites gilt derzeit (noch) nur für Bundesbehörden. Sie geht hervor aus der

• Barrierefreie Informationstechnik-Verordnung (BITV),
  • mit Neuauflage von 2019,
  • mit Testverfahren aus 92 Einzeltests. Angelehnt ist die BITV an die
• Web Content Accessibility Guidelines (WCAG 2.0),
  • herausgegeben von der Web-Standardisierungsorganisation W3C bzw.
  • deren Arbeitsgruppe Web Accessability Initiative (WAI).

Barrierefreiheit

Die Barrierefreiheit soll Menschen mit unterschiedlichen Einschränkungen die Nutzung von Software bzw. Websites ermöglichen. Die Barrierefreiheit umfasst lt. WCAG 2.0 Anforderungen an:

• Wahrnehmbarkeit
• Bedienbarkeit
• Verständlichkeit
• Robustheit

Die Einstufung des Grades von Barrierefreiheit erfolgt über die Level A, AA, AAA (höchste Stufe).

Grad der Barrierefreiheit von SuperX

1. Vorgaben zur WAHRNEHMBARKEIT
1.1. Textalternativen für audiovisuelle Inhalte	SuperX to do; 05.2024	Tools/Hilfen
Bilder mit Alternativtexten versehen	prüfen/ergänzen: -Attribut für jedes <img /> falls kein Alternativtext existiert (für Bild mit reinem Dekozweck): <img_src="..." alt=""> </img_src="..."> Sonderfall: inline svg	"web Developer" (Bowsererweitertung)
Videos mit Untertiteln versehen	prüfen/ergänzen: sh. Beispiel in c't 2022, Heft 14, S. 137	"HappyScribe" (zur autom. Untertitelerzeugung)
1.2 Textgröße
Text mit mind. 10-12px anbieten	prüfen/umsetzen
Ordentliches Layout (Wort-, Zeilenabstände) sicherstellen, auch bei: Textverdoppelung Responsivität: von Viewport 1280 * 1024px (mit 400%igem Zoom) zu Viewport 320 * 265px (ca 50 Zeichen Text/Zeile)	prüfen/umsetzen
1.3 Kontraste
Kontrastverhältnis sichern; lt WCAG 2.0: für Fließtext: 4,5 : 1 für Überschriften: 3:1 Problemfall: Text über Bildern	prüfen/umsetzen	"WAVE" (Browsererweiterung) Color Contrast Analyzer Color Contrast Checker (zum Messen von Farbwerten)
1.4 ARIA-Attribute (*)
(*) Accessible Rich Internet Applications ARIA-Attribute für Screenreader einsetzen	prüfen/ergänzen
2. Vorgaben zur BEDIENBARKEIT
Bedienbarkeit per Tastatur ermöglichen durch: Jump-, Skiplinks als Sprungmarken am Dokumentbeginn definieren	prüfen/umsetzen sh. Beispiel in c't 2022, Heft 15, S. 165
Spezielle Reihenfolge anzuspringender Elemente zulassen/unterbinden: HTML-Attribut tabindex setzen	prüfen/umsetzen
Darstellung von Maus- sowie Tastaturinteraktionen: css-Pseudoklassen "hover" (für Mausinteraktionen) und "focus" (für Tataturbedienung) nutzen.	prüfen/umsetzen
Ggf. css-outline als Orientierungshilfe nutzen.	prüfen/umsetzen
Ggf. focus traps (via java script-Bibliothek) verwenden, um den Tastaturfokus innerhalb einer Elementgruppe festzuhalten; relevant z.B. für modale Dialoge Einverständniserklärungen wobei einander überlagernde Dialogfenster geöffnet sind, aber keine Interaktion mit dem überlagerten Element möglich sein soll.	prüfen/umsetzen sh. Beispiel in c't 2022, Heft 15, S. 165
Tablisten-Handling (via java script), so dass der im Fokus befindliche Karteireiter korrekt arbeitet inkl. Anpassung des ARIA-Attributes aria-selected.	prüfen/umsetzen sh. Erläuterung in c't 2022, Heft 15, S. 165	Github-Repository vonW3C für copy-paste-taugliche Beispiele (sh. ct.de/yxcd)
Barrierefreiheit störende divS und spanS in Formularen möglichst vermeiden.	prüfen/umsetzen
Jeden größeren Inhaltsblock ("landmark") mit Überschrift und/oder aria-label bzw. aria-labelledeby versehen.
3. Vorgaben zur VERSTÄNDLICHKEIT
4. Vorgaben zur ROBUSTHEIT