BIK BITV-Test (Web): Dialog Nachhaltigkeit gemäß BITV 2.0 / EN 301 549

S1
S2
S3
S4
S5

Projektdaten

URL
https://www.dialog-nachhaltigkeit.de/
Prüfzeitraum
08.04.2024 - 17.04.2024
Datum Prüfbericht
17.04.2024
Prüfstelle
Marcus Hermann
Prüfer*in
Marcus Herrmann
Art des Tests
Zur Veröffentlichung geeignet
Ergebnis
0 von 5 der ausgewählten Seiten einer unabhängigen, repräsentativen Seitenauswahl wurden als BITV- / EN 301 549-konform bewertet.
  • 5 Seiten nicht konform

Ergebnisse im Überblick

5 Allgemeine Anforderungen 1 2 3 4 5
5.2 Aktivierung von Barrierefreiheitsfunktionen
5.3 Biometrie
5.4 Erhaltung von Barrierefreiheitsinformationen bei Konvertierung
6 Zwei-Wege-Sprachkommunikation 1 2 3 4 5
6.1 Audiobandbreite für Sprache
6.2.1.1 Textkommunikation in Echtzeit
6.2.1.2 Gleichzeitige Sprache und Text
6.2.2.1 Visuell unterscheidbare Anzeige von Textnachrichten
6.2.2.2 Programmatisch unterscheidbare Anzeige von Textnachrichten
6.2.2.3 Sprecheridentifizierung
6.2.2.4 Echtzeitanzeige von Sprech-Aktivität
6.2.3 Interoperabilität von Echtzeit-Textkommunikation
6.2.4 Reaktionsgeschwindigkeit der Echtzeit-Textkommunikation
6.3 Anrufer-Identifizierung
6.4 Alternativen zu sprachbasierten Diensten
6.5.2 Auflösung bei Videotelefonie
6.5.3 Bildwiederholfrequenz bei Videotelefonie
6.5.4 Synchronität bei Videotelefonie
6.5.5 Visuelle Anzeige von Audio-Aktivität
6.5.6 Sprecher-Anzeige für Gebärdensprachen-Kommunikation
7 Videofähigkeiten 1 2 3 4 5
7.1.1 Wiedergabe von Untertiteln
7.1.2 Synchrone Untertitel
7.1.3 Erhaltung von Untertiteln
7.1.4 Untertitel-Anpassungen
7.1.5 Gesprochene Untertitel
7.2.1 Wiedergabe von Audiodeskription
7.2.2 Synchrone Audiodeskription
7.2.3 Erhaltung von Audiodeskription
7.3 Bedienelemente für Untertitel und Audiodeskription
9.1.1 Textalternativen 1 2 3 4 5
9.1.1.1a Alternativtexte für Bedienelemente
9.1.1.1b Alternativtexte für Grafiken und Objekte
9.1.1.1c Leere alt-Attribute für Layoutgrafiken
9.1.1.1d Alternativen für CAPTCHAs
9.1.2 Zeitbasierte Medien 1 2 3 4 5
9.1.2.1 Alternativen für Audiodateien und stumme Videos
9.1.2.2 Aufgezeichnete Videos mit Untertiteln
9.1.2.3 Audiodeskription oder Volltext-Alternative für Videos
9.1.2.4 Videos (live) mit Untertiteln
9.1.2.5 Audiodeskription für Videos
9.1.3 Anpassbar 1 2 3 4 5
9.1.3.1a HTML-Strukturelemente für Überschriften
9.1.3.1b HTML-Strukturelemente für Listen
9.1.3.1c HTML-Strukturelemente für Zitate
9.1.3.1d Inhalt gegliedert
9.1.3.1e Datentabellen richtig aufgebaut
9.1.3.1f Zuordnung von Tabellenzellen
9.1.3.1g Kein Strukturmarkup für Layouttabellen
9.1.3.1h Beschriftung von Formularelementen programmatisch ermittelbar
9.1.3.2 Sinnvolle Reihenfolge
9.1.3.3 Ohne Bezug auf sensorische Merkmale nutzbar
9.1.3.4 Keine Beschränkung der Bildschirmausrichtung
9.1.3.5 Eingabefelder zu Nutzerdaten vermitteln den Zweck
9.1.4 Unterscheidbar 1 2 3 4 5
9.1.4.1 Ohne Farben nutzbar
9.1.4.2 Ton abschaltbar
9.1.4.3 Kontraste von Texten ausreichend
9.1.4.4 Text auf 200 % vergrößerbar
9.1.4.5 Verzicht auf Schriftgrafiken
9.1.4.10 Inhalte brechen um
9.1.4.11 Kontraste von Grafiken und grafischen Bedienelementen ausreichend
9.1.4.12 Textabstände anpassbar
9.1.4.13 Eingeblendete Inhalte bedienbar
9.2.1 Per Tastatur zugänglich 1 2 3 4 5
9.2.1.1 Ohne Maus nutzbar
9.2.1.2 Keine Tastaturfalle
9.2.1.4 Tastatur-Kurzbefehle abschaltbar oder anpassbar
9.2.2 Ausreichend Zeit 1 2 3 4 5
9.2.2.1 Zeitbegrenzungen anpassbar
9.2.2.2 Bewegte Inhalte abschaltbar
9.2.3 Anfälle 1 2 3 4 5
9.2.3.1 Verzicht auf Flackern
9.2.4 Navigierbar 1 2 3 4 5
9.2.4.1 Bereiche überspringbar
9.2.4.2 Sinnvolle Dokumenttitel
9.2.4.3 Schlüssige Reihenfolge bei der Tastaturbedienung
9.2.4.4 Aussagekräftige Linktexte
9.2.4.5 Alternative Zugangswege
9.2.4.6 Aussagekräftige Überschriften und Beschriftungen
9.2.4.7 Aktuelle Position des Fokus deutlich
9.2.5 Eingabemodalitäten 1 2 3 4 5
9.2.5.1 Alternativen für komplexe Zeiger-Gesten
9.2.5.2 Zeigergesten-Eingaben können abgebrochen oder widerrufen werden
9.2.5.3 Sichtbare Beschriftung Teil des zugänglichen Namens
9.2.5.4 Alternativen für Bewegungsaktivierung
9.3.1 Lesbar 1 2 3 4 5
9.3.1.1 Hauptsprache angegeben
9.3.1.2 Anderssprachige Wörter und Abschnitte ausgezeichnet
9.3.2 Vorhersehbar 1 2 3 4 5
9.3.2.1 Keine unerwartete Kontextänderung bei Fokus
9.3.2.2 Keine unerwartete Kontextänderung bei Eingabe
9.3.2.3 Konsistente Navigation
9.3.2.4 Konsistente Bezeichnung
9.3.3 Hilfestellung bei der Eingabe 1 2 3 4 5
9.3.3.1 Fehlererkennung
9.3.3.2 Beschriftungen von Formularelementen vorhanden
9.3.3.3 Hilfe bei Fehlern
9.3.3.4 Fehlervermeidung wird unterstützt
9.4.1 Kompatibel 1 2 3 4 5
9.4.1.1 Korrekte Syntax
9.4.1.2 Name, Rolle, Wert verfügbar
9.4.1.3 Statusmeldungen programmatisch verfügbar
11.7 Benutzerdefinierte Einstellungen 1 2 3 4 5
11.7 Benutzerdefinierte Einstellungen
11.8 Autorenwerkzeuge 1 2 3 4 5
11.8.2 Barrierefreie Erstellung von Inhalten
11.8.3 Erhaltung von Barrierefreiheitsinformationen bei Transformation
11.8.4 Reparaturassistenz
11.8.5 Vorlagen
12 Dokumentation und Support 1 2 3 4 5
12.1.1 Dokumentation von Kompatibilität und Barrierefreiheit
12.1.2 Barrierefreie Dokumentation
12.2.2 Technischer Support
12.2.3 Effektive Kommunikation
12.2.4 Vom Support bereitgestellte Dokumentation

Ergebnisse nach Prüfschritten

Filter
      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 1 Seite konform
      • 4 Seiten nicht konform
      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1a/1.1

          DIe Pfeilgrafik neben "Link zur barrierefreien Beteiligung per E-Mail" sollte per aria-hidden="true" versteckt werden.

        2. 9.1.1.1a/1.2

          Das Bundesregierungs-Logo im Seitenkopf hat einen entsprechenden zugänglichen Namen, allerdings beschreibt dieser nicht den Linkzweck (man vermutet ein Link zu bundesregierung.de), denn der Link führt eigentlich auf die Startseite des "Dialog Nachhaltigkeit"-Projekts.

          Eine nötige Nennung des Linkziels kann z. B. auch per title-Attribut des umgebenden a-Elements erfolgen.

        3. 9.1.1.1a/1.3

          Das Nachhaltigkeitsstrategie-Logo linkt nicht etwa auf die Startseite, wie man es vermutet (und es irritierenderweise das "Bundesregierung"-Logo tut), sondern auf eine Seite Nachhaltigkeitsstrategie im Webauftritt (die wie viele Unterseiten zum Zeitpunkt des Tests noch nicht existiert).

          Eine nötige Nennung des Linkziels kann z. B. auch per title-Attribut des umgebenden a-Elements erfolgen.

        4. 9.1.1.1a/1.4

          Anmerkung ohne Bewertung: Zu der Sinnhaftigkeit der Alternativtexte der Logos im Seitenkopf siehe 9.2.4.4, Seite 1.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1a/3.1

          Die Pfeil-nach-unten-Grafik im Auslöser des Ausklappbereichs sollten je per aria-hidden="true" versteckt werden.

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1a/4.1

          Die Formatierungsbuttons des Editors besitzen keine programmatisch ermittelbaren Namen, da die in ihnen befindlichen SVGs keinen Alternativtext besitzen. Zur Behebung wird dieser Artikel/Ansatz empfohlen: https://barrierefrei.link/svg-inline-alt (englisch).

        2. 9.1.1.1a/4.2

          Die Absendegrafik in derSchaltfläche "Beitrag senden" sollte per aria-hidden="true" versteckt werden.

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1a/5.1

          Der Alternativtext des Piktogramm sollte mit aria-hidden="true" als dekoratives SVG markiert werden.

          Damit der Button indirekt dennoch einen zugänglichen Namen bekommt (und die interaktive Grafik einen Alternativtext), sollte das title-Attribut auf dem Button, nicht auf das umgebende <div> angewendet werden (denn letzterer Ansatz funktioniert nicht verlässlich, noch dazu hat der Button aktuell keine zugängliche Beschriftung).

          Das Gleiche gilt auch für das Schließen-Piktogramm im "Beitrag melden"-Dialog-X.

      • 1 Seite konform
      • 3 Seiten nicht konform
      • 1 Seite nicht anwendbar
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1b/3.1

          Das Logo links oben im Seitenkopf sollte einen Alternativtext "Logo Nachhaltigkeitsstrategie für Deutschland" haben, statt wie bisher "Beteiligungsplattform".

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1b/4.1

          Das Logo links oben im Seitenkopf sollte einen Alternativtext "Logo Nachhaltigkeitsstrategie für Deutschland" haben, statt wie bisher "Beteiligungsplattform".

      • Beteiligungsplattform
        nicht konform
        1. 9.1.1.1b/5.1

          Das Logo links oben im Seitenkopf sollte einen Alternativtext "Logo Nachhaltigkeitsstrategie für Deutschland" haben, statt wie bisher "Beteiligungsplattform".

      • 1 Seite nicht konform
      • 4 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 4 Seiten konform
      • 1 Seite nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.1a/4.1

          "Dieser Beitrag betrifft die folgenden Themen (max. drei auswählbar)" hat den Charakter einer Überschrift für die dann folgenden Checkboxes und sollte eine <legend> für ein die Gesamtheit aller Checkboxes umfassendes <fieldset> sein.

      • Beteiligungsplattform
        konform
        1. 9.1.3.1a/5.1

          Anmerkung ohne Bewertung: Dialog "Beitrag melden" - hier ist es denkbar, die Checkboxes z. B. mit role="group" aria-label="Gründe für die Meldung" zusammenzufassen.

      • 2 Seiten konform
      • 1 Seite nicht konform
      • 2 Seiten nicht anwendbar
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.1b/2.1

          Die Auflistung der Passwortanforderungen ist nur visuell in Listenform (Absatz mit Zeilenumbrüchen und "-" als Pseudo-Aufzählungszeichen). Sie muss als <ul> umgesetzt werden.

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform
        1. 9.1.3.1b/5.1

          Anmerkung ohne Bewertung: Den Beiträgen vergebene Kategorien sollten semantisch in Listenform vorliegen.

      • 1 Seite nicht konform
      • 4 Seiten nicht anwendbar
      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.1c/1.1

          Das als Zitat formatierte und sogar als solches benannte Statement von Sarah Ryglewski muss als <blockquote> umgesetzt werden. Ein <cite>-Einsatz allein, wie aktuell bei der Zitatgeberin vorfindbar, reicht nicht.

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 3 Seiten konform
      • 2 Seiten nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.1h/4.1

          Checkboxes haben keinen zugänglichen Namen. Quelle kann der nebenstehendem Text sein, wenn dieser eine individuelle ID bekommt, und diese "aus der Checkbox hinaus" per aria-labelledby referenziert wird. Einfacher wäre es allerdings, mit einem input[type="checkbox"] und einem assoziierten label-Element zu arbeiten. Dies hätte dann auch den Vorteil, dass ein Klick auf das jeweilige Label die Checkbox anhakt, ein Nutzungsmuster, was sehr etabliert ist und ggf. von Nutzenden so erwartet wird.

          Falls der ARIA-Ansatz wegen der Checkbox-Gestaltungsmöglichkeiten verfolgt wird, sei dieser Artikel empfohlen, in dem es um eine barrierefreie Gestaltung von nativen Elementen geht: https://barrierefrei.link/input-style-en (englisch).

        2. 9.1.3.1h/4.2

          Der Rich-Text-Editor "beschriftet sich" mit aria-labelledby selbst, hat demzufolge einen leeren Namen, wenn noch nichts in den Editor eingegeben wurde, und einen unsinnigen, sobald Text in ihm existiert.

          Daneben gibt es zwei weiteren Beschriftungsversuche durch je ein <label>-Element mit dem aktuellen Username und eines mit dem Namen des aktuell eingeloggten Nutzenden – aria-describedby "gewinnt" aber in beiden Fällen die Berechnung des zugänglichen Namens.

          Viel sinniger als programmatische Beschriftung wäre die darüber befindliche Überschrift "Beitrag verfassen".

      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.1h/5.1

          Checkboxes haben keinen zugänglichen Namen. Quelle kann der nebenstehendem Text sein, wenn dieser eine individuelle ID bekommt, und diese "aus der Checkbox hinaus" per aria-labelledby referenziert wird. Einfacher wäre es allerdings, mit einem input[type="checkbox"] und einem assoziierten label-Element zu arbeiten. Dies hätte dann auch den Vorteil, dass ein Klick auf das jeweilige Label die Checkbox anhakt, ein Nutzungsmuster, was sehr etabliert ist und ggf. von Nutzenden so erwartet wird.

          Falls der ARIA-Ansatz wegen der Checkbox-Gestaltungsmöglichkeiten verfolgt wird, sei dieser Artikel empfohlen, in dem es um eine barrierefreie Gestaltung von nativen Elementen geht: https://barrierefrei.link/input-style-en (englisch).

      • 5 Seiten konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform
        1. 9.1.3.2/2.1

          Anmerkung mit geringer Bewertung: Die Passwortvorgaben sollten sinnigerweise (mindestens im Dokument) vor dem absenden Formular stehen; ansonsten besteht die Gefahr, dass man das Formular absendet und danach erst die Pflichtanweisungen entdeckt.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • 5 Seiten konform
      • 5 Seiten konform
      • 2 Seiten nicht konform
      • 3 Seiten nicht anwendbar
      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.5/1.1

          In dem Registrierungs- bzw. Passwort-Änderungs-Formular werden Daten von Nutzenden abgefragt. Allerdings fehlen entsprechende autocomplete-Werte: https://www.w3.org/TR/WCAG21/#input-purposes

      • Beteiligungsplattform
        nicht konform
        1. 9.1.3.5/2.1

          In dem Registrierungs- bzw. Passwort-Änderungs-Formular werden Daten von Nutzenden abgefragt. Allerdings fehlen entsprechende autocomplete-Werte: https://www.w3.org/TR/WCAG21/#input-purposes

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 1 Seite konform
      • 4 Seiten nicht konform
      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.3/1.1

          Auf dem orangefarbenen Link in Schaltflächenoptik wird knapp der Mindestkontrast für fett formatierten Text in dieser Schriftgröße unterschritten. Es werden nur 2,8:1 statt mindestens 3:1 erreicht.

          Dies betrifft auch den Button "Beitrag senden" auf Seite 4, sobald er nicht mehr disabled ist.

        2. 9.1.4.3/1.2

          Das so genannte Floating Label erreicht nur einen Textkontrast von 3,6:1, wenn sich das jeweilige Eingabefeld im Fokuszustand befindet. Allerdings muss mindestens ein Wert von 4,5:1 erreicht werden.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.3/3.1

          Der Kontrast "des aktiven Reiters" zu Beginn des Hauptinhalts ist mit 2,5:1 (hellblau gegen weiß) nicht ausreichend, hier müssten in der vorliegenden Formatierung mindestens 4,5:1 erreicht werden.

        2. 9.1.4.3/3.2

          Im Willkommenstext kontrastieren weiße Texte ebenfalls im Szenario "hellblau gegen weiß" nur mit 2,5:1. Sie müssen für aufgrund Ihrer Schriftgröße aber mindestens 3:1 erreichen.

      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.3/4.1

          Auf dem orangefarbenen Link in Schaltflächenoptik wird knapp der Mindestkontrast für fett formatierten Text in dieser Schriftgröße unterschritten. Es werden nur 2,8:1 statt mindestens 3:1 erreicht.

          Dies betrifft auch den Button "Beitrag senden" auf Seite 4, sobald er nicht mehr disabled ist.

        2. 9.1.4.3/4.2

          Der Kontrast "des aktiven Reiters" zu Beginn des Hauptinhalts ist mit 2,5:1 (hellblau gegen weiß) nicht ausreichend, hier müssten in der vorliegenden Formatierung mindestens 4,5:1 erreicht werden.

        3. 9.1.4.3/4.3

          Die Überschriften "Beitrag verfassen" und "Beitrag lesen und abstimmen" haben nur einen Kontrast von 2,5:1, wobei je mindestens 3:1 erreicht werden muss.

      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.3/5.1

          Der Kontrast "des aktiven Reiters" zu Beginn des Hauptinhalts ist mit 2,5:1 (hellblau gegen weiß) nicht ausreichend, hier müssten in der vorliegenden Formatierung mindestens 4,5:1 erreicht werden.

        2. 9.1.4.3/5.2

          Im Beitrag-melden-Dialog erreicht die Schrift des Melden-Buttons nur 3,8:1, sollte aber mindestens 4,5:1 erreichen.

        3. 9.1.4.3/5.3

          Die Überschriften "Beitrag verfassen" und "Beitrag lesen und abstimmen" haben nur einen Kontrast von 2,5:1, wobei je mindestens 3:1 erreicht werden muss.

      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 3 Seiten konform
      • 2 Seiten nicht konform
      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.11/1.1

          Die Umrandung der Checkbox erreicht nur 2,7:1 im Vergleich zur Umgebungsfarbe, muss aber mindestens 3:1 erreichen.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.1.4.11/5.1

          Die Schaltfläche, mit der man einen Beitrag melden kann, kontrastiert mit einem Kontrast von 2:1 nicht ausreichend zum Hintergrund und auch zum Ausrufezeichen. Mindestens 3:1 müssten erreicht werden.

          Dies gilt auch für die Fokusumrandung.

        2. 9.1.4.11/5.2

          Die Umrandung des Suchfeldes kontrastiert nur mit 1,1:1 vor dem Hintergrund. Hier müssten mindestens 3:1 erreicht werden.

      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 4 Seiten konform
      • 1 Seite nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.2.1.2/5.1

          Sobald der Ausklappbereich geöffnet wird, bleibt der Tastaturfokus auf ihn und seine Inhalte beschränkt, auch sobald er wieder geschlossen wird, sind Elemente unterhalb von ihm (visuell wie im Dokument) nicht mehr tastaturerreichbar. Dieses Verhalten sollte abgestellt werden.

      • 5 Seiten konform
      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 5 Seiten konform
      • Beteiligungsplattform
        konform
        1. 9.2.4.1/1.1

          Anmerkung ohne Bewertung: Um die Loginmaske einfacher für z. B. Screenreader-Nutzende auffindbar zu machen, könnte man ein generisches, benanntes Landmark erstellen. Z. B.:

          <div class="registration__login" role="region" aria-label="Einloggen">
...
</div>
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • 1 Seite konform
      • 4 Seiten nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.2/2.1

          Der Dokumententitel ist "Beteiligungsplattform" und beschreibt damit nicht den Inhalt, Zweck und die Funktion des Dokumentes, nämlich eine Passwortfestlegungoder Aspekte der Applikation wie Themenüberlblick, Beiträge verfassen etc.

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.2/3.1

          Der Dokumententitel ist "Beteiligungsplattform" und beschreibt damit nicht den Inhalt, Zweck und die Funktion des Dokumentes, nämlich eine Passwortfestlegungoder Aspekte der Applikation wie Themenüberlblick, Beiträge verfassen etc.

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.2/4.1

          Der Dokumententitel ist "Beteiligungsplattform" und beschreibt damit nicht den Inhalt, Zweck und die Funktion des Dokumentes, nämlich eine Passwortfestlegungoder Aspekte der Applikation wie Themenüberlblick, Beiträge verfassen etc.

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.2/5.1

          Der Dokumententitel ist "Beteiligungsplattform" und beschreibt damit nicht den Inhalt, Zweck und die Funktion des Dokumentes, nämlich eine Passwortfestlegungoder Aspekte der Applikation wie Themenüberlblick, Beiträge verfassen etc.

      • 1 Seite konform
      • 4 Seiten nicht konform
      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.3/1.1

          Öffnet man den "Beitrag Teilen"-Dialog nach Aktivierung des vierten Piktogramms (der drei Punkte), öffnet sich ein Dialog und der Tastaturfokus wird korrekterweise in ihn versetzt und auch auf den Dialog beschränkt. Allerdings ist dann das Schließen-X nicht mehr tastaturerreichbar, da es ausserhalb des Dialogs liegt und damit unerreichbar ist. Ein Schließen des Dialogs ist nur durch Drücken der Escape-Taste möglich.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.3/3.1

          Die Navigation ist als Tab-Komponente (Rollen tab und tablist) realisiert, allerdings ohne das das für Registerreiter nötige Tastaturbenutzungsschema, Stichwort "Roving Tabindex", siehe z. B. hier: https://barrierefrei.link/tab-auto (englisch).

          Zur Behebung ist dieses Verhalten nachzureichen.

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.3/4.1

          Die Navigation ist als Tab-Komponente (Rollen tab und tablist) realisiert, allerdings ohne das das für Registerreiter nötige Tastaturbenutzungsschema, Stichwort "Roving Tabindex", siehe z. B. hier: https://barrierefrei.link/tab-auto (englisch).

          Zur Behebung ist dieses Verhalten nachzureichen.

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.3/5.1

          Die Navigation ist als Tab-Komponente (Rollen tab und tablist) realisiert, allerdings ohne das das für Registerreiter nötige Tastaturbenutzungsschema, Stichwort "Roving Tabindex", siehe z. B. hier: https://barrierefrei.link/tab-auto (englisch).

          Zur Behebung ist dieses Verhalten nachzureichen.

      • 5 Seiten nicht konform
      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 4 Seiten konform
      • 1 Seite nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.2.4.6/5.1

          Die programmatische Beschriftung der Schaltfläche, mit denen man Beiträge favorisieren kann, lautet noch "Vote Button". Eine Übersetzung und Erhöhung der Aussagekraft ist nötig, z. B. eben "Beitrag favorisieren".

      • 5 Seiten konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 2 Seiten konform
      • 3 Seiten nicht konform
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.2.5.3/3.1

          Der Einsatz von jeweils aria-label führt dazu, dass die sichtbare Beschriftung der Registerreiter-Köpfe von der programmatischen Beschriftung abweicht. Das Attribut ist jeweils am Besten zu entfernen:

          • Sichtbar "Informationen" – programmatisch "Zeige Info Panel"
          • Sichtbar "Beitrag verfassen" – programmatisch "Beitrag erstellen"
          • Sichtbar "Beiträge lesen" – programmatisch "Beiträge anzeigen"
      • Beteiligungsplattform
        nicht konform
        1. 9.2.5.3/4.1

          Der Einsatz von jeweils aria-label führt dazu, dass die sichtbare Beschriftung der Registerreiter-Köpfe von der programmatischen Beschriftung abweicht. Das Attribut ist jeweils am Besten zu entfernen:

          • Sichtbar "Informationen" – programmatisch "Zeige Info Panel"
          • Sichtbar "Beitrag verfassen" – programmatisch "Beitrag erstellen"
          • Sichtbar "Beiträge lesen" – programmatisch "Beiträge anzeigen"
      • Beteiligungsplattform
        nicht konform
        1. 9.2.5.3/5.1

          Der Einsatz von jeweils aria-label führt dazu, dass die sichtbare Beschriftung der Registerreiter-Köpfe von der programmatischen Beschriftung abweicht. Das Attribut ist jeweils am Besten zu entfernen:

          • Sichtbar "Informationen" – programmatisch "Zeige Info Panel"
          • Sichtbar "Beitrag verfassen" – programmatisch "Beitrag erstellen"
          • Sichtbar "Beiträge lesen" – programmatisch "Beiträge anzeigen"
      • 5 Seiten nicht anwendbar
      • 4 Seiten konform
      • 1 Seite nicht konform
      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 2 Seiten konform
      • 3 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 2 Seiten konform
      • 3 Seiten nicht anwendbar
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform
        1. 9.3.3.1/2.1

          Anmerkung ohne Bewertung: Fehlermeldungen referenzieren fehlerhafte Felder nur textlich, nicht programmatisch. Da aber nur 3 Felder insgesamt existieren, ist das zwar nicht ideal, aber in Ordnung. Man könnte den Fehlermeldungen noch den Text "Fehler:" voranstellen, um noch eindeutiger zu sein.

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • 5 Seiten konform
      • 2 Seiten konform
      • 3 Seiten nicht anwendbar
      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform
        1. 9.3.3.3/2.1

          Anmerkung mit geringer Bewertung: "Formatfehler bei E-Mailadresse" könnte besser und eindeutiger formuliert sein, z. B. "Geben Sie eine E-Mailadresse nach dem Schema name@domain.de ein" bei tatsächlich falschem Format und "Bitte füllen Sie das Pflichtfeld aus", wenn das Feld leergelassen wurde.

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      • 5 Seiten konform
      • 3 Seiten nicht konform
      • 2 Seiten nicht anwendbar
      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 9.4.1.2/3.1

          Die "beeinflussten" Bereiche eines Ausklappbereiches, hier "accordeonBody" genannt, haben per aria-labelledby eine programmatische Gruppenbeschriftung. Diese wird allerdings nicht verlässlich ausgegeben, da letztlich einem rollenlosen div ein zugänglicher Name gegeben wurde. Es wird stark empfohlen, role="group" auf dem accordeonBody zu verwenden, um das gewünschte Ziel zu erreichen.

        2. 9.4.1.2/3.2

          Anmerkung ohne Bewertung: Klickbare <span>s im Seitenfuss werden vermutlich noch durch Links (a) ersetzt? Ansonsten würden hier folgende Barrieren auftreten:

          • falsche semantische Rolle, Soll: link
          • nicht tastaturerreichbar

          Allerdings passiert nach einem Klick offensichtlich aktuell noch nichts, es ist nur ein "click"-Event auf den spans zu erkennen.

        3. 9.4.1.2/3.3

          Da das Registereiter-Muster für die Navigation oben im Hauptinhaltsbereich gewählt wurde, sollte der aktive Tab per aria-selected="true"kommunizieren, dass er aktiv ist. Aktuell passiert das nur visuell bzw. über eine CSS-Klasse.

        4. 9.4.1.2/3.4

          Anmerkung ohne Bewertung, Hinweis: Innerhalb von <button>s geht Semantik verloren, so auch die Überschriften, da ein Button in der Praxis seine Inhalte auf reinen Klartext reduziert/"semantisch verflacht". Deswegen sollte eine andere Reihenfolge gewählt werden: <h3><button aria-expanded="true">Text</button></h3> etc.

      • Beteiligungsplattform
        nicht konform
        1. 9.4.1.2/4.1

          Wenn ein Formatierungsbutton "heruntergedrückt" ist, wird das durch einen Farbwechsel, aber nicht semantisch kommuniziert. Hier bietet sich aria-pressed="true" an.

        2. 9.4.1.2/4.2

          Da das Registereiter-Muster für die Navigation oben im Hauptinhaltsbereich gewählt wurde, sollte der aktive Tab per aria-selected="true"kommunizieren, dass er aktiv ist. Aktuell passiert das nur visuell bzw. über eine CSS-Klasse.

      • Beteiligungsplattform
        nicht konform
        1. 9.4.1.2/5.1

          Die Schaltfläche, mit denen man Beiträge favorisieren kann, kommuniziert ihren Zustand (favorisiert) nicht programmatisch. Das sollte über das Attribut aria-pressed geschehen

        2. 9.4.1.2/5.2

          Die "beeinflussten" Bereiche eines Ausklappbereiches, hier "accordeonBody" genannt, haben per aria-labelledby eine programmatische Gruppenbeschriftung. Diese wird allerdings nicht verlässlich ausgegeben, da letztlich einem rollenlosen div ein zugänglicher Name gegeben wurde. Es wird stark empfohlen, role="group" auf dem accordeonBody zu verwenden, um das gewünschte Ziel zu erreichen.

        3. 9.4.1.2/5.3

          Anmerkung ohne Bewertung: Klickbare <span>s im Seitenfuss werden vermutlich noch durch Links (a) ersetzt? Ansonsten würden hier folgende Barrieren auftreten:

          • falsche semantische Rolle, Soll: link
          • nicht tastaturerreichbar

          Allerdings passiert nach einem Klick offensichtlich aktuell noch nichts, es ist nur ein "click"-Event auf den spans zu erkennen.

        4. 9.4.1.2/5.4

          Anmerkung mit geringer Bewertung: Es ist zu begrüßen, dass der Dialog "Einen Beitrag melden" einen zugänglichen Namen hat. Allerdings scheint der erste Absatz als zugängliche Beschreibung (aria-describedby) etwas zu ausführlich und nicht zwingend hilfreich zu sein.

        5. 9.4.1.2/5.5

          Da das Registereiter-Muster für die Navigation oben im Hauptinhaltsbereich gewählt wurde, sollte der aktive Tab per aria-selected="true"kommunizieren, dass er aktiv ist. Aktuell passiert das nur visuell bzw. über eine CSS-Klasse.

        6. 9.4.1.2/5.6

          Anmerkung ohne Bewertung, Hinweis: Innerhalb von <button>s geht Semantik verloren, so auch die Überschriften, da ein Button in der Praxis seine Inhalte auf reinen Klartext reduziert/"semantisch verflacht". Deswegen sollte eine andere Reihenfolge gewählt werden: <h3><button aria-expanded="true">Text</button></h3> etc.

      • 1 Seite konform
      • 4 Seiten nicht anwendbar
      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform
        1. 9.4.1.3/4.1

          Anmerkung mit geringer Bewertung: Für den Echtzeit-Zähler der noch verbleibenden Buchstaben eine Ausgabe als Live Region empfohlen, da dieser eine Art Statusmeldung darstellt: https://barrierefrei.link/char-count (englisch).

      • Beteiligungsplattform
        nicht anwendbar

        Keine Anmerkungen vorhanden

      • 2 Seiten konform
      • 3 Seiten nicht konform
      • Beteiligungsplattform
        nicht konform
        1. 11.7/1.1

          Allgemeiner Absatztext (Seite 1) sowie der Text, der die Passwortvorgaben formuliert (Seite 2), erhält seine Schriftgröße per clamp()-Funktion im CSS und damit in Abhängigkeit der Breite des Viewports. Noch dazu sind Minimal- und Maximalwerte in Pixeln (und nicht etwa rem-Einheiten) angegeben, was den Text nicht (oder kaum) im Sinne dieses Prüfschritts vergrößerbar macht. Eine einfache Anweisung der Schriftgröße in rem ist vorzuziehen.

      • Beteiligungsplattform
        nicht konform
        1. 11.7/2.1

          Allgemeiner Absatztext (Seite 1) sowie der Text, der die Passwortvorgaben formuliert (Seite 2), erhält seine Schriftgröße per clamp()-Funktion im CSS und damit in Abhängigkeit der Breite des Viewports. Noch dazu sind Minimal- und Maximalwerte in Pixeln (und nicht etwa rem-Einheiten) angegeben, was den Text nicht (oder kaum) im Sinne dieses Prüfschritts vergrößerbar macht. Eine einfache Anweisung der Schriftgröße in rem ist vorzuziehen.

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        konform

        Keine Anmerkungen vorhanden

      • Beteiligungsplattform
        nicht konform
        1. 11.7/5.1

          "Favorisieren"- und "Beitrag melden"-Icons als SVGs sollten Farbe über fill="currentcolor" von der eingestellten Textfarbe bekommen. Sind nicht mehr zu sehen, wenn man weißen Vordergrund / schwarzen Hintergrund gemäß des Prüfschrittszenarios einstellt.

      • 1 Seite konform
      • 4 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden

      • 5 Seiten nicht anwendbar
      nicht anwendbar

      Keine Anmerkungen vorhanden