Prüfbericht BIK BITV-Test (Web): mobil.nrw gemäß BITV 2.0 / EN 301 549
Seite | konform | nicht konform | nicht anwendbar |
---|---|---|---|
Seite 1: Startseite | 29 Prüfschritte | 19 Prüfschritte | 50 Prüfschritte |
Seite 2: Mobilitätsgarantie NRW | 33 Prüfschritte | 18 Prüfschritte | 47 Prüfschritte |
Seite 3: Wanderrouten in NRW | 29 Prüfschritte | 14 Prüfschritte | 55 Prüfschritte |
Seite 4: Wandernd NRW entdecken | 29 Prüfschritte | 15 Prüfschritte | 54 Prüfschritte |
Seite 5: Einfach-Weiter-Ticket | 28 Prüfschritte | 16 Prüfschritte | 54 Prüfschritte |
Seite 6: Kontakt | 32 Prüfschritte | 14 Prüfschritte | 52 Prüfschritte |
Seite 7: Regionalverkehrsplan | 25 Prüfschritte | 20 Prüfschritte | 53 Prüfschritte |
Seite 8: Fahrplanauskunft | 30 Prüfschritte | 17 Prüfschritte | 51 Prüfschritte |
Seite 9: Aktuelle Verkehrsinfos | 27 Prüfschritte | 15 Prüfschritte | 56 Prüfschritte |
Seite 10: Vernetzt mobil dank Mobilstationen | 27 Prüfschritte | 17 Prüfschritte | 54 Prüfschritte |
Seite 11: Mobimat | 30 Prüfschritte | 15 Prüfschritte | 53 Prüfschritte |
Projektdaten
- URL des Webauftritts
- https://www.mobil.nrw/
- Prüfzeitraum
- 10.10.2022 - 25.10.2022
- Datum Prüfbericht
- 25.10.2022
- Prüfstelle
- Marcus Hermann
- Prüfer*in
- Marcus Herrmann
- Art des Tests
- Zur Veröffentlichung geeignet
- Ergebnis
- 0 von 11 der ausgewählten Seiten einer unabhängigen, repräsentativen Seitenauswahl wurden als BITV- / EN 301 549-konform bewertet.
- 11 Seiten nicht konform
Rahmenbedingungen des Prüfauftrags
- Auftraggebende Organisation
- CP//COMPARTNER
- Umfang der Prüfung
- 11 Seiten sind eingehend zu prüfen.
- Standard
- BITV 2.0 (Mai 2019) / anzuwendender Standard EN 301 549 (PDF)
- Prüfverfahren
- BIK BITV-Test (Web), gemäß EN 301 549
- Prüfumgebung
- Werkzeugliste BITV-Test (Web)
- Gültigkeit
- Das Prüfergebnis gilt nur für die geprüfte Seitenauswahl, nicht für den gesamten Webauftritt.
- Seitenauswahl
- Die Seitenauswahl wurde von der Prüfstelle durchgeführt und ist repräsentativ.
- Veröffentlichung
- Zur Veröffentlichung geeignet
Konformität und Auswertung
Hinweis zur Konformitätsaussage
Grundlage für den BITV-Test ist die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0) vom 21. Mai 2019 bzw. die in der BITV referenzierte EN 301 549 V3.2.1 (PDF). Die europäische Norm EN 301 549 enthält neben den WCAG 2.1-Kriterien für den Bereich Web weitere verpflichtende Anforderungen (siehe Annex A, Tabelle A.1 (PDF)). Diese werden seit 01.03.2021 im BITV-Test geprüft. Hinsichtlich der Konformitätsaussage gilt zu beachten:
- Eine Webseite gilt als BITV- / EN 301 549-konform, wenn sie alle Anforderungen der BITV 2.0 / EN 301 549 für den Bereich Web erfüllt.
- Wird einer der Prüfschritte des BITV-/EN 301 549-Tests für eine Webseite als „nicht erfüllt“ oder als nur „teilweise erfüllt“ bewertet, so kann diese Seite nicht als BITV-konform gelten.
- Die Konformitätsaussage gilt nur für geprüfte Seiten. Es kann nicht ausgeschlossen werden, dass auf Seiten, die nicht Teil der Seitenauswahl sind, Mängel auftreten.
Hinweis zur Testauswertung
Die EN 301 549 formuliert für den Bereich Web 88 Anforderungen, diese werden im BIK BITV-Test (Web) in 98 Prüfschritten geprüft. Die Anzahl der Prüfschritte weicht von der Anzahl der Anforderungen ab, da einzelnen Anforderungen mehrere Prüfschritten zugeordnet sind.
- Ist die Prüfung einer Anforderung auf mehrere Prüfschritte aufgeteilt, so werden bei der Auswertung die Ergebnisse einzelner Prüfschritte zusammengefasst.
- Wenn einer der Prüfschritte einer Anforderung „nicht erfüllt“ ist, ist auch die Anforderung „nicht erfüllt“, selbst wenn andere Prüfschritte dieser Anforderung erfüllt sind.
Seitenauswahl für den Prüfauftrag
-
Mobilitätsgarantie NRWMobilitätsgarantie - mobil.nrw
-
Wandernd NRW entdeckenWandernd NRW entdecken - mobil.nrw
-
Einfach-Weiter-TicketEinfachWeiterTicket NRW - mobil.nrw
-
Aktuelle VerkehrsinfosVerkehr.NRW - mobil.nrw
-
Vernetzt mobil dank MobilstationenMobilstationen - mobil.nrw
Anmerkungen
Anmerkungen zur Seitenauswahl
Ausgeschlossen wurden die Subdomains ticketshop, infoportal und pressebereich. Alle drei sind nach Ansicht der Prüfstelle autarke Bereiche, die teilweise redundante Funktionen zum Prüfgegenstand bieten bzw. nicht essentiell wichtig zur Nutzung des Prüfgegenstandes sind.
Ergebnisse im Überblick
Ergebnisse nach Prüfschritten
-
5 Allgemeine Anforderungen
Prüfschritte
-
5.2. Aktivierung von Barrierefreiheitsfunktionen,
Details
- 11 Seiten konform
Details
-
Für Seiten 7 und 11: nicht anwendbar.
-
5.3. Biometrie,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
5.4. Erhaltung von Barrierefreiheitsinformationen bei Konvertierung,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
6 Zwei-Wege-Sprachkommunikation
Prüfschritte
-
6.1. Audiobandbreite für Sprache,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.1.1. Textkommunikation in Echtzeit,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.1.2. Gleichzeitige Sprache und Text,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.2.1. Visuell unterscheidbare Anzeige von Textnachrichten,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.2.2. Programmatisch unterscheidbare Anzeige von Textnachrichten,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.2.3. Sprecheridentifizierung,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.2.4. Echtzeitanzeige von Sprech-Aktivität,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.3. Interoperabilität von Echtzeit-Textkommunikation,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.2.4. Reaktionsgeschwindigkeit der Echtzeit-Textkommunikation,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.3. Anrufer-Identifizierung,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.4. Alternativen zu sprachbasierten Diensten,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.5.2. Auflösung bei Videotelefonie,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.5.3. Bildwiederholfrequenz bei Videotelefonie,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.5.4. Synchronität bei Videotelefonie,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.5.5. Visuelle Anzeige von Audio-Aktivität,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
6.5.6. Sprecher-Anzeige für Gebärdensprachen-Kommunikation,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
7 Videofähigkeiten
Prüfschritte
-
7.1.1. Wiedergabe von Untertiteln,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Keine Untertitel vorhanden, da nur Musik auf der Tonspur.
-
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.1.2. Synchrone Untertitel,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.1.3. Erhaltung von Untertiteln,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.1.4. Untertitel-Anpassungen,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.1.5. Gesprochene Untertitel,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.2.1. Wiedergabe von Audiodeskription,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.2.2. Synchrone Audiodeskription,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.2.3. Erhaltung von Audiodeskription,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
7.3. Bedienelemente für Untertitel und Audiodeskription,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.1.1 Textalternativen
Prüfschritte
-
9.1.1.1a. Alternativtexte für Bedienelemente,
Details
- 11 Seiten nicht konform
-
Details
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Absendebutton im Fahrplanauskunft-Widget hat keinen zugänglichen Namen, da die darin befindliche Pfeil-nach-rechts-Grafik als dekorative Grafik umgesetzt wurde, somit kein "Namensgeber" für den Button sein kann. Zur Behebung ist entweder die dekorative Grafik in eine inhaltstragende Grafik umzuwandeln (Alternativtext dann "Suchen"), oder dem Button ist beispielsweise per
aria-label
-Attribut ebenfalls der zugängliche Name "Suchen" zu geben. -
Im Fahrplanauskunft-Widget hat der "Ortungssymbol"-Button im Start-Eingabefeld keinen zugänglichen Namen, da die darin befindlicheGrafik als dekorative Grafik umgesetzt wurde, somit kein "Namensgeber" für den Button sein kann. Zur Behebung ist entweder die dekorative Grafik in eine inhaltstragende Grafik umzuwandeln (Alternativtext dann "Automatisch orten"), oder dem Button ist beispielsweise per aria-label-Attribut ebenfalls der zugängliche Name "Automatisch orten" zu geben.
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Der Absende-Button im "Newsletter abonnieren"-Widget besitzt keinen Alternativtext, da die darin befindliche Pfeil-nach-rechts-Grafik als dekorative Grafik umgesetzt wurde, somit kein "Namensgeber" für den Button sein kann. Zur Behebung ist entweder die dekorative Grafik in eine inhaltstragende Grafik umzuwandeln (Alternativtext dann "Abonnieren"), oder dem Input-Element ist beispielsweise per
aria-label
-Attribut ebenfalls der zugängliche Name "Abonnieren" zu geben. -
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der Button "Sucheinstellungen anpassen" (
.icon-einstellungen
) hat keinen Alternativtext (es existiert ein versteckter Text vorhanden, dieser wird aber mitdisplay:none
versteckt. Stattdessen sollte folgende Strategie gewählt werden: https://barrierefrei.link/visuell-verborgen). -
Die Buttons zur Auswahl von Start und Ziel auf der Karte (
.map-btn
) und dem Einstellungsmenü haben jeweils keinen Alternativtext.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Der Absende-Button im "Newsletter abonnieren"-Widget besitzt keinen Alternativtext, da die darin befindliche Pfeil-nach-rechts-Grafik als dekorative Grafik umgesetzt wurde, somit kein "Namensgeber" für den Button sein kann. Zur Behebung ist entweder die dekorative Grafik in eine inhaltstragende Grafik umzuwandeln (Alternativtext dann "Abonnieren"), oder dem Input-Element ist beispielsweise per
aria-label
-Attribut ebenfalls der zugängliche Name "Abonnieren" zu geben. -
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Der Absende-Button im "Newsletter abonnieren"-Widget besitzt keinen Alternativtext, da die darin befindliche Pfeil-nach-rechts-Grafik als dekorative Grafik umgesetzt wurde, somit kein "Namensgeber" für den Button sein kann. Zur Behebung ist entweder die dekorative Grafik in eine inhaltstragende Grafik umzuwandeln (Alternativtext dann "Abonnieren"), oder dem Input-Element ist beispielsweise per
aria-label
-Attribut ebenfalls der zugängliche Name "Abonnieren" zu geben. -
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Das verlinkte Bild mit dem abgebildeten Wanderfolder hat den Alternativtext "Ein Mockup des Wanderfolders 2022 auf einem Holzhintergrund", woraus allerdings das Linkziel nicht klar wird. Es ist ergänzend im Alternativtext zu beschreiben, beispielsweise "… - zur Großansicht".
-
Anmerkung ohne Bewertung: Die rein dekorativen Collagen unterhalb "Detaillierte Infos zu den Touren" können als dekorative Bilder (d. h. mit
alt=""
) ausgezeichnet werden, da die existierenden Alternativtexte die Collagen ohnehin nicht beschreiben. Um dennoch den ganzen Teaser klickbar zu machen, wird empfohlen, das Card-Pattern anzuwenden: https://barrierefrei.link/cards (englisch). -
Das komoot-Logo verlinkt auf komoot.de, das sich im Link befindliche Bild hat allerdings kein
alt
-Attribut. Zur Behebung ist in diesem das Abgebildete und das Linkziel zu beschreiben.Klickbare Symbole auf der komoot-Karte sind als dekorative Bilder umgesetzt. Sie sind in inhaltstragende Bilder zu wandeln (https://barrierefrei.link/svg-inline-alt, englisch) oder dem umgebenden Button ist per
aria-label
-Attribut ein Alternativtext zu geben, der die Funktion des Buttons beschreibt (z. B. "Vollbild", "Herauszoomen").
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Die Tarif-Gebiet-Karte linkt auf eine vergrößerte Darstellung ihrer selbst in einem modalen Fenster. Das Linkziel geht allerdings nicht aus dem Alternativtext des Bildes hervor, er beschreibt nur - wenn auch angemessen - den Bildinhalt. Ein Hinweis wie z. B. "…- öffnet vergrößerte Darstellung" ist im Alternativtext deswegen zu ergänzen.
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten.
-
-
Details
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten.
-
-
Details
-
Sobald man Streckendaten, d. h. Start- und Zielpunkt eingegeben hat, erscheint im Textfeld genannter Stationen ein Mülleimer-Symbol, das aber als Iconfont, d. h. dekoratives Bild eingebunden ist (und dessen Elternelement ein klickbares
span
ist, siehe 9.4.1.2). Diese Symbole sind zur Behebung am einfachsten in inhaltstragende Bilder umzuwandeln, mit einem Alternativtext wie "Eingabe löschen".Das gleiche Fehlermuster, das heißt
span
und Iconfont, tritt im Fenster auf, das nach Eingabe und Klick auf "Ankunft anfordern" erscheint, inklusive dem Schließen-X.Das gleiche gilt ebenfalls für die Pfeile neben den Textfeldern in Bezug auf Abfahrtszeit und -datum.
Das gleiche gilt auch für die "Einklapper" der Seitenleisten (visuell Dreiecke nach rechts bzw. links zeigend).
-
Das Icon auf dem Absendebutton unterhalb der Überschrift "Haltestellensuche" ist mit einer Iconfont umgesetzt, der Text des Buttons somit ein nichtssagendes "r" (visuell: ein Dreieck, nach rechts gewandt). Vorschlag zur Behebung: Umwandlung in ein Button-Element,
<button type="submit" aria-label="Absenden"><!-- Hier Icon --></button>
.
-
-
nicht konform
Details
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Das Zahnrad-Icon im oberen Teil des Suchformulares hat keinen Alternativtext, da einerseits das Zahnrad-Bild als dekoratives eingesetzt wurde, andererseits der sich im Bild befindliche Text per
display: none
vor allen Nutzungsformen versteckt wurde. Zur Behebung ist der Text nur visuell zu verbergen: https://barrierefrei.link/visuell-verborgen . -
Das graue Marker-Icon rechts hat keinen Alternativtext, da das im Button befindliche Bild als dekoratives eingebunden wurde. Zur Behebung muss das Bild entweder als inhaltstragendes eingebunden werden (mit Alternativtext "Auf Karte anzeigen"), oder dem Button z. B. mit
aria-label
ein gleichlautender zugänglicher Name gegeben werden.Das gleiche gilt für das danebenstehende Zahnrad-Icon auf grauem Hintergrund, sowie das Schließen-X, wenn die Karte sichtbar gemacht wurde (hier ist zudem die Rolle falsch - siehe 9.4.1.2 - und die Tastaturerreichbarkeit nicht gegeben - siehe 9.2.1.1).
-
Klickt man auf ein graues Marker-Icon auf der rechten Seite, wird die eingegebene Station auf einer Karte dargestellt. Die Karten-Bedienelemente wie Zoom oder Suche sind klickbare
img
-Elemente ohne Alternativtext (falsche Rolle: siehe 9.4.1.2). Wird die richtige Rollebutton
hergestellt, so brauchen die Bilder einen entsprechenden Alternativtext, der die jeweilige Funktion beschreibt, oder das Element mit der Rollebutton
ein namensgebendes Attribut wiearia-label
(ebenfalls mit einer Funktionsbeschreibung).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Interaktive Elemente auf der Karte, seien es Kontrollelemente zum Erreichen der Vollbildansicht, Einblenden eines Menüs, die Menüpunkte darin oder einzelne Marker auf der Karte sind als dekorative Bilder umgesetzt. Dadurch, dass ihre umgebenden Kontrollelemente auch nicht auf andere Arten programmatisch beschriftet sind, liegen in der Karte eine Vielzahl von unbeschrifteten Kontrollfeldern vor. Diese Beschriftung ist nachzureichen, entweder durch die Umwandlung in inhaltstragende Bilder mit die Funktion beschreibendem Alternativtext, oder mit namensgebenden Attributen wie
aria-label
auf den Kontrollelementen selbst.Grundsätzlich ist die Verkehr.NRW-Karte unzugänglich und übermäßig komplex, siehe 9.4.1.2. Die Nennung der Barrieren hat deswegen keinen Anspruch auf Vollständigkeit und wird auch durch die eigene Barrierefreiheitserklärung des Kartenwidgets ergänzt.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Marker auf der Karte unterhalb der Überschrift "Ein NRW-weites Netz von Mobilstationen" haben keinen zugänglichen Namen, da der einzige Geber für den zugänglichen Namen ein in der Marker-Schaltfläche befindliches Bild ist - das allerdings kein
alt
-Attribut hat. Dies ist entweder mit dem Ortsnamen des Markereintrags zu ersetzen, oder, im Falle von Cluster-Markern, mit der Menge der dann aufklappenden Marker im Cluster. -
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Der Alternativtext des Umschlag-Symbols im grauen Fußbereich lautet "Newsletter Icon", damit wird das Linkziel des verlinkten Bildes nicht klar beschrieben (im Gegensatz zu den Alternativtexten der verlinkten Bilder in unmittelbarer Nähe). Ein besserer Text wäre schlicht "Newsletter" oder "Newsletter-Anmeldung".
-
Öffnet man die "Cookie-Einstellungen" aus dem Fussbereich heraus, und klickt dann neben einer Cookie-Art auf das Fragezeichensymbol (das keinen Alternativtext hat, siehe dazu aber 9.4.1.2), öffnet sich ein weiterer Dialog (der genauso wie der erste auch keinerlei Dialog-Semantik hat, siehe 9.4.1.2). Der Schließen-Button dieses zweiten Dialogs hat keinen Alternativtext, obwohl sich ein SVG in ihm befindet. Diesem SVG ist durch die folgende Instandsetzung (englischer Artikel) ein Alternativtext zu geben: https://barrierefrei.link/svg-inline-alt .
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieses Symbol, und damit auch sein umgebender Button hat keinen zugänglichen Namen. Da es sich um ein SVG handelt, ist folgende Strategie für Alternativtexte bei SVGs zu wählen: https://barrierefrei.link/svg-inline-alt (englisch).
-
Das Schließen-X, dass das offene mobile Menü wieder einklappt hat nur ein dekoratives Bild (genauer gesagt: ein CSS-Konstrukt, dass zwei Striche übereinanderlegt) in sich. Dies, in Kombination mit dem Fehlen eines namensgebenden Attributs wie z. B.
aria-label
führt dazu, dass die Schaltfläche unbeschriftet ist. Eine Beschriftung ist wie erwähnt z. B. überaria-label
herzustellen, oder das dekorative ist in ein informatives Bild umzuwandeln, das den Alternativtext "Navigation schließen" trägt.Das gleiche Fehlermuster tritt auf Seite 8 auf, wenn man die Kartendarstellung einer Haltestelle aktiviert (dort "X" über der Karte) oder einen Zwischenhalt angibt (dort "X" neben den Zwischenhalt-Eingabefeldern).
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Die verlinkten Bilder, die die Kampagnenmotive im unteren Bereich der Seite abbilden haben Alternativtexte, aus denen das jeweilige Linkziel nicht klar wird. Es ist ergänzend im Alternativtext zu beschreiben, beispielsweise "… - zur Großansicht".
-
Verlinkte Bilder auf der eingebundenen Karte haben kein
alt
-Attribut. Es ist nachzuliefern, der Alternativtext muss jeweils der Ortsname bzw. die Adresse sein. Zusätzlich ist im Alternativtext anzukündigen, dass eine Aktivierung eine Markergroßansicht öffnet. -
Das verlinkte Bild unter "Einheitliches Design mit Wiedererkennungswert" hat den Alternativtext "Eine Infografik, die den Aufbau der Stelen an Mobilstationen zeigt.", woraus allerdings das Linkziel nicht klar wird. Es ist ergänzend im Alternativtext zu beschreiben, beispielsweise "… - zur Großansicht".
-
-
nicht konform
Details
-
Das mobil.nrw-Logo (im Kopf- und Fußbereich) verlinkt auf die Startseite, das geht aber nicht aus seinem Alternativtext hervor. Er sollte entsprechend "Logo mobil.nrw - zur Startseite" lauten. Auf Seite 11 ist der Alternativtext gar "Content and Sales Logo".
-
Die Facebook- und Instragram-Icon verlinkten auf die entsprechenden Social-Media-Präsenzen von mobilove. Die Links haben allerdings keinen zugänglichen Namen, da das jeweils in ihm befindliche Bild als dekorative Grafik eingebunden wurde, und der vorhandene Text unzulässig versteckt wurde. Die einfachste Behebungsart wäre es, den Text mit folgendem Ansatz korrekt visuell (aber nicht vor Screenreadern) zu verstecken: https://barrierefrei.link/visuell-verborgen .
-
-
9.1.1.1b. Alternativtexte für Grafiken und Objekte,
Details
- 2 Seiten konform
- 9 Seiten nicht konform
-
Details
-
Die Alternativtexte der Bildkacheln unterhalb des "Fahrplanauskunft-Widgets" beschreiben nicht, was auf den Bildern zu sehen ist. So ist beispielsweise "Dreh deine Extrarunde - bis zum Jahresende" ein Marketingsatz, aber keine angemessene Bildbeschreibung, die abgebildete Personen, Gegenstände und ggf. Stimmungen reproduziert. Es muss beschrieben werden, was auf dem Bild zu sehen ist, oder, im Falle von Bildcollagen ohne Informationswert, das Bild als dekorativ markiert werden (
alt=""
). -
Die Icons für Datum (Kalender), Uhrzeit (Uhr) und "Start/Ziel tauschen" (Pfeile, nur Seite 8) haben keinen Alternativtext.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Ähnlich der Bildkacheln auf Seite 1 beschreiben die Alternativtexte der Kacheln auf dieser Seite ebenfalls nicht ausreichend die sichtbaren Bilder, sondern geben nur den Text der sich in den Kacheln befindlichen Überschriften wieder. Zur Behebung siehe Seite 1, Kacheln, in diesem Prüfschritt.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Das Bild, dass das Smartphone im Bereich der Apps abbildet, hat den Alternativtext "{". Dies ist durch einen aussagekräftigeren Text zu ersetzen.
-
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht konform
Details
-
Anmerkung ohne Bewertung: Die Präsentation der Start- und Zielpunkte auf der Karte gilt selbst als eine alternative Darstellung.
-
In der Ergebnisdarstellung (bei eingegebenem Start- und Endpunkt) sind inhaltstragende Bilder (z. B. ob es sich um einen Bus oder eine S-Bahn für das Teilstück der Verbindung handelt) als dekorative Bilder, genauer: Iconfont-Bilder, gelöst. Dies ist zu korrigieren: Eine Umwandlung in inhaltstragende Bilder (z. B.
<img>
-Element) mit aussagekräftigen Alternativtexten, die die Information abbilden, die auch visuell zu sehen ist, ist vorzunehmen. -
In der Ergebnisdarstellung (bei eingegebenem Start- und Endpunkt): In jeder einzelnen Station einer Fahrt gibt es einen kleinen farbigen Kreis, dessen Bedeutung weiter oben in einer Tabelle erklärt wird: Keine Informationen, Pünktlich oder von Verkehrslage beeinflusst. Diese Bilder sind deswegen inhaltstragend, doch weder in den einzelnen Stationen, noch in der Legende als inhaltstragendes Bild umgesetzt. Dies ist zu gewährleisten.
-
Vor den Eingabefeldern zum Datum der Fahrt und der Uhrzeit der Fahrt gibt es jeweils ein Kalender- und Uhr-Icon. Beide wurden als dekoratives Bild umgesetzt. Auch hier ist eine Umwandlung in ein inhaltstragendes Bild vorzunehmen, der Alternativtext muss entsprechend "Datum" und "Uhrzeit" lauten.
-
Die Icons für Datum (Kalender), Uhrzeit (Uhr) und "Start/Ziel tauschen" (Pfeile, nur Seite 8) haben keinen Alternativtext.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Für die eingebundene Karte muss ein Alternativinhalt bereitgestellt werden (da die Daten rein visuell präsentiert werden, dies für Screenreader-Nutzende nicht bedienbar ist und zumal die Karte gegen andere Prüfschritte verstößt, z. B. 9.1.1.1a und 9.4.1.2). Es ist beispielsweise unter der Karte ein Link auf eine alternative, z. B. tabellarische Ausprägung der Kartendaten und Markerinhalte zu setzen (vergleichbar mit der Komoot-Karte auf Seite 4).
Grundsätzlich ist die Verkehr.NRW-Karte unzugänglich und übermäßig komplex, siehe 9.4.1.2. Die Nennung der Barrieren hat deswegen keinen Anspruch auf Vollständigkeit und wird auch durch die eigene Barrierefreiheitserklärung des Kartenwidgets ergänzt.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Für die eingebundene Karte muss ein Alternativinhalt bereitgestellt werden (da die Daten rein visuell präsentiert werden, dies für Screenreader-Nutzende nicht bedienbar ist und zumal die Karte gegen andere Prüfschritte verstößt, z. B. 9.1.1.1a und 9.4.1.2). Es ist beispielsweise unter der Karte ein Link auf eine alternative, z. B. tabellarische Ausprägung der Kartendaten und Markerinhalte zu setzen (vergleichbar mit der Komoot-Karte auf Seite 4).
Grundsätzlich ist die Verkehr.NRW-Karte unzugänglich und übermäßig komplex, siehe 9.4.1.2. Die Nennung der Barrieren hat deswegen keinen Anspruch auf Vollständigkeit und wird auch durch die eigene Barrierefreiheitserklärung des Kartenwidgets ergänzt.
-
-
nicht konform
Details
-
Das "#mobilove"-Logo ist als dekoratives Bild eingebunden, aber inhaltstragend. Es ist als solches, z. B. als
<img>
-Element, einzubinden mit dem Alternativtext "mobilove-Logo". -
Für das animierte Inline-SVG ist wiefolgt ein Alternativtext zu gewährleisten: https://barrierefrei.link/svg-inline-alt (englisch), der beschreibt, welche Transportarten Gegenstand der Umfrage sind.
-
-
9.1.1.1c. Leere alt-Attribute für Layoutgrafiken,
Details
- 10 Seiten konform
- 1 Seite nicht anwendbar
-
Details
-
Anmerkung ohne Bewertung in diesem Prüfschritt: In Sachen Bildkachel-Teaser siehe Seite 1, 9.1.1.1a.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung mit geringer Abwertung: Für die Teaserhintergründe unterhalb von "Könnte auch interessant sein" wäre es angemessen, die Bilder als dekorative Bilder zu markieren, also das
alt
-Attribut zu leeren, zumal die Bildbeschreibungen nur den sichtbaren Text wiederholen und nicht das Bild beschreiben. Andernfalls wird der programmatische Linktext eines einzelnen Links negativ beeinflusst. Der erste Link (zum Zeitpunkt der Prüfung) hat beispielsweise den aus Alternativ- und sichtbaren Text zusammengesetzten Namen: "Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW".
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Anmerkung mit geringer Abwertung: Für die Teaserhintergründe unterhalb von "Könnte auch interessant sein" wäre es angemessen, die Bilder als dekorative Bilder zu markieren, also das
alt
-Attribut zu leeren, zumal die Bildbeschreibungen nur den sichtbaren Text wiederholen und nicht das Bild beschreiben. Andernfalls wird der programmatische Linktext eines einzelnen Links negativ beeinflusst. Der erste Link (zum Zeitpunkt der Prüfung) hat beispielsweise den aus Alternativ- und sichtbaren Text zusammengesetzten Namen: "Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW".
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
-
Anmerkung mit geringer Abwertung: Für die Teaserhintergründe unterhalb von "Könnte auch interessant sein" wäre es angemessen, die Bilder als dekorative Bilder zu markieren, also das
alt
-Attribut zu leeren, zumal die Bildbeschreibungen nur den sichtbaren Text wiederholen und nicht das Bild beschreiben. Andernfalls wird der programmatische Linktext eines einzelnen Links negativ beeinflusst. Der erste Link (zum Zeitpunkt der Prüfung) hat beispielsweise den aus Alternativ- und sichtbaren Text zusammengesetzten Namen: "Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW".
-
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Anmerkung mit geringer Abwertung: Für die Teaserhintergründe unterhalb von "Könnte auch interessant sein" wäre es angemessen, die Bilder als dekorative Bilder zu markieren, also das
alt
-Attribut zu leeren, zumal die Bildbeschreibungen nur den sichtbaren Text wiederholen und nicht das Bild beschreiben. Andernfalls wird der programmatische Linktext eines einzelnen Links negativ beeinflusst. Der erste Link (zum Zeitpunkt der Prüfung) hat beispielsweise den aus Alternativ- und sichtbaren Text zusammengesetzten Namen: "Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW Digitaler Erstattungsantrag für die Mobilitätsgarantie NRW".
-
-
Details
Keine Anmerkungen vorhanden
-
9.1.1.1d. Alternativen für CAPTCHAs,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.1.2 Zeitbasierte Medien
Prüfschritte
-
9.1.2.1. Alternativen für Audiodateien und stumme Videos,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.2.2. Aufgezeichnete Videos mit Untertiteln,
Details
- 1 Seite nicht konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Die Untertitel im Video unterhalb der Überschrift "Die Mobilitätsgarantie auf einen Blick" sind automatisch generiert, deswegen ohne Satzzeichen und stellenweise leicht sinnentstellend (Untertitel "komplexere", Audiospur "komplett zurück", Timecode 0:25). Das Video ist ggf. manuell zu Untertiteln, auf jeden Fall unter Beachtung von Rechtschreibe-, Komma- und Satzstrukturregeln und es ist sicherzustellen, dass das Gesagte sich korrekterweise in den Untertiteln wiederfindet.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.2.3. Audiodeskription oder Volltext-Alternative für Videos,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Siehe Anmerkung in 9.1.2.5 zu Seite 2.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.2.4. Videos (live) mit Untertiteln,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.2.5. Audiodeskription für Videos,
Details
- 1 Seite konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Das Video ist mehrheitlich auch ohne eher dekorative Videospur verständlich, mit einer Ausnahme: Wenn auf der Audiospur im Kontext der Kostenerstattungen von "tagsüber" die Rede ist, ist (nur) der Videospur zu entnehmen, dass 5 bis 20 Uhr, das gleiche gilt für "nachts" (Videospur: 20 bis 5 Uhr). Allerdings steht zumindest eine dieser Uhrzeit-Informationen im Absatz über dem Video. Zudem wird eine URL eingeblendet, die so nicht vollständig in der Tonspur wiedergegeben wird - allerdings ist das die URL der Unterseite, auf die sich der/die Besuchende gerade befindet.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.1.3 Anpassbar
Prüfschritte
-
9.1.3.1a. HTML-Strukturelemente für Überschriften,
Details
- 2 Seiten konform
- 9 Seiten nicht konform
-
Details
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
Die Überschriften der Kacheln/Newsteaser sind
<h3>
und erscheinen der<h2>
Fahrplanauskunft untergeordnet, obwohl kein direkter Zusammenhang besteht. Entweder sollte mit einer visuell verborgenen<h2>
(Name z. B. "Neuigkeiten", https://barrierefrei.link/visuell-verborgen) gearbeitet werden, oder die Kachel-Überschriften werden zu<h2>
s. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
Die
h2
"Blättert euch durch den Wanderfolder" sollte man derh2
"Wandernd NRW entdecken" untergeordnet, sprich: alsh3
sehen. Das gleiche gilt auch für folgendeh2
wie z.B. "Detaillierte Infos zu den Touren". -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Details
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Details
-
Anmerkung mit geringer Abwertung: Klickt man auf eine Station auf der Karte, so ist der Ortsname dieser Station im dann folgenden Dialog als seine Überschrift (ggf. im Kontext des bestehenden Überschriftenbaums als
h1
) zu sehen.
-
-
nicht konform
Details
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Was das Handling von "Dachzeilen", also kleineren Texten direkt über Überschriften angeht, kann man auf der Seite trotz visuell identischem Ergebnis zwei technische Ansätze feststellen:
- Auszeichnung der Dachzeile als Absatz (z. B. Hero Seite 5).
- Auszeichnung der Dachzeile als Teil der Überschrift (z. B. Kacheln auf Seite 1).
Hier sollte vereinheitlicht werden.
-
Die Spalten im Fußbereich (Desktopansicht) haben jeweils eine verlinkte visuelle Überschrift, die allerdings trotz entsprechender inhaltlicher Funktion semantisch keine ist. Zur Behebung ist es denkbar, mit einer visuell verborgenen Überschrift 2. Ordnung (https://barrierefrei.link/visuell-verborgen) zu arbeiten, die den Fußbereich und alle Überschriften in ihm beschreibt, und die angesprochenen Links dann als Überschriften dritter Ordnung auszuzeichnen.
Das würde auch die Fehlzuordnung der
<h3>
"Betriebsqualität auf einen Blick" zu einer ggf. existierenden dort befindlichen<h2>
wie "Könnte auch interessant sein" unterbinden. -
"Teilen" im unteren Bereich des Hauptinhalts hat die Funktion einer Überschrift, da es die Social-Media-Links ankündigt, sollte im Kontext eine
<h2>
oder<h3>
sein. -
Der Text "Unter #DuGibstDenTonAn können Bürger*innen aus der Stadtregion Köln zeigen, wie sie dank der Angebote von Mobilstationen ans Ziel kommen." ist als
h4
ausgezeichnet, ohne dass er Überschriftenfunktion hat. Er ist in einen Absatz zu wandeln.
-
-
Details
-
Anmerkung ohne Bewertung: Die "visuelle Dachzeile", z. B. "1/10 Thema: Wunsch" ist als
<h2>
denkbar (der wie eine Überschrift ausssehende Text die Frage und damit die Gruppenbeschriftung für die Radio-Eingabefelder).
-
-
9.1.3.1b. HTML-Strukturelemente für Listen,
Details
- 10 Seiten konform
- 1 Seite nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
-
Anmerkung mit geringer Abwertung: Nach der Eingabe von Start- und Endpunkt erscheint ein Fahrplan der gewählten Verbindung, inklusive einzelnen Stationen/Bahnhöfen, Uhrzeiten, Verkehrsmitteln, Gleisen usw. Diese Reisedetails sollten als geordnete Liste (
<ol>
) vorliegen, da die Reihenfolge der Listenpunkte und das Gesamtverständnis als Listeneinheit hier von zentraler Bedeutung ist. -
Werden zu einer Fahrt detaillierte Informationen wie z. B. Stopps zwischen Start- und Zielpunkt zur Verfügung gestellt, so erfolgt die Präsentation dieser Zwischenhalte ohne unterstützende Semantik - entsprechend sollten die Zwischenhalte in Listenform vorliegen (geordnete Liste,
ol
, da die Reihenfolge der Listenpunkte wichtig ist).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.3.1c. HTML-Strukturelemente für Zitate,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.3.1d. Inhalt gegliedert,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung: In dem roten App-Infokasten gibt es einen leeren Absatz (
<p></p>
).
-
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.3.1e. Datentabellen richtig aufgebaut,
Details
- 1 Seite konform
- 1 Seite nicht konform
- 9 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Nutzt man die interaktive Karte, in dem man per Maus den Start- und Endpunkt einer Reise angibt, wird eine Ergebnisinformation generiert, die anzeigt, welche Optionen man für die Route hat. Diese Informationen umfassen zumeist mehrere Verbindungen, inklusive unterschiedlicher Reiselängen und Preisstufen. Diese Matrix an Optionen sind wiederum in Tabellenform ausgezeichnet, was grundsätzlich richtig ist.
- Allerdings wird der Tabellenfuss, das
tfoot
-Element zu Layoutzwecken benutzt und dort Interaktionsschaltflächen benutzt (Mehr/Weniger Details, Druckansicht), die nichts mit der Datentabelle selbst, oder ihren zugeordneten Tabellenköpfen zu tun haben. Entsprechend müssen diese Optionen aus der Struktur der Tabelle genommen werden. - Einzelne Verbindungen bieten aufklappbare Informationen an. Diese "Expando-Zeilen" müssen als Ausklappbereich umgesetzt werden, siehe 9.4.1.2 bei Seite 7.
- Allerdings wird der Tabellenfuss, das
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.3.1f. Zuordnung von Tabellenzellen,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.3.1g. Kein Strukturmarkup für Layouttabellen,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Anmerkung ohne Bewertung: Auf der rechten Seite, unterhalb der Überschrift "Zeichenerklärung" gibt es eine Layouttabelle. Das gleiche Layout kann allerdings auch einfacher mit CSS-Mitteln, wie z. B.
flex
odergrid
umgesetzt werden.
-
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.3.1h. Beschriftung von Formularelementen programmatisch ermittelbar,
Details
- 1 Seite konform
- 10 Seiten nicht konform
-
Details
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben. -
Im Fahrplanauskunfts-Widget sollten die Radio-Auswahlfelder, die bestimmen, ob die eingegebene Uhrzeit die Abfahrt- oder Ankunftszeit ist ("Ab", "An"), in einer Gruppe zusammengefasst und mit einem Gruppenbezeichner versehen werden: https://barrierefrei.link/radiogroup-en (englisch).
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Details
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Details
-
Einzelne Texteingabefelder, z. B. die Haltestellensuche sind von einem
<fieldset>
-Element umschlossen, das keinen Bezeichner hat. Eine Gruppierung eines einzelnen Elementes ergibt keinen Sinn und ist zu entfernen.Ferner sind im gleichen, links platzierten Widget
<span>
-Elemente gruppiert, was keinen Sinn ergibt, da dort keine direkte Dateneingabe möglich ist. Auch hier ist die Gruppierung per<fieldset>
zu entfernen.Nach angeforderter Auskunft erscheint ein select/Auswahlfeld, das mit "Alle außer ICE" vorausgewählt ist. Dieses Feld hat ebenfalls keinen zugänglichen/programmatischen Namen. Hier ist zur Behebung eine sichtbare Beschriftung via
<label>
zu empfehlen, die perfor
/id
mit dem Select assoziiert ist. -
Das Eingabefeld direkt unter der Überschrift "Haltestellensuche" hat keinen programmatischen Namen. Zur Behebung ist z. B. der genannten Überschrift eine
id
zu geben, und dann aus dem Eingabefeld heraus peraria-labelledby
-Attribut auf diese zu verweisen.Die einzelnen Textfelder zur Uhrzeit und zum Datum haben ebenfalls keine programmatisch ermittelbaren Namen. Auch hier ist (beim jeweils ersten Feld) eine
aria-labelledby
-Assoziation mit dem sichtbaren Label möglich. Für die "restlichen" Felder, die sich auf z. B. Minuten, den Monat oder das Jahr einer Eingabe beziehen, sollte mit dem Attributaria-label
und entsprechend aussagekräftigen Werten gearbeitet werden.
-
-
nicht konform
Details
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben. -
Im Fahrplanauskunfts-Widget sollten die Radio-Auswahlfelder, die bestimmen, ob die eingegebene Uhrzeit die Abfahrt- oder Ankunftszeit ist ("Ab", "An"), in einer Gruppe zusammengefasst und mit einem Gruppenbezeichner versehen werden: https://barrierefrei.link/radiogroup-en (englisch).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Klickt man im Fussbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das zwar einen
placeholder
, aber keinen programmatischen Namen hat. Dieser ist z. B. peraria-label
herzustellen (einplaceholder
gilt allerdings nicht als zulässige visuelle Beschriftung, siehe 9.3.3.2).Das gleiche Fehlermuster zeigt sich im "Newsletter"-Widget: auch dort ist das Texteingabefeld nur mit
placeholder
beschriftet. Behebung wie oben. -
Das nur mit
placeholder
beschriftete Suchfeld "PLZ oder Ort eingeben" in der Karte oben links hat keine programmatisch ermittelbare Beschriftung, da eine Textvorbelegung zu diesem Zweck nicht ausreichend. Andere Wege, wie z. B. einlabel
/for
-Konstrukt, oderaria-label
auf dem Textfeld, sind einzuschlagen.
-
-
Details
Keine Anmerkungen vorhanden
-
9.1.3.2. Sinnvolle Reihenfolge,
Details
- 11 Seiten nicht konform
-
Details
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken. -
Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden, siehe auch Details in 9.4.1.2.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken. -
Anmerkung ohne Bewertung: In den Kacheln wird im Screenreader NVDA jeweils eine unsichtbare Dachzeile vor der jeweiligen Überschrift vorgelesen.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Details
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Details
-
Die Textinhalte der visuellen Karte werden im Screenreader NVDA ohne informativen Bezug zueinander vorgelesen. Die Karte ist vor Screenreadern und Tastaturnutzenden zu verstecken (
aria-hidden="true"
undtabindex="-1"
auf dem Kartencontainer), da es eine dokumentierte alternative Nutzungsform gibt (die allerdings selbst auch fehlerhaft ist - siehe v .a. Prüfschritt 9.4.1.2).
-
-
nicht konform
Details
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
In der mobilen Ausprägung ist die geschlossene mobile Navigation technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell versteckt sind: Anstelle einer absoluten Positionierung im CSS bei gleichzeitiger
max-height
von0
ist das nicht ausgeklappte mobile Menü perdisplay: none
zu verstecken. -
Das geschlossene Suchfenster (genauer gesagt: der Such-Dialog), der über das Lupen-Icon zu erreichen ist, ist technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl es visuell versteckt sind: Anstelle einer absoluten Positionierung iist das nicht offene Suchdialog per
display: none
zu verstecken. -
Im Desktop-Design sind Hauptnavigationspunkte der zweiten Ebene technisch unzulässig versteckt, damit bei Screenreader- und Tastaturbedienung erreichbar, obwohl sie visuell verborgen sind: Anstelle einer absoluten Positionierung im CSS ist das nicht ausgeklappte mobile Untermenü per
display: none
zu verstecken.
-
-
nicht konform
Details
-
Unabhängig davon, welche Frage gerade visuell sichtbar ist, sind alle Fragen im Dokument erreichbar - sowohl bereits beantwortete, als auch zukünftige Fragen. Weiterhin werden im Lesemodus des Screenreaders auch die Fehlermeldungstexte vorgelesen, und das unabhängig davon, ob sich das Formular im Fehlerzustand befindet. Inaktive Fragen sind somit z. B. per CSS-Anweisung
display: none
zu verstecken (und auch aus der Gesamtheit der tastaturerreichbaren Elemente zu nehmen, siehe 9.2.4.3).
-
-
9.1.3.3. Ohne Bezug auf sensorische Merkmale nutzbar,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.3.4. Keine Beschränkung der Bildschirmausrichtung,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.3.5. Eingabefelder zu Nutzerdaten vermitteln den Zweck,
Details
- 1 Seite nicht konform
- 10 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
-
Dein Eingabefeldern sind jeweils folgende
autocomplete
-Attributwerte im HTML zu geben:- Name:
name
- E-Mail:
email
- Name:
-
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.1.4 Unterscheidbar
Prüfschritte
-
9.1.4.1. Ohne Farben nutzbar,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Der Farbhelligkeits- bzw. Konstrastabstand zwischen aktiven und inaktiven Paginationspunkten direkt unterhalb von Karussels/"Slidern" beträgt nur 1,6 zu 1 (Unterschied zwischen grau, inaktiv und rot, aktiv). Hier muss mindestens ein Wert von 3:1 erreicht werden.
-
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Gilt nur für niedrige Zoomstufen: Einzelne Linien werden allein über ihre Farbe kommuniziert, was bei Farbfehlsichtigkeit dazu führen kann, dass diese nicht auseinander zu halten sind. Ergänzend zur Farbe sollte im Netzdiagramm mit Beschriftungen zwischen den einzelnen Stationen, in der Nähe der gezeichneten Linie, gearbeitet werden, oder aber unterschiedlichen Schraffierungen/Texturen der einzelnen Linien.
-
-
konform
Details
-
Gibt man einen Startpunkt und einen Zielort ein, erscheint eine Tabelle von passenden Fahrten für diese Route. Unter dieser Tabelle ist eine Detailansicht der jeweiligen Fahrt, wobei es eine Legende darüber gibt, ob Fahrtinformationen oder Informationen zur Pünktlichkeit in den einzelnen Stationen vorliegen. Diese Information ist durch verschiedenfarbige Kreise gegeben. Bei Farbfehlsichtigkeiten wird diese Art der Informationsvermittlung zu einem Problem, entsprechend ist kann eine Behebung zum Beispiel durch andere Formen der aktuell nur bedeutungsgebenden Farben erfolgen (Kreis, Quadrat, Dreieck, usw.).
Ferner sind die Kreise/Indikatoren als inhaltstragende Bilder zu betrachten, aber als dekorative umgesetzt (siehe 9.1.1.1b).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Der Farbhelligkeits- bzw. Konstrastabstand zwischen aktiven und inaktiven Paginationspunkten direkt unterhalb von Karussels/"Slidern" beträgt nur 1,6 zu 1 (Unterschied zwischen grau, inaktiv und rot, aktiv). Hier muss mindestens ein Wert von 3:1 erreicht werden.
-
-
Details
Keine Anmerkungen vorhanden
-
9.1.4.2. Ton abschaltbar,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.1.4.3. Kontraste von Texten ausreichend,
Details
- 11 Seiten nicht konform
-
Details
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Die Platzhalter-Textfarbe im Texteingabefeld im Widget "Newsletter abonnieren" ist mit 4,2:1 unterhalb der Mindestgrenze von 4,5:1. Dies ist zu korrigieren. Ohnehin ist die Verwendung des
placeholder
-Attributs keine zulässige Beschriftung eines Formularfeldes, siehe 9.3.3.2.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Befinden sich Links in "Mehr-dazu"- oder "Info"-Infoboxen, so entsteht ein Textkontrast von nur 2,5:1 ausserhalb des Kontrastmodus und 1,8:1 innerhalb des Kontrastmodus gegen die graue Hintergrundfarbe (der Modus verschlechtert hier also die Kontraste!). Hier sind, wie bei allen Texten dieser Formatierung, mindestens 4,5:1 zu erreichen.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Die Platzhalter-Textfarbe im Texteingabefeld im Widget "Newsletter abonnieren" ist mit 4,2:1 unterhalb der Mindestgrenze von 4,5:1. Dies ist zu korrigieren. Ohnehin ist die Verwendung des
placeholder
-Attributs keine zulässige Beschriftung eines Formularfeldes, siehe 9.3.3.2.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Befinden sich Links in "Mehr-dazu"- oder "Info"-Infoboxen, so entsteht ein Textkontrast von nur 2,5:1 ausserhalb des Kontrastmodus und 1,8:1 innerhalb des Kontrastmodus gegen die graue Hintergrundfarbe (der Modus verschlechtert hier also die Kontraste!). Hier sind, wie bei allen Texten dieser Formatierung, mindestens 4,5:1 zu erreichen.
-
Die Platzhalter-Textfarbe im Texteingabefeld im Widget "Newsletter abonnieren" ist mit 4,2:1 unterhalb der Mindestgrenze von 4,5:1. Dies ist zu korrigieren. Ohnehin ist die Verwendung des
placeholder
-Attributs keine zulässige Beschriftung eines Formularfeldes, siehe 9.3.3.2.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
-
Details
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
-
Details
-
Da der Kontrastmodus der Rest des Webauftrittes hier nicht wirkt, werden im RVP-Interface keine Textkontraste erhöht und folgende Fehler bleiben bestehen:
- Hat eine Verbindung Verspätung, so wird das durch eine rote Schrift auf grau-transparentem Hintergrund angezeigt. Der Kontrast beträgt hier nur 2:1, sollte aber mindestens 4,5:1 betragen.
- Ist eine Verbindung fahrplangemäß, so wird das durch eine grüne Schrift auf grau-transparentem Hintergrund angezeigt. Der Kontrast beträgt hier nur 2:1, sollte aber mindestens 4,5:1 betragen.
-
Der Platzhaltertext unterhalb der Haltestellensuche ("Kein Start definiert"/"Kein Ziel definiert") ist mit 2,4:1 zu gering. Hier müssen mindestens 4,5:1 erreicht werden.
-
-
nicht konform
Details
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Der Link "EN" hat nur einen Kontrast von 2,1:1 auf seinen weißen Hintergrund. Mindestens 4,5:1 muss für Texte dieser Formatierung erreicht werden.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Noch bevor der Besucher die Gelegenheit hat, den Kontrast-Modus zu aktivieren und damit die Schriftkontraste zu verbessern, wird er mit dem Cookie-Dialog konfrontiert. Dort haben die Schaltflächen "Akzeptieren", "Ablehnen" und "Mehr Informationen" mit 3,3:1 einen zu schlechten Kontrast/Helligkeitsabstand. Hier muss jeweils mindestens 4,5:1 erreicht werden.
Im mobilen Layout kann der Kontrastmodus nur über die mobile Hauptnavigation erreicht werden, die aber andere Barrieren (siehe z. B. 9.4.1.2) aufweist und dessen je nach Hintergrundbild kaum sichtbar ist.
-
In dem aus der Navigation im Fussbereich ausgelösten Dialog "Cookie-Einstellungen" hat der Button "Einstellungen speichern" nur einen Textkontrast von 3,3:1, wobei mindestens 4,5:1 verlangt werden.
Der gleiche, zu schlechte Textkontrast gilt für die Linkfarbe des Links "Usercentrics Consent Management".
Das gleiche gilt ebenfalls für den Speichern-Button des Dialogs, der sich öffnet, wenn man im ersten Dialog ein Fragezeichen-Symbol klickt.
Der Link bzw. Registerreiter ist kaum sichtbar, seine hellgraue Textfarbe erzeugt nur einen Textkontrast von 1,4:1 zu weiß. Hier ist ebenfalls mindestens ein Wert von 4,5:1 zu erreichen.
-
Befinden sich Links in "Mehr-dazu"- oder "Info"-Infoboxen, so entsteht ein Textkontrast von nur 2,5:1 ausserhalb des Kontrastmodus und 1,8:1 innerhalb des Kontrastmodus gegen die graue Hintergrundfarbe (der Modus verschlechtert hier also die Kontraste!). Hier sind, wie bei allen Texten dieser Formatierung, mindestens 4,5:1 zu erreichen.
-
-
nicht konform
Details
-
Folgende Textkontrastfehler sind festzustellen, da der Kontrastmodus des Rests der Seite hier keine Wirkung zeigt:
- Die Textfarbe des "zurück"-Links kontrastiert nur mit 2,4:1 vor seinem Hintergrund. Hier müssen mindestens 4,5:1 erreicht werden.
- Die große Überschrift "Wie flexibel mobil bist du" kontrastiert nur mit 2,8:1 (oder schlechter) vor ihrem Hintergrund. Hier müssen mindetens 3:1 erreicht werden.
- Der gleiche schlechte Kontrast gilt auch für das Wort "SCROLL". Hier müssen aufgrund der Schriftgröße 4,5:1 erreicht werden.
- Die Dachzeile des Fragetexts erreicht nur 3,3:1, muss aber aufgrund der Schriftgröße 4,5:1 erreichen.
- Der Schriftzug "#mobilove", der über den Social Media Links steht, erreicht nur 3,1:1, muss aber aufgrund der Schriftgröße 4,5:1 erreichen.
-
-
9.1.4.4. Text auf 200 % vergrößerbar,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Die Texte (sowie die Scrollbar) im Start-Dialog werden abgeschnitten, da das
div
mit der Klasse.lightbox-content
(und seine 2 direkten Kindelemente) eine feste Breite von 770px (bzw. 477px) haben. Diewidth
-Werte sind aufauto
,100%
bzw.100vw
zu setzen. -
In der in Prüfschrittbeschreibung beschriebenen Zoom- und Einstellungsstufe kann es passieren, dass die Legende rechts/die Zeichenerklärung abgeschnitten wird, ohne eine Möglichkeit, die unsichtbaren Inhalte durch z. B. Scrollen sichtbar zu machen.
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.4.5. Verzicht auf Schriftgrafiken,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
-
Der Text "Verlängert bis 31.12.2022" im ersten Slide des Karussells (zumindest zum Zeitpunkt des Tests) ist eine Schriftgrafik und sollte in HTML-Text verwendet werden, mindestens aber im Alternativtext des Slide-Bildes vorkommen.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Anmerkung mit geringer Abwertung: Die Texte auf den Slides sollten HTML-Texte sein.
-
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.4.10. Inhalte brechen um,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Anmerkung ohne Bewertung, da der RVP Alternativinhalte hat: In der Prüfschrittbeschreibung beschriebenen Zoomstufe auf dem Desktop kann es dazu kommen,…
- …dass nach Schließen des Info-Dialogs beide "Panels" links und rechts nicht nur die Karte dahinter, sondern teilweise auch sich selbst überdecken. Beide Panels können allerdings eingeklappt werden. Allerdings sind die "Einklapp-Auslöser" klickbare
span
-Elemente, damit weder tastaturbedienbar oder -erreichbar, noch mit der richtigen Rolle ausgezeichnet (diese müsstebutton
sein). - …dass nach Klick auf einen Bahnhof sich der dann folgende Dialog so öffnet, dass er ausserhalb des Viewports, damit unbenutzbar ist. Eine Korrektur des Kartenausschnitts schließt ihn immer wieder automatisch, sodass die Funktion nicht zu bedienen ist. Zur Korrektur sollte das Verhalten implementiert werden, das erfolgt, sobald ein mobiles Betriebssystem im sog. "User Agent" erkannt wird.
- …dass nach Schließen des Info-Dialogs beide "Panels" links und rechts nicht nur die Karte dahinter, sondern teilweise auch sich selbst überdecken. Beide Panels können allerdings eingeklappt werden. Allerdings sind die "Einklapp-Auslöser" klickbare
-
Die Textinhalte im Start-Dialog werden abgeschnitten, siehe Anmerkung zu gleicher Seite in Prüfschritt 9.1.4.4.
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.1.4.11. Kontraste von Grafiken und grafischen Bedienelementen ausreichend,
Details
- 11 Seiten nicht konform
-
Details
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Details
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Details
-
Zum Besuch der Seite öffnet sich der Start-/Hilfe-Dialog. Sein Schließen-Button ist allerdings kaum wahrnehmbar (Kontrast von 1,4:1, Mindestwert ist hier 3:1).
Ebenfalls im Dialog ist der Farb-/Kontrastabstand zwischen Scrollbar-Anfasser und -Strecke mit einem Abstand von nur 2,4:1 zu gering. Der Mindestwert von 3:1 gilt hier ebenfalls.
-
-
nicht konform
Details
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Klappt man das Untermenü des Zahnradsymbols auf, wird offensichtlich, dass die dortigen Checkboxes sowohl im Normal- (
#F0F0F0
) , als auch Fokuszustand/angehaktem Zustand (#FF8300
) einen zugeringen Kontrast haben (1,1:1 im ersten, 2,5:1 im zweiten Fall. Mindestens 3:1 muss aber erreicht werden). -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
Die Hintergrundfarbe des
body
-Elementes ist nicht definiert, was bei einer Veränderung (User Stylesheet) durch die nutzende Person zu unleserlichen Kontrasten führen kann. -
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
Mobile Layouts: Bei Seiten mit großflächigen Hintergrundbildern (v. a. auf der Startseite) ist der Hamburger-Button teilweise sehr schlecht erkennbar. Das ist abhängig von den jeweiligen Hintergrundbildern.
-
-
nicht konform
Details
-
Die Checkboxen im Dialog "Cookie-Einstellungen", der aus dem Fussbereich der Seiten aktiviert werden kann, haben mit 2,5:1 einen zu schwachen Helligkeitsabstand/Kontrast (grün gegen weiß). Hier sind mindestens 3:1 zu erreichen. Der aktive Kontrastmodus ist hier nicht wirksam.
-
-
9.1.4.12. Textabstände anpassbar,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht konform
Details
-
Sobald man die Textabstände gemäß der Prüfschrittbeschreibung anpasst, wird die "Weiter"-Schaltfläche abgeschnitten und fast unbenutzbar. Hintergrund ist hier die zu geringe
min-height
im CSS desform
-Elementes mit der ID "question".
-
-
9.1.4.13. Eingeblendete Inhalte bedienbar,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
In der Karte unterhalb der Überschrift "Die 9 Touren im Überblick" finden sich diverse Markierungen. Ein Hover-Event über diese Markierungen löst ein so genanntes "Tooltip"-Widget aus, dass aber eine der drei Bedingungen dieses Prüfschrittes nicht erfüllt: Es lässt sich nicht "offen" bzw. eingeblendet halten, wenn man mit dem Mauszeiger über das durch den Marker ausgelöste Tooltip fährt. Zur Korrektur ist ein alternatives Nutzungsmuster zum Tooltip-Einsatz empfehlenswert, so genannte "Toggle Tips". Mehr Details dazu auf englisch: https://barrierefrei.link/toggletips .
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Details
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Inhalte, die bei Fokuserhalt automatisch eingeblendet werden, müssen schließbar sein, ohne den Fokus zu verschieben. Z.B. mithilfe der
ESC
-Taste. (vergleiche https://barrierefrei.link/esc-tooltip-en - engliscj).
-
-
Details
Keine Anmerkungen vorhanden
-
-
9.2.1 Per Tastatur zugänglich
Prüfschritte
-
9.2.1.1. Ohne Maus nutzbar,
Details
- 11 Seiten nicht konform
-
Details
-
Die Radio-Buttons "ab" und "an" im Fahrplanauskunft-Widget werden aus unbekannter Ursache bei reiner Tastaturbedienung übersprungen. Dies ist abzustellen.
-
Der "Weitere laden"-Button unterhalb der Kacheln ist aus unbekannten Gründen nicht tastaturerreich- und -bedienbar. Diese Funktionen sind herzustellen.
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Dass der Kartenausschnitt per Pfeiltasten auf der Tastatur veränderbar ist, sollte dokumentiert sein, z. B. in einem Absatz unter oder über dem Karten-Widget.
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Details
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Details
-
Wählt man einen Start- und Zielpunkt, aktiviert dann "Auskunft anfordern" erscheint ein Dialog, in dem die für diese Route gefundenen Verbindungen tabellarisch gelistet werden. Die Optionentabelle sowie die einzelnen Verbindungsdetails lassen sich auf- und zuklappen (mit der Maus), die entsprechenden Schaltflächen sind aber nicht tastaturerreich- und -bedienbar. Dies muss mit mindestens
tabindex="0"
auf einzelnen interaktiven Elementen sichergestellt werden. Am einfachsten ginge dies durch Verwendung des<button>
-Elementes, das auch gleich die verwandten und in 9.4.1.2 angesprochenen Rollen-Probleme lösen würde.Die gleiche Problemstellung findet sich im Panel auf der rechten Seite: Der Hilfs-Dialog-Aktiviator ist ebenfalls nicht tastaturerreich- und -bedienbar. Lösung wie oben skizziert.
-
Die Kartenansicht ist nicht per Tastatur verschieb- oder zoombar. Zur Behebung sollten die entsprechenden Kontrollfelder mindestens mit
tabindex="0"
versehen werden, noch besser aber in<button>
-Elemente umgewandelt werden.
-
-
nicht konform
Details
-
Klickt man auf ein graues Marker-Icon auf der rechten Seite, wird die eingegebene Station auf einer Karte dargestellt. Der Schließen-Button ("X"), um diese Karte wieder auszublenden, ist ein klickbares
span
-Element, damit nicht tastaturerreich- und -bedienbar (und es hat die falsche Rolle - siehe 9.4.1.2).Ebenfalls in diesem Zustand sind als Kartenkontrollfelder klickbare
img
-Elemente im Einsatz, die nicht tastaturerreichbar sind.In beiden Fällen ist zur Korrektur mindestens das Attribut
tabindex="0"
zu vergeben, besser wäre aber jeweils der Einsatz eines<button>
-Elementes, da zusätzlich auch die falsche Rolle für interaktive Elemente verwendet wurde (siehe 9.4.1.2). -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Die im Rechtsklickmenü auf der Karte befindlichen Optionen (Start und Ziele setzen, Zoomen usw.), sowie die Aktivierung des Menüs an sich sind nicht per Tastatur möglich. Es gibt zwar im "Hamburger-Menu" einen alternativen Weg der Angabe von Start und Ziel ("Route"), allerdings ist der "Hamburger"-Auslöser weder tastaturerreichbar noch -bedienbar.
Grundsätzlich ist die Verkehr.NRW-Karte unzugänglich und übermäßig komplex, siehe 9.4.1.2. Die Nennung der Barrieren hat deswegen keinen Anspruch auf Vollständigkeit und wird auch durch die eigene Barrierefreiheitserklärung des Kartenwidgets ergänzt.
-
Die einzelnen Baustellen-Einträge auf der Karte sind per Maus anwählbar (es öffnet sich ein Popup mit erweiterten Informationen zur Baustelle). Diese einzelnen Einträge sind nicht per Tastatur-Erreichbar und müssen, neben der richtigen Rolle (siehe 9.4.1.2) mindestens via
tabindex="0"
tastaturerreichbar gemacht werden. -
Der Kartenausschnitt ist nur per Interaktion per Zeigegerät verschiebbar, aber nicht per Tastatur. Zur Behebung sollten entsprechend funktionale Schaltflächen auf der Karte etabliert werden.
-
Wesentliche Funktionen für die Routenplanung auf der Karte sind nur per Mausbedienung (konkret: Rechtsklick) erreichbar. Dies ist zu korrigieren durch immer sichtbare oder durch einen Ausklapp-Bereich sichtbar zu machende Kartenfunktionen. Analog Seite 7 muss auch für diese Routenplanung eine reine formulargestütze Alternative für die dort gelisteten Funktionen existieren (oder eine bereits existierende verlinkt werden).
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist nicht tastaturerreich- und -bedienbar, zudem mit der falschen Rolle umgesetzt (siehe 9.4.1.2).
-
-
nicht konform
Details
-
Der "Zurück"-Link ist nicht tastaturerreichbar, da er kein
href
-Attribut hat.
-
-
9.2.1.2. Keine Tastaturfalle,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.2.1.4. Tastatur-Kurzbefehle abschaltbar oder anpassbar,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Anmerkung mit geringer Abwertung: Das Drücken der "F"-Taste führt zu einem Wechsel in den Vollbildmodus. Dieses Verhalten sollte im Start-Hilfe-Dialog dokumentiert und idealerweise anpassbar gemacht werden (z. B. "F" und Modifikatortaste statt nur "F"), da es zu Konflikten mit Screen-Reader-Belegungen der gleichen Taste kommen kann (in NVDA bedeutet ein Aktivieren der Taste "F" beispielsweise den Sprung in das nächste Formular).
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
-
9.2.2 Ausreichend Zeit
Prüfschritte
-
9.2.2.1. Zeitbegrenzungen anpassbar,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.2.2.2. Bewegte Inhalte abschaltbar,
Details
- 7 Seiten konform
- 4 Seiten nicht konform
-
Details
-
Die Slider-Wechsel im oberen Teil auf der Startseite beginnen automatisch, laufen länger als fünf Sekunden sowie endlos und sind auch nicht abschaltbar. Eine Funktion zum Abstellen dieser (recht dominanten) Animation ist zu gewährleisten, z. B. mithilfe einer Schaltfläche mit Pause-Funktion. Diese muss eindeutig sein und deutlich sichtbar am Seitenbeginn oder im direkten Kontext des bewegten Inhalts platziert sein.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Für das automatisch startende und laufende Karussell unterhalb der Überschrift "Einfach weiter durch NRW" (Seite 5) bzw. "Zukunftsvision vernetzte Mobilität" (Seite 10) gilt das gleiche wie bezüglich der Animation auf der Startseite (Seite 1): Eine Möglichkeit zur Unterbrechung der Animation muss bereitgestellt werden (Details dazu in den Anmerkungen zu Animationen in Seite 1 und 11).
-
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Für das automatisch startende und laufende Karussell unterhalb der Überschrift "Einfach weiter durch NRW" (Seite 5) bzw. "Zukunftsvision vernetzte Mobilität" (Seite 10) gilt das gleiche wie bezüglich der Animation auf der Startseite (Seite 1): Eine Möglichkeit zur Unterbrechung der Animation muss bereitgestellt werden (Details dazu in den Anmerkungen zu Animationen in Seite 1 und 11).
-
-
nicht konform
Details
-
Die Animationen innerhalb des Herz-Vektors im oberen Teil auf der Seite beginnen automatisch, laufen länger als fünf Sekunden sowie endlos und sind auch nicht abschaltbar. Eine Funktion zum Abstellen dieser Animation ist zu gewährleisten, z. B. mithilfe einer Schaltfläche mit Pause-Funktion. Diese muss eindeutig sein und deutlich sichtbar am Seitenbeginn oder im direkten Kontext des bewegten Inhalts platziert sein.
Das gleiche gilt, wenn auch schwächer (da die Animation flächig kleiner ist) für die "Scroll-Animation" mit dem nach unten wandernden Pfeil.
-
-
-
9.2.3 Anfälle
Prüfschritte
-
9.2.3.1. Verzicht auf Flackern,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
-
9.2.4 Navigierbar
Prüfschritte
-
9.2.4.1. Bereiche überspringbar,
Details
- 11 Seiten nicht konform
-
Details
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Der
nav
-Bereich um das Zahnrad-Symbol hat den zugänglichen Namen "Origin options menu" - dies ist zu übersetzen. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die komoot-Karteneinbindung geschieht per iframe, der allerdings keinen zugänglichen Namen hat. Per title-Attribut ist dieses zu gewährleisten, z. B. "Wanderstandorte".
-
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Details
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Details
-
Seitenbereiche sind unzureichend mit Bereichsüberschriften erschlossen, Sprunglinks nicht existent und der Landmarken-Einsatz beschränkt sich auf den doppelten fehlerhaften Einsatz von
main
. Viel eher kann man die visuelle Karte als Hauptbereich und die "Seitenwidgets" links und rechts als generische Gruppen ansehen und auszeichnen (Details: https://barrierefrei.link/group-en - englisch).
-
-
nicht konform
Details
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Karteneinbindung geschieht per
iframe
, der allerdings keinen zugänglichen Namen hat. Pertitle
-Attribut ist dieses zu gewährleisten, z. B. "Baustellenkarte und visueller Routenplaner für NRW". -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Im Fussbereich gibt es einige Navigationslandmarken, die keinen zugänglichen Namen haben, deswegen nicht zu unterscheiden sind. Zur Behebung ist ihnen je ein zugänglicher Name zu geben (wie es bereits bei der Hauptnavigation und der Navigation wichtiger Seiten passiert ist). Eine Verschachtelung von Headern und Footer im Footer führt nicht dazu, dass weitere ARIA-Landmarken entstehen, bringt keinen semantischen Gewinn und kann daher ausgebaut werden.
-
Anmerkung ohne Bewertung: Ein Sprunglink zum Hauptinhalt ist zwar implementiert, allerdings fehlerhaft (erreicht wird immer der Hauptinhalt der Startseite). Weitere Sprungmarken zu anderen Bereichen fehlen. Ferner ist z. B. der Footer nicht per Bereichsüberschrift erschlossen (siehe dazu Vorschlag in 9.1.3.1a) und die Landmarken sind fehlerhaft umgesetzt (siehe andere Anmerkung).
-
Der Sprunglink "Zum Seiteninhalt springen" springt nicht zum Seiteninhalt im gleichen Dokument (das ist die Absicht dieser Links), sondern immer zum Hauptinhalt auf der Startseite. Erklärung ist, dass der Link
./#go-to-content
(aufgelöst nach: https://www.mobil.nrw/#go-to-content) anstatt#go-to-content
lautet. -
Die Suchfunktion sollte in einem eigenständigen Bereich (z.B.
role="search"
) positioniert werden. -
Der iFrame des YouTube-Videos hat den Titel "#mobilove-Tutorial: Mobilstationen sind #mobilove!", kündigt damit ein Tutorial/eine Anleitung an, die das Video aber nicht liefert. Es ist eher ein Imagefilm, dessen Inhalte auch in nahen Absätzen ausreichend beschrieben werden. Die Empfehlung: Änderung des Videotitels in "Imagefilm #mobilove".
-
-
nicht konform
Details
-
Auf dieser Seite gibt es keinen Hauptinhalt, die entsprechenden Inhalte sind stattdessen im Fußbereich (
footer
-Landmarke) untergebracht. Für die Fragen und ihr Formular ist stattdessen dasmain
-Element zu nutzen.Eigentliche Footer-Inhalte sind am ehesten die Social-Media-Links zu mobilove.
-
Es gibt mehrere Navigations-Landmarken. Zum einen im Kopfbereich, der aber nur aus einem Link zur Hauptseite besteht, zum anderen um den Absende-Button herum. Mindestens letztgenannter ist zu entfernen.
-
-
9.2.4.2. Sinnvolle Dokumenttitel,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Der Dokumententitel lautet "Verlehr-NRW - mobil.nrw" und ist damit ein wenig zu generisch. Eine bessere Wahl wäre "Aktuelle Verkehrsinformationen - mobil.nrw", was auch dem sonstigen Schema der Dokumententitel (im Zusammenspiel mit den Hauptüberschriften auf der jeweiligen Seite) entsprechend würde.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.2.4.3. Schlüssige Reihenfolge bei der Tastaturbedienung,
Details
- 11 Seiten nicht konform
-
Details
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden und das gleiche gilt auch für die Tastaturbedienung ohne Screenreader (interaktive Elemente in Slides, die nicht sichtbar sind, sind tastaturerreichbar - damit unsichtbare Fokushaltepunkte). Siehe dazu 9.1.3.2 und 9.4.1.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Details
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Details
-
Besucht man die Seite in einem neuen privaten Fenster, bzw. ohne im Vorfeld den Cookie-Banner weggeklickt zu haben, startet die RVP-Applikation mit zwei offenen Dialogen gleichzeitig. Das führt zu zwei Problemen:
- Der Tastaturfokus startet nicht im "obersten" Dialog, dem Cookie-Dialog. Es ist zu erkennen, dass der Fokus im Start-/Hilfe-Dialog dahinter ist. Behebung: Der Tastaturfokus muss in/auf den Cookie-Dialog gesetzt werden, sofern er existiert.
- Selbst wenn man es schafft, den Tastaturfokus in den Cookie-Dialog zu bekommen, löst ein Schließen dieses Dialogs kein aktives Fokusmanagement aus, dass den Tastaturfokus in den dahinterliegenden Dialog versetzt. Das ist zu gewährleisten.
-
-
nicht konform
Details
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
Anmerkung mit geringer Abwertung: Die Tastaturbedienung der Suchfelder und der umgebenden Schaltflächen ist unnachvollziehbar. Nachdem die Suchfelder den Tastaturfokus erhalten haben, wird der Fokus nicht etwa auf die fokussierbaren Elemente unterhalb gesetzt, sondern die Marker- und Zahnradsymbole oberhalb. Die die technische Fokusreihenfolge ist der visuellen Reihenfolge der Elemente anzugleichen.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Suchdialog bzw. das geschlossene mobile Hauptmenü und Untermenüpunkte in der Desktop-Ausprägung sind unzulässig versteckt, sorgen deswegen für eine verwirrende Tastaturbedienung im Kopfbereich der Seite - siehe Prüfschritt 9.1.3.2.
-
Aktiviert man den Cookie-Einstellungen-Dialog (erreichbar per "Cookie-Einstellungen"-Link im Fussbereich), so wird der Tastaturfokus nach Öffnen des Dialogs nicht auf oder in ihn versetzt. Stattdessen verbleibt der Fokus "hinter" dem Dialog und sogar der grauen Abdunklung des Interfaces. Ein Versetzen muss gewährleistet werden. Weiterhin muss der Fokuszugang bei offenem Dialog auf ihn beschränkt werden (in ihm "gefangen" sein) und beim Schließen des Dialogs muss der Fokus wieder zurück zum ursprünglichen Auslöser wandern.
-
Links innerhalb der Marker-Popups auf der Karte sind nicht intuitiv tastaturerreichbar und -bedienbar. Hier muss nach Öffnen eines solchen Popups aktives Fokusmanagement erfolgen und der Tastaturfokus per
.focus()
-Methode in das Popup versetzt werden.
-
-
nicht konform
Details
-
Unabhängig davon, welche Frage gerade visuell sichtbar ist, sind alle Fragen im Dokument erreichbar - sowohl bereits beantwortete, als auch zukünftige Fragen (siehe 9.1.3.2). Weiterhin werden im Lesemodus des Screenreaders auch die Fehlermeldungstexte vorgelesen, und das unabhängig davon, ob sich das Formular im Fehlerzustand befindet. Inaktive Fragen sind somit z. B. per CSS-Anweisung
display: none
zu verstecken (und auch aus der Gesamtheit der tastaturerreichbaren Elemente zu nehmen, da sonst eine Vielzahl von unsichtbaren Fokushaltepunkten erzeugt werden).
-
-
9.2.4.4. Aussagekräftige Linktexte,
Details
- 5 Seiten konform
- 1 Seite nicht konform
- 5 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Aus dem Link "postialischem Weg" wird nicht ausreichend deutlich, dass auf ein PDF verlinkt wird. Dies ist im Linktext nachzureichen, z. B. durch Umwandlung in "postialischem Weg (PDF)". Ein
title
-Attribut mit dieser Information ist zwar vorhanden, genügt diesem Prüfschritt allerdings nicht.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.2.4.5. Alternative Zugangswege,
Details
- 11 Seiten konform
Details
Keine Anmerkungen vorhanden
-
9.2.4.6. Aussagekräftige Überschriften und Beschriftungen,
Details
- 1 Seite konform
- 10 Seiten nicht konform
-
Details
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Die zugänglichen Namen der einzelnen Punkte der Karusell-Pagination ist "Go to slide 3" (beispielsweise). Diese Namen sind zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Die zugänglichen Namen der einzelnen Punkte der Karusell-Pagination ist "Go to slide 3" (beispielsweise). Diese Namen sind zu übersetzen.
-
Die programmatische Beschriftung der Karussell-Bläterpfeile lautet "Next Slide" und "Previous Slide". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Details
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Details
-
Anmerkung ohne Bewertung: Die wenigen mit der korrekten Rolle umgesetzten Beschriftungen von Kontrollelementen (siehe 9.4.1.2) sowie die Überschriften sind aussagekräftig.
-
-
nicht konform
Details
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
Die zugänglichen Namen der einzelnen Punkte der Karusell-Pagination ist "Go to slide 3" (beispielsweise). Diese Namen sind zu übersetzen.
-
Die Kontrollfelder in der Karte, die im Zusammenhang mit Zoomen stehen, sind englisch beschriftet ("Zoom in", "Zoom out"). Dies ist zu übersetzen.
-
Die programmatische Beschriftung der Karussell-Bläterpfeile lautet "Next Slide" und "Previous Slide". Dies ist zu übersetzen.
-
Überschriften in Versalien werden häufig wie Abkürzungen vorgelesen (also "S.T.E.L.L.E.N" statt "stellen"). Hintergrund ist hier, dass die Großschrift so im HTML-Dokument vorkommt. Zur Behebung sind die Überschriften in Klein-/Großschrift, entsprechend Grammatik-Regeln, zu schreiben und nur per CSS als Versalien zu formatieren:
text-transform: uppercase
. Bei einem Teil der Überschriften auf der Seite erfolgt das bereits, der andere Teil ist anzugleichen.
-
-
nicht konform
Details
-
Der zugängliche Name des Auslösers für die mobile Navigation ("Hamburger-Icon") ist "Toggle Navigation". Dies ist einerseits zu übersetzen, andererseits ist die Nutzung des Attributs
aria-expanded
herzustellen (aktuell bleibt es immer auffalse
, siehe 9.4.1.2). Ist das Attribut instandgesetzt, kommuniziert es, ob das Menü offen oder geschlossen ist und der aussagekräftige Name des Auslösers kann schlicht "Navigation" lauten. -
Der zugängliche Name des Sucheingabefeldes im Suchfenster ist "Search". Dies ist zu übersetzen.
-
-
9.2.4.7. Aktuelle Position des Fokus deutlich,
Details
- 11 Seiten nicht konform
-
Details
-
Alle Links unterhalb der orangefarbenen Schaltflächen im Cookie-Dialog haben keine Fokushervorhebung (das Usercentrics-Logo, der Textlink "Impressum", der Textlink "Datenschutzbestimmungen"). Ursache ist hier die CSS-Anweisung
.usercentrics-button #uc-banner-modal :focus, .usercentrics-button #uc-central-banner-modal :focus { outline: 0; }
und.usercentrics-button button:focus, .usercentrics-button .uc-btn:focus, .usercentrics-button a:focus { outline: none; }
. Sie sind zu entfernen und mit beispielsweise ähnlichen Fokusstilen wie die der Schaltflächen zu ersetzen. -
Anmerkung ohne Bewertung: Als Fokushervorhebung des Suchfeldes nach öffnen des Suchdialogs kann zwar der blinkende Textcursor gelten, dennoch ist empfehlenswert, zusätzlich mit einer Umrandung im Fokuszustand zu arbeiten (vergleiche Fokushervorhebung der Eingabefelder auf Seite 6).
-
-
Details
-
Im "Fahrplanauskunft"-Widget haben die Radio-Buttons "Ab" und "An" (Kontext: Uhrzeit) jeweils keine Fokushervorhebung (und sie sind grundsätzlich auch nicht tastaturerreich- und bedienbar, siehe 9.2.1.1). Ratsam zur Behebung wäre eine Nutzung des bereits im Widget etablierten Fokus-Stils (rote Umrandung), sowie eine grundsätzliche Ertüchtigung, was die Tastaturerreichbarkeit der Buttons angeht
-
Anmerkung ohne Bewertung: Als Fokushervorhebung des Eingabefelds unterhalb von "Newsletter abonnieren" kann zwar der blinkende Textcursor gelten, dennoch ist empfehlenswert, zusätzlich mit einer Umrandung im Fokuszustand zu arbeiten (vergleiche Fokushervorhebung der Eingabefelder auf Seite 6).
-
Die "Mehr erfahren"-Links im Karussell haben keine Fokushervorhebung. Grund dafür ist die ungültige CSS-Anweisung für den Fokuszustand
1px auto -webkit-focus-ring-color
(die erstaunlicherweise noch nicht mal in Webkit-Browsern funktioniert). Hier ist der System-Fokuskranz zuzulassen oder für eine ausreichend kontrastierende benutzerdefinierte Gestaltung zu sorgen (z. B. solide Outline). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Der Fokuszustand der Auswahlfelder ist formal konform, aber dennoch kaum zu sehen. Besser wäre es, wenn sich neben der Farbe auch die Dicke der Umrisslinien im Fokuszustand ändern würde.
- Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrw -
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Einzelne Punkte oder Cluster auf der Komoot-Karte sind nicht tastaturerreichbar, haben folgerichtig auch keine Fokusverhervorhebungen. Auch der Link "Ganze Collection bei komoot ansehen" hat keine Fokushervorhebung, hier ist zumindest der Systemfokuskranz wiederherzustellen.
Weiterhin erzeugt die Fokushervorhebung der Links "Maplibre" und "© komoot" unten rechts auf der Karte einen nur unzureichenden Kontrast von 1,6:1 vor dem hellgrünen Hintergrund. Hier sind mindestens 3:1 zu erreichen.
- Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrw -
Details
-
Die Checkbox, um die Datenschutzhinweise vor Formularversand zu akzeptieren, besitzt keine Fokushervorhebung, da im CSS für den Fokus-Zustand die
outline
auf0
gesetzt wird. Dies ist zu entfernen. - Siehe auch Anmerkungen zu allen Seiten
-
-
Details
-
Anmerkung ohne Bewertung: Links im Start-/Hilfe-Dialog sind nur durch einen sehr dünne/schwachen Umriss gekennzeichnet, wenn sie sich im Fokus-Zustand befinden. Hier wäre ein benutzerdefinierter Fokusstil besser, der mit soliden Umrandungen arbeitet, oder auch der Standard-Fokusstil des Browsers, d. h. ein Entfernen jedwegen benutzerdefinierten Stils.
-
Der Schließen-Button des Start-/Hilfe-Dialogs hat keinen Fokusstil, da dieser per
.fancybox-button:focus { outline: none: }
unterdrückt wird. Hier wäre ein benutzerdefinierter Fokusstil besser, der mit soliden Umrandungen arbeitet, oder auch der Standard-Fokusstil des Browsers, d. h. ein Entfernen jedwegen benutzerdefinierten Stils. -
Anmerkung ohne Bewertung in diesem Prüfschritt: Einige Schaltflächen, darunter sowohl die klickbaren Bahnhöfe, die sich nach ihrer Aktivierung öffnenden Kontextmenüs, interaktive Elemente im Verbindungsfenster nach Angabe eines Start- und Zielorts (u. a. "Auf- und Zuklapper") und interaktive Elemente im rechtsseitigen Panel, u. a. auch die Schaltfläche "Hinweise zur Bedienung", sind mit der falschen semantischen Rolle umgesetzt (siehe 9.4.1.2), deswegen weder tastaturbedien- noch -erreichbar (siehe 9.2.1.1) - und folgerichtig auch ohne Fokushervorhebung.
-
Gibt man einen Start- und Zielort an, klickt dann auf "Auskunft anfordern", erscheint dann das Verbindungsfenster mit Verbindungsoptionen und einem Auswahlfeld (es hat weder eine programmatische, noch visuelle Beschriftung), das initial den Wert "Alle außer ICE" hat. Dieses Auswahlfeld hat keine Fokushervorhebung. Hier wäre ein benutzerdefinierter Fokusstil besser, der mit soliden Umrandungen arbeitet, oder auch der Standard-Fokusstil des Browsers, d. h. ein Entfernen jedwegen benutzerdefinierten Stils bzw. seiner Unterdrückung per CSS.
- Siehe auch Anmerkungen zu allen Seiten
-
-
nicht konform
Details
-
Alle Schaltflächen und Checkboxes innerhalb des Fahrplanauskunft-Widgets haben keine Fokushervorhebung durch die CSS-Anweisung
outline: none;
im Selektor.nsk-wrap #nskContentContainer button:focus, .nsk-wrap #nskContentContainer input:focus
. Diese Unterdrückung ist zu entfernen und mindestens der Fokus-Systemkranz zu verwenden, alternativ auch der benutzerdefinierte Fokusstil für Eingabefelder (rote Umrandung). -
Wenn sich der Button mit dem Pfeil nach oben und dem Pfeil nach unten (der Start und Ziel tauscht) im Fokuszustand befindet, wird er unsichtbar. Dies ist abzustellen.
-
Klappt man das Untermenü des Zahnradsymbols auf, wird offensichtlich, dass die dortigen Checkboxes keinen Fokusstil besitzen. Ein ausreichend kontrastierender (d. h. mindestens 3:1 zu umgebenden Farben und dem Normalzustand) ist nachzureichen.
- Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Die Baustellen auf der Verkehrsinfo-Karte sind klickbar, aber nicht tastaturerreichbar und -bedienbar (siehe 9.2.1.1). Folgerichtig haben sie keine Fokushervorhebung.
-
Anmerkung ohne Bewertung in diesem Prüfschritt: Die "Hamburger"-Schaltfläche in der Verkehrinfo-Karte ist mit der falschen Rolle umgesetzt (
complementary
, also<aside>
stattbutton
, deswegen nicht tastaturerreich- und bedienbar (siehe 9.2.1.1 und 9.4.1.2). Folgerichtig hat sie keine Fokushervorhebung. - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrw -
nicht konform
Details
-
Die Radio-Buttons in der #mobilove-Umfrage haben keine Fokushervorhebung, da sie als autordefiniert gestaltete Radiobuttons umgesetzt wurden. Hier ist beim CSS-Selektor zum Fokusstil folgendes zu beachten (englisch): https://barrierefrei.link/input-style-en .
- Siehe auch Anmerkungen zu allen Seiten
-
-
-
9.2.5 Eingabemodalitäten
Prüfschritte
-
9.2.5.1. Alternativen für komplexe Zeiger-Gesten,
Details
- 2 Seiten konform
- 4 Seiten nicht konform
- 5 Seiten nicht anwendbar
-
Details
-
Die Slides im Karussell im Kopfbereich wechseln automatisch, bzw. durch eine Zeigergeste (wischen nach links und nach rechts). Es sind ausdrückliche Kontrollfelder für den Sliderwechsel bereitzustellen.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
In Bezug auf die Verschiebung des Kartenausschnitts, die nur per Geste erfolgt: Siehe 9.2.1.1.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
In Bezug auf die Verschiebung des Kartenausschnitts, die nur per Geste erfolgt: Siehe 9.2.1.1.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
In Bezug auf die Verschiebung des Kartenausschnitts, die nur per Geste erfolgt: Siehe 9.2.1.1.
-
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
9.2.5.2. Zeigergesten-Eingaben können abgebrochen oder widerrufen werden,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.2.5.3. Sichtbare Beschriftung Teil des zugänglichen Namens,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Alle in 9.4.1.2 genannten Kontrollelemente mit der falschen Rolle (z. B. Umsetzung eines Buttons mit
<span>
verstoßen gegen diesen Prüfschritt, da zwar eine sichtbare Beschriftung vorliegt, aber kein zugänglicher Name.
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.2.5.4. Alternativen für Bewegungsaktivierung,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.3.1 Lesbar
Prüfschritte
-
9.3.1.1. Hauptsprache angegeben,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
In diesem Dokument fehlt die Hauptsprache. Zur Korrektur ist, ähnlich der anderen Seiten der Auswahl im
html
-Element perlang
-Attribut der Wertde
oderde-DE
anzugeben.
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.3.1.2. Anderssprachige Wörter und Abschnitte ausgezeichnet,
Details
- 2 Seiten konform
- 4 Seiten nicht konform
- 5 Seiten nicht anwendbar
-
Details
-
Die Überschrift "Mobilove-Story: Date'n'Roll" sollte mithilfe von z. B.
<span lang="en" />
als englischsprachig gekennzeichnet werden.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Die Begriffe "Share" bzw. "Sharing", "Car", "Airport Shuttle" und "Bike" sollten mithilfe von z. B.
<span lang="en" />
als englischsprachig gekennzeichnet werden.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Der Begriff "Collection" sollte mithilfe von z. B.
<span lang="en" />
als englischsprachig gekennzeichnet werden.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht konform
Details
-
Wenn das Fahrplanauskunfts-Widget per Aktivierung des "EN"-Links auf Englisch umgestellt wird, sollte dies für das Widget - am besten im Element mit der Klasse
.nsk-wrap-div
perlang
-Attribut (Werten
) ausgezeichnet werden.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Die Begriffe "Carsharing", "Sharing" und "On Demand" sollten mithilfe von z. B.
<span lang="en" />
als englischsprachig gekennzeichnet werden.
-
-
nicht konform
Details
-
Die Begriffe "On Demand", "E-Scooter" und "Carsharing" (Frage 3 , 6 und 8) sollten mithilfe von z. B.
<span lang="en" />
als englischsprachig gekennzeichnet werden.
-
-
-
9.3.2 Vorhersehbar
Prüfschritte
-
9.3.2.1. Keine unerwartete Kontextänderung bei Fokus,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.3.2.2. Keine unerwartete Kontextänderung bei Eingabe,
Details
- 5 Seiten konform
- 6 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.3.2.3. Konsistente Navigation,
Details
- 11 Seiten konform
Details
-
Anmerkung ohne Bewertung: Auf den Seiten 7 und 11 fehlt die Hauptnavigation, allerdings sind beide Seiten auch in einem anderen visuellen Design/mit abweichender Markenführung gestaltet.
-
9.3.2.4. Konsistente Bezeichnung,
Details
- 11 Seiten konform
Details
Keine Anmerkungen vorhanden
-
-
9.3.3 Hilfestellung bei der Eingabe
Prüfschritte
-
9.3.3.1. Fehlererkennung,
Details
- 1 Seite konform
- 4 Seiten nicht konform
- 6 Seiten nicht anwendbar
-
Details
-
Sendet man das Fahrplanauskunft-Widget ohne Eingabe von Start und Ziel ab, erscheint zwar eine Fehlermeldung, diese ist aber weder programmatisch ermittelbar (
aria-describedby
), noch wird die Fehlermeldung über eine Live-Region ausgegeben.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Beim Nicht-Ausfüllen der Start- und Zielfelder einer Route erscheint zwar eine Fehlermeldung in einem visuellen Dialog, diesem fehlt aber Dialogsemantik (siehe 9.4.1.2) und die für eine asynchrone Fehlermeldung wie diese nötige Rolle
alertdialog
.
-
-
nicht konform
Details
-
Fehlermuster wie Fahrplanauskunft-Widget, Seite 1.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht konform
Details
-
Bei der Nicht-Auswahl eines Radio-Buttons erscheint zwar eine Fehlermeldung, diese ist aber nicht programmatisch ermittelbar. Zur Behebung ist folgender Ansatz zu wählen: https://barrierefrei.link/fieldset-radio-en (englisch).
-
-
9.3.3.2. Beschriftungen von Formularelementen vorhanden,
Details
- 1 Seite konform
- 10 Seiten nicht konform
-
Details
-
Das Texteingabefeld im Newsletter-Widget, also unterhalb von "Newsletter abonnieren" ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren. -
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren. -
Im Fahrplanauskunft-Widget sind die Felder "Start", "Ziel" nur durch Vorbelegungen (
placeholder
) beschriftet. Dies ist keine gültige und persistierende Beschriftungsart. Zur Behebung ist die Beschriftung per<label>
undfor
/id
zu wählen.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Das Texteingabefeld im Newsletter-Widget, also unterhalb von "Newsletter abonnieren" ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren. -
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Details
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Details
-
Das Auswahlfeld/Select, bei dem der Wert "Alle außer ICE" voreingestellt ist (nach einer angeforderten Auskunft) hat weder eine direkte noch indirekte Beschriftung.
-
-
nicht konform
Details
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren. -
Im Fahrplanauskunft-Widget sind die Felder für Start und Ziel nur durch Vorbelegungen (
placeholder
) beschriftet. Dies ist keine gültige und persistierende Beschriftungsart. Zur Behebung ist die Beschriftung per<label>
undfor
/id
zu wählen.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Das Sucheingabefeld im Suchfenster, nach Aktivierung der Schalftfläche mit dem Lupensymbol, ist nur mit dem
placeholder
-Attribut beschriftet. Dies ist nicht ausreichend, da es bei Nutzereingaben verschwindet. Es ist ein visuelles Label (bestenfalls) oberhalb des Texteingabefeldes zu platzieren.Das gleiche Fehlermuster tritt auch bei Eingabefeldern zur Newsletter-Anmeldung auf. Behebung wie oben.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben in diesem zweiten findet sich ein Suchfeld, das nur durch einen
placeholder
, also eine Textvorbelegung beschriftet ist. Dies gilt nicht als zulässige, persistente Beschriftung, entsprechend ist z. B. über dem Suchfeld ein dauerhaftes<label>
mit "Suchdienste" zu platzieren. -
Im Karten-Widget ist das Feld "PLZ oder Ort eingeben" nur durch Vorbelegung (
placeholder
) beschriftet. Dies ist keine gültige und persistierende Beschriftungsart. Zur Behebung ist die Beschriftung per<label>
undfor
/id
zu wählen.
-
-
Details
Keine Anmerkungen vorhanden
-
9.3.3.3. Hilfe bei Fehlern,
Details
- 5 Seiten konform
- 6 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
9.3.3.4. Fehlervermeidung wird unterstützt,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
9.4.1 Kompatibel
Prüfschritte
-
9.4.1.1. Korrekte Syntax,
Details
- 10 Seiten konform
- 1 Seite nicht konform
-
Details
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Details
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Details
-
Es gibt zwei
g
-Elemente (innerhalb einessvg
-Elementes) mit der ID "rb_97". Das ist zu entfernen.
-
-
konform
Details
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
Details
-
Anmerkung ohne Bewertung: Im
head
-Bereich der Seite, innerhalb einesnoscript
-Elementes, das den Matomo-Fallback beinhaltet, gibt es einp
-Element. Diese sind inhead
-Bereichen unzulässig.
-
-
9.4.1.2. Name, Rolle, Wert verfügbar,
Details
- 11 Seiten nicht konform
-
Details
-
Der Cookie-Dialog hat keinen zugänglichen Namen, aber eine ausgesprochen lange zugängliche Beschreibung ("Wir nutzen Cookies, um unsere Services anzubieten, diese stetig zu verbessern und unser Informationsangebot entsprechend Ihrer Interessen anzupassen. Mit Klick auf „Akzeptieren“ willigen Sie in die Verwendung von Cookies ein. Sie können Ihre Cookie-Einstellungen jederzeit ändern oder widerrufen. Mehr erfahren Sie in der Datenschutzerklärung. "). Dies ist vor allem in Anbetracht dessen wenig optimal, dass der Dialog das erste und auch automatisch fokussierte Element ist.
-
Der Cookie-Dialog besitzt keine programmatische Angabe über seinen modalen Zustand, braucht diese aber, z. B. in Form des Attributs
aria-modal="true"
.
-
-
Details
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden und das gleiche gilt auch für die Tastaturbedienung ohne Screenreader (interaktive Elemente in Slides, die nicht sichtbar sind, sind tastaturerreichbar - damit unsichtbare Fokushaltepunkte). Zur Behebung bietet folgender Artikel mehr Informationen über einen richtigen strukturellen Aufbau eines Karussells: https://tollwerk.de/projekte/tipps-techniken-inklusiv-barrierefrei/barrierefreie-karussells#die-folien
-
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden, vergleichbar mit der Karussell-Situation auf Seite 1. Zur Behebung bietet folgender Artikel mehr Informationen über einen richtigen strukturellen Aufbau eines Karussells: https://tollwerk.de/projekte/tipps-techniken-inklusiv-barrierefrei/barrierefreie-karussells#die-folien
-
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Vor der Einbindung des YouTube-Videos gibt es einen weiteren User-Centrics-Cookie-Dialog direkt auf dem Poster-Bild des Videos. Dieses ist nicht semantisch als Dialog ausgezeichnet (siehe andere Anmerkungen in diesem Prüfschritt dazu).
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Klickt man auf die Kartengrafik der Verkehrsbereiche in NRW öffnet sich ein modaler Dialog. Dieses Element mit der Rolle
dialog
ist als modal anzusehen, muss noch im offenen Zustand das Attributaria-modal="true"
bekommen. Ferner hat der Dialog aktuell keinen zugänglichen Namen, dieser kann beispielsweise peraria-label="Vergrößerte Kartengrafik"
zur Verfügung gestellt werden. -
Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden, vergleichbar mit der Karussell-Situation auf Seite 1. Zur Behebung bietet folgender Artikel mehr Informationen über einen richtigen strukturellen Aufbau eines Karussells: https://tollwerk.de/projekte/tipps-techniken-inklusiv-barrierefrei/barrierefreie-karussells#die-folien
-
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Details
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Details
-
Nutzt man z. B. die interaktive Karte, in dem man per Maus den Start- und Endpunkt einer Reise angibt, wird eine Ergebnisinformation generiert, die anzeigt, welche Optionen man für die Route hat. Diese Informationen umfassen zumeist mehrere Verbindungen, inklusive unterschiedlicher Reiselängen und Preisstufen. Diese Matrix an Optionen sind wiederum in Tabellenform ausgezeichnet, was grundsätzlich richtig ist.
Allerdings ist sowohl Ausklapp-Auslöser als auch Ausklapp-Bereich nicht nach dem sogenannten "Disclosure-Widget"-Muster umgesetzt, und damit u. a. auch im geschlossenen Zustand vor Screenreader-Nutzenden nicht versteckt. Der Auslöser ist mit der Rolle
button
umzusetzen (inklusive mindestens dem Attributtabindex="0"
für die Tastaturerreichbarkeit, Tastatureventlistener eines Buttons, und einem zugänglichen Namen, z. B. peraria-label
). Der Ausklappbereich selbst ist im geschlossenen Zustand zuverlässig zu verstecken. Mehr Details: https://barrierefrei.link/expando-tabellen (englisch). -
Einige Schaltflächen, darunter sowohl die klickbaren Bahnhöfe, die sich nach ihrer Aktivierung öffnenden Kontextmenüs, interaktive Elemente in ihnen im Verbindungsfenster nach Angabe eines Start- und Zielorts (auch: Aufklappfunktion und Druckansichten) und interaktive Elemente im rechtsseitigen Panel, u. a. auch die Schaltfläche "Hinweise zur Bedienung", sind mit der falschen semantischen Rolle umgesetzt. Alle angesprochenen Interaktionsflächen benötigen die Rolle
button
, Tastaturerreichbarkeit mindestens über das Attributtabindex="0"
, Tastatureventhandler für die Leer- und Eingabetaste sowie angemessene zugängliche Namen (siehe dazu 9.2.4.6).Aufklappfunktion sind mit dem "Disclosure-Widget"-Muster umzusetzen, d. h. unter anderem, dass ein auslösender Button per
aria-expanded
kommunizieren muss, ob sein direkt im Dokument folgender beeinflusster Bereich offen oder geschlossen ist. Mehr Details zu dem Muster: https://barrierefrei.link/ausklapp . -
Die Kontrollfelder zum Verschieben und zum Zoomen des Kartenausschnitts sind
div
-Elemente mit Klick-Event-Listener, damit mit der falschen Rolle (und auch nicht tastaturerreichbar, siehe 9.2.1.1) umgesetzt. Interaktionselemente dieser Art benötigen die Rollebutton
(die einfachste Variante wäre es, das<button>
-Element zu nutzen, dann wäre auch die Tastaturerreichbarkeit und -bedienbarkeit gegeben). Weiterhin brauchen diese Kontrollfelder nach Instandsetzung als Button aussagekräftige zugängliche Namen, wie zum Beispiel "Vollbildansicht", "Hereinzoomen", "Herauszoomen", "Kartenansicht nach rechts verschieben" und so weiter. -
Beim Nicht-Ausfüllen der Start- und Zielfelder einer Route erscheint zwar eine Fehlermeldung in einem visuellen Dialog, diesem fehlt aber Dialogsemantik, vergleichbar mit den anderen Anmerkungen bezüglich Dialogen in diesem Prüfschritt. Aufgrund Prüfschritt 9.3.3.1 sollte die Rolle hier
alertdialog
sein.Der Schließen-Button in diesem Dialog muss zudem die Rolle
button
und Tastaturerreichbarkeit bekommen (ebenfalls wie bereits mehrfach in diesem Prüfschritt erklärt). -
Es gibt zwar zwei Arten der Bedienung des Regionalverkehrsplan (Suchbasierte und grafische Nutzung) und es wird auch im Start-/Hilfe-Dialog auf beide deutlich hingewiesen, allerdings hat die suchbasierte Variante eine Vielzahl von Fehlern in z. B. Bezug auf 9.1.1.1a, 9.2.1.1 und auch hier in 9.4.1.2, sodass die suchbasierte Variante nicht als Alternativversion für die grafische Nutzung gelten kann, der RVP beispielsweise bei Screenreader-Nutzung in beiden Ausprägungen barrierebehaftet ist. Die in den genannten Prüfschritten befindlichen Anmerkungen sind zu korrigieren.
- Siehe auch Anmerkungen zu allen Seiten
-
-
nicht konform
Details
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man bei einem Start- oder Zielort auf das Marker-Symbol, um den jeweiligen Ort auf einer Karte anzuzeigen, wird unterhalb des Formulars eine Karte sichtbar.
Auf dieser Karte sind
img
-Elemente direkt mit Click-Event-Handlern ausgestattet, diese Kontrollfelder haben somit die falsche Rolle (benötigt wird die Rollebutton
, am Einfachsten durch die Verwendung des<button>
-Elements zu erreichen). Auch ein zugänglicher, die Funktion beschreibender Name wird benötigt (siehe 9.1.1.1a, Seite 8).Betroffen von einer falschen Rollenzuweisung ist auch das Schließen-X, das die eingeblendete Karte wieder ausblendet (Behebung wie oben).
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Die Vorschlagsliste nach Texteingabe ist als sog. "Combobox" umzusetzen: https://barrierefrei.link/combobox (englisch).
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Die "Hamburger"-Schaltfläche in der Verkehrinfo-Karte ist mit der falschen Rolle umgesetzt (
complementary
, also<aside>
, statt korrekterweisebutton
). Da ein Bereich nach Aktivierung der Fläche sichtbar wird und dieser im Dokument direkt nach dem Auslöser kommt, ist das Ausklapp-/Disclosure-Widget-Muster zu befolgen: https://barrierefrei.link/ausklapp . -
Die Auslöser für erweiterte Baustelleninformationen, die man per Klick auf einzelne Baustellen-Symbole erhält, sind zum einen nicht tastaturerreichbar und -bedienbar (siehe 9.2.1.1), zum anderen wurde das
canvas
-Element mit indirektem Klick-Event-Listener dafür genutzt. Die einzelnen Auslöser sollten vielmehr Buttons sein, das Gesamtkonstrukt ein Ausklappbereich (mehr dazu: https://barrierefrei.link/ausklapp ). -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). -
Grundsätzlich ist die Verkehr.NRW-Karte unzugänglich und übermäßig komplex. Deswegen ist keine intensive und vollständige Prüfung möglich, die Auflistung der Findings in anderen Prüfschritten von Seite 9 erhebt keinen Anspruch auf Vollständigkeit. Aber auch schon die gelisteten Punkte verhindern eine Konformitätserklärung von Seite 9.
- Siehe auch Anmerkungen zu allen Seiten
-
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Im Karussell sind im jeweiligen Moment nicht-sichtbare Slides unzulässig versteckt, sodass sie im Lesemodus des Screenreaders vorgelesen werden, vergleichbar mit der Karussell-Situation auf Seite 1. Zur Behebung bietet folgender Artikel mehr Informationen über einen richtigen strukturellen Aufbau eines Karussells: https://tollwerk.de/projekte/tipps-techniken-inklusiv-barrierefrei/barrierefreie-karussells#die-folien
-
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog. Klickt man in ihm auf ein Fragezeichensymbol, öffnet sich ein weiterer. Ganz oben links in diesem zweiten findet sich ein "Hamburger-Symbol", das die Seitenleiste ein- und ausklappt. Dieser Button ist als Ausklapp-Bereich umzusetzen: https://barrierefrei.link/ausklapp .
-
Besucht man die Desktop-Hauptnavigation mit dem Screenreader NVDA, so erfährt man zwar, dass ein Menüpunkt ein Untermenü hat, aber bei Aktivierung nicht, ob es offen oder geschlossen ist. Siehe Anmerkung zur
menu
-Rolle in Navigationen und Behebung durch das Ausklapp-Muster. -
Die programmatischen Werte der Betriebsqualität-Statusbalken, genauer gesagt, der
aria-valuenow
-Wert, entspricht nicht den sichtbaren Beschriftungen und irritiert bei Screenreader-Nutzung deshalb.Grundsätzlich ist die Rolle
progressbar
semantisch die falsche Wahl, siehe 9.1.3.1h. -
Vor der Einbindung des YouTube-Videos gibt es einen weiteren User-Centrics-Cookie-Dialog direkt auf dem Poster-Bild des Videos. Dieses ist nicht semantisch als Dialog ausgezeichnet (siehe andere Anmerkungen in diesem Prüfschritt dazu).
-
Klickt man im Cookie-Dialog auf "Weitere Informationen", so öffnet sich ein weiterer Dialog, der einen visuelle Schaltfläche "Speichern und Schließen". Dieses Kontrollfeld ist mit der falschen Rolle (Soll:
button
) und zudem tastaturunerreichbar umgesetzt (siehe 9.2.1.1). -
Im Fussbereich findet sich ein Widget in Bezug auf die Betriebsqualität (Gesamt- und Einzelwerte). Alle Werte sind mit Fortschrittsbalken umgesetzt (erreichter Prozentwert). Diese Fortschrittsbalken (Rolle
progressbar
) sind allerdings die falsche sematische Wahl, da sie für dynamische Fortschrittsbalken vorgesehen sind. Richtig wäre dasmeter
-Element: https://barrierefrei.link/meter (englischer Link). - Siehe auch Anmerkungen zu allen Seiten
-
-
nicht konform
Details
-
Der Auslöser-Button für die aufklappbare mobile Navigation besitzt zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei aufgeklapper mobiler Navigation auffalse
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von offener Navigation alsotrue
sein. -
In der Desktop-Ausprägung des Hauptmenüs gibt es Menüpunkte erster Navigationsordnung, die jeweiligen Auslöser für die Unternavigation (zweiter Ordnung) besitzen zwar das Attribut
aria-expanded
, und auch die Grundstruktur entspricht einem Ausklapp-Bereich, allerdings bleibt der Attribut-Wert auch bei eingeklappter Unternavigation auftrue
. Behebung: Der Wert vonaria-expanded
muss den Zustand der Navigation wiederspiegeln, im Falle von geschlossener Sub-Navigation alsofalse
sein.Der gleiche Fehler liegt innerhalb der offenen mobilen Navigation vor, dort ebenfalls die zweite Navigationsebene betreffend.
-
Sowohl die mobile, als auch die Desktop-Navigation ist mit der Rolle
menu
umgesetzt. Diese Rolle ist nicht für Website-Navigationen gedacht, sondern für betriebssystem-artige Menüs in Applikationen (mehr Details auf Englisch hier: https://barrierefrei.link/no-menu-for-sitenav ). Stattdessen sollte die Navigation in beiden Ausprägungen mit dem (auch technisch weniger restriktivem) Ausklapp-Muster ("Disclosure") umgesetzt werden, Beispiel: https://barrierefrei.link/ausklapp-nav-en (englisch).Hinzu kommt, dass die von den Rollen
menu
undmenuitem
angekündigte Tastaturbedienung (z. B. in Bezug auf die Pfeiltasten) nicht umgesetzt wurde. -
Das Suchfenster/der Suchdialog hat zwar die richtige Rolle (
dialog
) und den richtigen Zustand (aria-modal="true"
), allerdings keinen zugänglichen Namen. Dieser kann z. B. peraria-label="Suchformular
auf dem Element mit der Rolledialog
gewährleistet werden. -
Der Klick auf "Cookie-Einstellungen" im Fussbereich öffnet einen Dialog, der zwar optisch, aber nicht semantisch ein modaler ist: So fehlt ihm die Rolle
dialog
, die WAI-ARIA-Zustandsbeschreibungaria-modal
sowie ein zugänglicher Name, der beispielsweise mit einer ID-Referenz zur Überschrift "Cookie-Einstellungen" undaria-labelledby
hergestellt werden könnte. Auch das für modale Dialoge nötige Fokusmanagement ist nicht gewährleistet (siehe 9.2.4.3).Das gleiche gilt auch für den weiteren Dialog, der sich nach Klick auf ein Fragezeichensymbol im ersten Dialog öffnet.
-
Klickt man im Fußbereich auf "Cookie-Einstellungen", öffnet sich ein Dialog mit gleichem Namen. Hinter jeder Cookie-Kategorie und noch vor der zugeordneten Checkbox findet sich je eine Fragezeichen-Schaltfläche, die einen weiteren Dialog öffnet. Diese Schaltfläche ist als klickbares
div
-Element umgesetzt, sie müsste allerdings die Rollebutton
besitzen, tastaturerreich- und -bedienbar sein und einen zugänglichen Namen besitzen, z. B. "Detaileinstellungen". -
Die versuchte Zuordnung zwischen Gruppenlabel (
<legend>
) und der Liste an Fragen perfor
/id
ist gut gemeint, aber unzulässig. - Siehe auch Anmerkungen zu allen Seiten
-
-
9.4.1.3. Statusmeldungen programmatisch verfügbar,
Details
- 5 Seiten nicht konform
- 6 Seiten nicht anwendbar
-
Details
-
aria-live
-Attribute, also Live-Regionen, auf (mehrheitlich) automatisch wechselnden Karusell-Slides sind dringend zu entfernen. Gerade bei einem automatischen Slide-Wechsel (der nicht abstellbar ist, siehe 9.2.2.2) kann andernfalls die Screenreaderausgabe jeweils alle etwa 10 Sekunden von der Wechsel-Ansage unterbrochen werden.
-
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
-
aria-live
-Attribute, also Live-Regionen, auf (mehrheitlich) automatisch wechselnden Karusell-Slides sind dringend zu entfernen. Gerade bei einem automatischen Slide-Wechsel (der nicht abstellbar ist, siehe 9.2.2.2) kann andernfalls die Screenreaderausgabe jeweils alle etwa 10 Sekunden von der Wechsel-Ansage unterbrochen werden.
-
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
-
Anmerkung ohne Bewertung: Da für die Auflistung der gefundenen Wanderrouten keine HTML-Liste verwendet wurde, entsprechend keine schnelle Ausgabe der Menge der gefundenen Routen für Screenreader-Nutzende ersichtlich ist, bietet sich nach erfolgtem Filtern mit den Auswahlfeldern an, eine Live-Region-Ausgabe zu etablieren, die über die Gesamtzahl der Filterergebnisse informiert. Mehr Details zur Implementierung von Live-Regionen hier: https://barrierefrei.link/live .
-
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
-
aria-live
-Attribute, also Live-Regionen, auf (mehrheitlich) automatisch wechselnden Karusell-Slides sind dringend zu entfernen. Gerade bei einem automatischen Slide-Wechsel (der nicht abstellbar ist, siehe 9.2.2.2) kann andernfalls die Screenreaderausgabe jeweils alle etwa 10 Sekunden von der Wechsel-Ansage unterbrochen werden.
-
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Wird über die Haltestellensuche ein Suchauftrag gestartet, in dem ein Start- und Zielort angegeben wird, erzeugt der Screenreader NVDA (bzw. alle Screenreader) keine Ausgabe, wenn Ergebnisse gefunden wurden.
Hier sind WAI-ARIA-Live-Regions für diese Status-Kommunikation einzusetzen;im Erfolgsfall muss "X Verbindungen gefunden" in der Live-Region erzeugt werden (wobei natürlich X der Anzahl der Ergebnisse entspricht). Mehr Details zur Implementierung von Live-Regionen hier: https://barrierefrei.link/live .
-
-
nicht konform
Details
-
Anmerkung ohne Bewertung: Wenn bei einer Eingabe eines Start- und Zielpunkts (ggf. auch Zwischenzielen) mehr als ein Ergebnis gefunden wird, sollte die Menge der gefundenen Verbindungen via WAI-ARIA-Live-Region angesagt werden, vor allem da die Ergebnisauflistung nicht in einer semantischen HTML-Liste aufgegeben wird, der/die Nutzende somit durch alle Ergebnisse gehen müsste, um die Gesamtzahl der Ergebnisse der Suchanfrage zu erfahren. Mehr Details zur Implementierung von Live-Regionen hier: https://barrierefrei.link/live .
-
Dauert eine Suchanfrage etwas länger, wird das visuell Nutzenden durch eine das gesamte Interface überdeckende Ladegrafik kommuniziert. Der Screenreader NVDA (bzw. alle Screenreader) erzeugen für diesen Zwischenzustand allerdings keine Ausgabe, entsprechend ist der/die Nutzende dieser Hilfstechnologie nicht über den Ladezustand informiert (übrigens auch nicht über den ggf. erfolgreichen Abschluss des Suchvorgangs).
Für beide Situationen sind hier WAI-ARIA-Live-Regions einzusetzen; für die erste sollte die Ausgabe "Lade Ergebnisse…", für die zweite "X Verbindungen gefunden" erzeugt werden (wobei natürlich X der Anzahl der Ergebnisse entspricht). Mehr Details zur Implementierung von Live-Regionen hier: https://barrierefrei.link/live .
-
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
11.7 Benutzerdefinierte Einstellungen
Prüfschritte
-
11.7. Benutzerdefinierte Einstellungen,
Details
- 11 Seiten konform
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
-
Anmerkung ohne Bewertung: Die Schriftgröße der einzelnen Bahnhöfe/Stationen auf der Übersichtskarte sind in Pixel definiert, werden deswegen per benutzerdefinierten Einstellungen im Sinne dieses Prüfschrittes nicht vergrößert. Die Größen sollten in relativen Einheiten, wie
rem
oderem
definiert werden.
-
-
konform
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
-
11.8 Autorenwerkzeuge
Prüfschritte
-
11.8.2. Barrierefreie Erstellung von Inhalten,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
11.8.3. Erhaltung von Barrierefreiheitsinformationen bei Transformation,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
11.8.4. Reparaturassistenz,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
11.8.5. Vorlagen,
Details
- 11 Seiten nicht anwendbar
-
Details
Keine Anmerkungen vorhanden
-
Seite 2 — Mobilitätsgarantie NRW
Mobilitätsgarantie - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 3 — Wanderrouten in NRW
Wandertouren - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 4 — Wandernd NRW entdecken
Wandernd NRW entdecken - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 5 — Einfach-Weiter-Ticket
EinfachWeiterTicket NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
Details
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
Seite 9 — Aktuelle Verkehrsinfos
Verkehr.NRW - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
Seite 10 — Vernetzt mobil dank Mobilstationen
Mobilstationen - mobil.nrwDetails
Keine Anmerkungen vorhanden
-
nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
-
12 Dokumentation und Support
Prüfschritte
-
12.1.1. Dokumentation von Kompatibilität und Barrierefreiheit,
Details
- 11 Seiten nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
12.1.2. Barrierefreie Dokumentation,
Details
- 11 Seiten nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
12.2.2. Technischer Support,
Details
- 11 Seiten nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
12.2.3. Effektive Kommunikation,
Details
- 11 Seiten nicht anwendbar
Details
Keine Anmerkungen vorhanden
-
12.2.4. Vom Support bereitgestellte Dokumentation,
Details
- 11 Seiten nicht anwendbar
Details
Keine Anmerkungen vorhanden
-