Version vom 17. März 2026, 11:48 Uhr von Bettina Floss (Diskussion | Beiträge)
Wie barrierefrei ist SuperX?
Barrierefreiheit - Geltende Vorschriften
Die Verpflichtung zur Barrierefreiheit von Websites geht hervor aus:
- Barrierefreie Informationstechnik-Verordnung (BITV),
- mit Neuauflage von 2019,
- mit Testverfahren aus 92 Einzeltests. Angelehnt ist die BITV an die
- Web Content Accessibility Guidelines (aktuell WCAG 2.2) ,
- herausgegeben von der Web-Standardisierungsorganisation W3C bzw.
- deren Arbeitsgruppe Web Accessability Initiative (WAI)
- Barrierefreiheitsstärkungsgesetz (BFSG) = Gesetz zur Umsetzung der VO 2029/882 (European Accessibility Act, EAA) des EU-Parlaments u. des Rats für Barrierefreiheitsanaforderungen für Produkte und Dienstleistungen,
- es verlangt: ab 28.06.2025 müssen online angebotene Produkte barrierefrei sein.
Die Barrierefreiheit soll Menschen mit unterschiedlichen Einschränkungen die Nutzung von Software bzw. Websites ermöglichen. Die Barrierefreiheit umfasst lt. WCAG Anforderungen an:
- Wahrnehmbarkeit
- Bedienbarkeit
- Verständlichkeit
- Robustheit
Die Einstufung des Grades von Barrierefreiheit erfolgt über die Level A, AA, AAA (höchste Stufe). Testangebote siehe: https://bitvtest.de/tests-und-beratung/bik-bitv-test-web
Barrierefreiheit mit Realisierungsgrad in SuperX-Dialogen, Stand 03.2026
| Testergebnisse nach WCAG 2.2 gem. ARC-Toolkit (V. 5.7.10) | Login-Seite | Portlet-Seite(nach Login)
(index.jsp) | Menü-Seite
(nach Klick auf Standardberichte) (menuhtml.xsl und submenu_html.xsl) | Abfragen-Seite(nach Themenwahl) | Masken-Seite(maske_html.xsl) | Tabellen-Seite(tabelle_html.xsl) |
|---|---|---|---|---|---|---|
| Seitennavigation und Sprache | ok | -- | -- | ok | -- | ok |
| Tastaturbedienbarkeit, Fokusreihenfolge | ok | ok | ok | ok | ok | ok |
| Interaktive Controls/Beschriftungen: Labelkennzeichnung, Name, Rolle, Wert | ok | ok | ok | ok | ok | ok |
| Pflichtfeldkennzeichnung | ok | -- | -- | -- | ok | -- |
| Textwiederholung (repetitive content) | ok | ok | ok | ok | ok | ok |
| Autocomplete | ok | -- | -- | -- | -- | -- |
| Struktur und Semantik | ok | ok | ok | ok | ok | ok |
| Usability | ok | ok | ok | ok | -- | ok |
| Fehlermeldung | vorbereitet | -- | -- | -- | vorbereitet | -- |
Login-Seite mit Testergebnissen
Login-Seite
ARC-Testergebnis für Login-Seite
Portlet-Seite mit Testergebnissen
- Portlet.jpg
Portlet-Seite
- ARC4Portlet.jpg
ARC-Testergebnis für Portlet-Seite
Menü-Seite mit Testergebnissen
Menü-Seite
ARC-Testergebnis für Menü-Seite
Abfragen-Seite mit Testergebnissen
Abfragen-Seite
ARC-Testergebnis für Abfragen-Seite
Masken-Seite mit Testergebnissen
- Masken.jpg
Masken-Seite
- ARC4Masken.jpg
ARC-Testergebnis für Masken-Seite
Tabellen-Seite mit Testergebnissen
Tabellen-Seite
ARC-Testergebnis für Tabellen-Seite
Barrierefreiheit-Detailvorgaben
| 1. Vorgaben zur WAHRNEHMBARKEIT = Level 1 | Tools/Hilfen |
|---|---|
| 1.1. Textalternativen für audiovisuelle Inhalte | |
Bilder mit Alternativtexten versehen:
| |
| Videos mit Untertiteln versehen:
sh. Beispiel in c't 2022, Heft 14, S. 137 | |
| 1.2 Textgröße | |
| Text mit mind. 10-12px anbieten. | |
Ordentliches Layout (Wort-, Zeilenabstände) sicherstellen, auch bei:
|
|
| 1.3 Kontraste | |
Kontrastverhältnis sichern; lt WCAG 2.0:
| |
| 1.4 ARIA-Attribute (*) | |
| (*) Accessible Rich Internet Applications
ARIA-Attribute für Screenreader einsetzen | |
| 2. Vorgaben zur BEDIENBARKEIT = Level 2 | |
Bedienbarkeit per Tastatur ermöglichen dazu:
| |
| Tablisten-Handling (via java script), so dass der im Fokus befindliche Karteireiter korrekt arbeitet inkl. Anpassung des ARIA-Attributes aria-selected. (sh. Erläuterung in c't 2022, Heft 15, S. 165) | Github-Repository vonW3C für copy-paste-taugliche Beispiele (sh. ct.de/yxcd) |
| Die Barrierefreiheit störende divS und spanS in Formularen möglichst vermeiden. | |
| Downloadlinks ergänzen um Format der verknüpften Dokumente, z.B.: "PDF, 6,8 Megabyte, nicht barrierefrei" | |
Jeden größeren Inhaltsblock ("landmark") mit:
| |
| Suchfunktionen integrieren in komplexe Websites, | |
| Modenen Spamschutz wie "reCaptcha v 3" von Google verwenden, der im Gegensatz zu herkömmlichen captchas ohne Benutzerinteraktion funktioniert. | sh. ct.de/yxcd |
| Zeitdruck zum und Datenverlust beim Beenden einer Session vermeiden. | |
| 3. Vorgaben zur VERSTÄNDLICHKEIT = Level 3 | |
Sprache angeben zum besseren Artikulieren durch Screeenreader:
| |
Textalternativen integrieren:
| |
Eingabefelder beschriften:
| |
Formularabschnitte beschriften:
| |
Clientseitige Validierung der Eingaben vor dem Absenden:
| |
| 4. Vorgaben zur ROBUSTHEIT > Level 4 | |
| Für sauberes HTML sorgen. | Nu Validator - https:/validator.nu:
|
Literatur
- Herbert Braun, Web ohne Hürden, Websites barrierearm gestalten, 1. Teil c't 14/2022, S136 ff
- Herbert Braun, Web ohne Hürden, Websites barrierearm gestalten, 2. Teil c't 15/2022, S164 ff
