Zuletzt bearbeitet vor einem Tag
von Bettina Floss

SuperX barrierefrei: Unterschied zwischen den Versionen

Keine Bearbeitungszusammenfassung
Markierung: 2017-Quelltext-Bearbeitung
Keine Bearbeitungszusammenfassung
Markierung: 2017-Quelltext-Bearbeitung
Zeile 28: Zeile 28:
(''menuhtml.xsl und submenu_html.xsl)''
(''menuhtml.xsl und submenu_html.xsl)''
</th><th style="background-color:#eeeeec;" class="">'''Abfragen-Seite'''(nach Themenewahl)</th><th style="background-color:#eeeeec;" class="">'''Masken-Dialog'''''(maske_html.xsl)''</th><th style="background-color:#eeeeec;" class="">'''Tabellen-Dialog'''''(tabelle_html.xsl)''</th></tr><tr><th style="vertical-align:middle;text-align:left;background-color:#eeeeec;width:0px;" class="">'''<span style="color: #204a87">Seitennavigation und Sprache</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Tastaturbedienbarkeit, Fokusreihenfolge</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class=""><span style="color: #204a87">'''Interaktive Controls/Beschriftungen: Labelkennzeichnung, Name, Rolle, Wert'''</span></td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Pflichtfeldkennzeichnung</span>''' </td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Textwiederholung (repetitive content)</span>''' </th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg">ok</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Autocomplete</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Struktur und Semantik</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;"><strong><span style="color: #204a87">Usability</span></strong></td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Fehlermeldung</span>'''  
</th><th style="background-color:#eeeeec;" class="">'''Abfragen-Seite'''(nach Themenewahl)</th><th style="background-color:#eeeeec;" class="">'''Masken-Dialog'''''(maske_html.xsl)''</th><th style="background-color:#eeeeec;" class="">'''Tabellen-Dialog'''''(tabelle_html.xsl)''</th></tr><tr><th style="vertical-align:middle;text-align:left;background-color:#eeeeec;width:0px;" class="">'''<span style="color: #204a87">Seitennavigation und Sprache</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Tastaturbedienbarkeit, Fokusreihenfolge</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class=""><span style="color: #204a87">'''Interaktive Controls/Beschriftungen: Labelkennzeichnung, Name, Rolle, Wert'''</span></td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Pflichtfeldkennzeichnung</span>''' </td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Textwiederholung (repetitive content)</span>''' </th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg"> ok</th><th style="" class="col-white-bg">ok</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Autocomplete</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th></tr><tr><th style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;">'''<span style="color: #204a87">Struktur und Semantik</span>'''</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="" data-mce-style="text-align: left;"><strong><span style="color: #204a87">Usability</span></strong></td><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">ok</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">ok</th></tr><tr><td style="background-color:#eeeeec;vertical-align:middle;text-align:left;width:0px;" class="">'''<span style="color: #204a87">Fehlermeldung</span>'''  
</td><th style="" class="col-white-bg">vorbereitet</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">'''Klärungsbedarf'''</th><th style="" class="col-white-bg">--</th></tr></table>
</td><th style="" class="col-white-bg">vorbereitet</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">--</th><th style="" class="col-white-bg">vorbereitet</th><th style="" class="col-white-bg">--</th></tr></table>


===Barrierefreiheit-Detailvorgaben mit Realisierungsgrad in SuperX, Stand 02.2026===
<!--===Barrierefreiheit-Detailvorgaben mit Realisierungsgrad in SuperX, Stand 02.2026===
<table class="wikitable"><tr><th style="text-align:left;" data-mce-style="text-align: left;">'''<span class="col-blue-navy">1. Vorgaben zur WAHRNEHMBARKEIT = Level 1</span>'''</th><th>'''<span class="col-blue-navy">Realisierungsgrad</span>'''</th><th>'''<span class="col-blue-navy">Tools/Hilfen</span>'''</th></tr><tr><th style="text-align:left;" data-mce-style="text-align: left;">'''1.1. Textalternativen für audiovisuelle Inhalte'''</th><th></th><th></th></tr><tr><td style="text-align:left;" data-mce-style="text-align: left;">Bilder mit '''Alternativtexte'''n versehen:
<table class="wikitable"><tr><th style="text-align:left;" data-mce-style="text-align: left;">'''<span class="col-blue-navy">1. Vorgaben zur WAHRNEHMBARKEIT = Level 1</span>'''</th><th>'''<span class="col-blue-navy">Realisierungsgrad</span>'''</th><th>'''<span class="col-blue-navy">Tools/Hilfen</span>'''</th></tr><tr><th style="text-align:left;" data-mce-style="text-align: left;">'''1.1. Textalternativen für audiovisuelle Inhalte'''</th><th></th><th></th></tr><tr><td style="text-align:left;" data-mce-style="text-align: left;">Bilder mit '''Alternativtexte'''n versehen:


Zeile 73: Zeile 73:


===Literatur===
===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, 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
* Herbert Braun, Web ohne Hürden, Websites barrierearm gestalten, 2. Teil c't 15/2022, S164 ff -->

Version vom 16. März 2026, 09:06 Uhr

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 02.2026

Testergebnisse nach WCAG 2.2 gem. ARC-Toolkit (V. 5.7.10) Login-DialogPortlet-Seite(nach Login)

(index.jsp)

Menü-Seite

(nach Klick auf Standardberichte) (menuhtml.xsl und submenu_html.xsl)

Abfragen-Seite(nach Themenewahl)Masken-Dialog(maske_html.xsl)Tabellen-Dialog(tabelle_html.xsl)
Seitennavigation und Spracheok----ok--ok
Tastaturbedienbarkeit, Fokusreihenfolgeokokokokokok
Interaktive Controls/Beschriftungen: Labelkennzeichnung, Name, Rolle, Wertokokokokokok
Pflichtfeldkennzeichnung ok------ok--
Textwiederholung (repetitive content) ok ok ok ok okok
Autocompleteok----------
Struktur und Semantikokokokokokok
Usabilityokokokok--ok
Fehlermeldung vorbereitet------vorbereitet--