Zertifikatsbericht für logwien

Webseiten Betreiber: Wiener Stadtwerke GmbH
Webseiten Domain: log.wien
Zertifikat Status: Silber
Zertifizierungsdatum: 31.07.2023

Zertifizierung WACA

Die Initiative WACA strebt mit diesem Zertifikat ein sehr hohes Niveau und eine herausragende Qualität der Barrierefreiheit an, deshalb müssen für eine erfolgreiche Zertifizierung die grundlegendsten WCAG-Kriterien erfüllt werden. Die AuditorInnen prüfen nach einem vorgegebenen Schema und eigener Prüfmethodik streng nach diesen Kriterien. Das WACA-Zertifikat wird in 3 unterschiedlichen Stufen vergeben. Es wurde für jedes WCAG-Erfolgskriterium eine eigene Abstufung für Gold, Silber und Bronze definiert. Damit können auch Websites ausgezeichnet werden, die nicht die höchsten Anforderungen der WCAG erfüllen bzw. Best-Practice sind, aber eine grundlegende Barrierefreiheit aufweisen und niemanden bei der Benutzung der Website ausschließen. Bei den Abstufungen Silber oder Bronze müssen Bemühungen für Barrierefreiheit klar und eindeutig erkennbar sein, siehe Definition WACA Abstufungen.

WACA zertifiziert Websites, die genau eingegrenzt werden können, meist definiert durch eine URL und zieht daraus eine repräsentative Stichprobe (Testsample). 
Folgende Inhalte bzw. Funktionen einer Website sind jedoch allgemein vom Audit ausgeschlossen:

• PDF
• EPUB
• live übertragene zeitbasierte Medien
• Inhalte, die nur für eine geschlossene Gruppe von Personen und nicht für die allgemeine Öffentlichkeit verfügbar sind (Extranets und Intranets).
• externe Inhalte von Drittanbietern, die vom Website-Betreiber weder finanziert noch entwickelt wurden und somit auch nicht dessen Kontrolle unterliegen (wie z.B.: Google Maps, Youtube, Facebook, externe Iframes und Widgets,...), Definition wie folgt:
  • Drittanbieter Inhalte, mit denen man nicht interagieren kann (z.B. Facebook Trackingpixel), sind von der Prüfung ausgenommen.
  • Drittanbieter Inhalte, die keine grundlegende, zentrale Funktionalität der Seite bereitstellen, sind von der Prüfung ausgenommen.
  • Drittanbieter Inhalte, die zusätzliche Informationen bereitstellen und für die BenutzerInnen essentiell sind, benötigen eine Alternative.
  • Wenn eine Website weitestgehend aus Drittanbieter Inhalten besteht, wird eine Zertifizierung abgelehnt und Auftrag nicht angenommen. Website ist in diesem Fall nicht auditierbar.
• Online-Karten und Kartendienste, diese müssen aber eine barrierefreie Alternative haben.
• Google Captcha (ReCaptcha V2): Verwendung gültig nur für die WACA Qualitätsstufen Silber und Bronze.

Allgemeiner Kommentar der Zertifizierungsstelle:

Die HTML-Struktur der Website mit der URL log.wien ist relativ konsistent und hat daher eine solide Basis. Nur an wenig Stellen könnte die Barrierefreiheit noch mehr berücksichtigt werden, speziell bei ARIA-Attributen und dass die Website bei englischen und deutschen Inhalten die selbe URL hat. Die Single-Sign-On Lösung für die Online-Services der Wiener Stadtwerke Gruppe hat im gesamten gesehen einen hohen Grad an Barrierefreiheit und erfüllt weitestgehend die WCAG 2.1 AA - Erfolgskriterien. Auf viele Aspekte im Bereich Accessibility wurde geachtet. Inhalt und Grundfunktionalität sind für alle BenutzerInnen zugänglich.

Folgende Verlinkungen der Website waren nicht im Scope des Audits, da externe URLs der Partnerseiten:

• Bestattung Wien: https://www.bestattungsplaner.at/
• Friedhöfe Wien: https://digitalesgrab.friedhoefewien.at/
• Wien Energie: https://meine.wienenergie.at/
• Wiener Linien: https://www.bildstrecke.at/
• Wiener Linien: https://shop.wienerlinien.at/
• Wiener Lokalbahnen: https://www.easymobil.at/
• Wiener Netze: https://www.wienernetze.at/

Geprüftes Testsample

• logwien T01: Startseite DE : https://log.wien/
• logwien T02: Startseite EN: https://log.wien/
• logwien T03: Kontakt: https://log.wien/hilfe-und-kontakt
• logwien T04: Antwort FAQ: https://log.wien/hilfe-und-kontakt/wer-steht-hinter-logwien
• logwien T05: Services: https://log.wien/services
• logwien T06: Contentseite: https://log.wien/partners/wiener-lokalbahnen#easymobil
• logwien T07: Registrierung DE: https://log.wien/auth/realms/logwien/login-actions/registration?client_id=self-service&tab_id=lyfdakmxGr0&execution=8a27213f-4c52-4a45-b99d-3ea9027e61c4&kc_locale=de
• logwien T08: Registrierung EN: https://log.wien/auth/realms/logwien/login-actions/registration?client_id=self-service&tab_id=OuKDAKvHLRo&execution=8a27213f-4c52-4a45-b99d-3ea9027e61c4&kc_locale=en
• logwien T09: Bestätigung:
• logwien T10: Login/Logout:
• logwien T11: Passwort vergessen:
• logwien T12: Mein Profil: https://log.wien/profile
• logwien T13: Mein Profil bearbeiten: https://log.wien/profile/language
• logwien T14: Konto löschen:
• logwien T15: Meine Partner: https://log.wien/my-partners
• logwien T16: Partner verknüpfen:
• logwien T17: Verknüpfung aufheben:
• logwien T18: Login Partnerseiten:
• logwien T19: Zufallssample: https://log.wien/profile/social-logins
• logwien T20: Dashbord: https://log.wien/
• logwien T21: Feedback geben: https://log.wien/survey/index.php/785722?lang=de&G01Q11=4%2B9fBm8A9uon94GqNY3ZsGTj19k%3D&G01Q16=4&G01Q08=1&G01Q09=5

Abweichungen zur WCAG und WACA-Einstufung

logwien T01: Startseite DE

Kriterium 1.2.1 - Reine Audio- und Videoinhalte (aufgezeichnet): Erfüllt / Nicht Anwendbar

Nach-Audit: Ist jetzt erfüllt (kein Video mehr vorhanden)




Kriterium 1.2.3 - Audiodeskription oder Medienalternative (aufgezeichnet): Erfüllt / Nicht Anwendbar

Es ist hier anzumerken, dass Vimeo keine Möglichkeit zur Einbettung von Audio Description verfügt (wie auch andere Videoprovider). Pragmatisch gesehen ist das Gesprochene auf dem Video bis auf dem letzten Absatz identisch und entspricht somit dem Inhalt des Videos, somit geht es als Medienalternative durch.

Nachaudit: Kein Video mehr vorhanden






Kriterium 1.2.5 - Audiodeskription (aufgezeichnet): Erfüllt / Nicht Anwendbar

Siehe SC 1.2.3




Kriterium 1.3.1 - Info und Beziehungen: Erfüllt / Nicht Anwendbar

Bei den Headings ist die Struktur etwas problematisch: Einerseits sind bei "Teilnehmende Partner" und "Digitale Services" die darunter im Slider befindlichen Überschriften nicht als h3 ausgezeichnet, womit die Gliederung des Inhalts logischer wäre und somit eine inhaltliche Orientierung bieten würde (vergleichbar mit dem visuellen Scannen des Inhalts bei Sehenden). Anderseits werden durch den Slider Überschriften teilweise komplett ausgeblendet, dadurch ist die User Experience im Slider extrem eingeschränkt, da man gar nicht drauf kommt, dass es möglichweise weiteren Inhalt gibt. Vor lauter h2 wird man als Screen Reader User nicht schlau, was hier versteckt ist.

Nach-Audit: Die Überschriften-Hierarchie wurde linearisiert und ist jetzt sinnvoller.




Kriterium 1.4.3 - Kontrast (Minimum): Erfüllt / Nicht Anwendbar

Der Kontrast beim Text ist in der dekorativen Videoslideshow in einer Viewportbreite von weniger als 960 px problematisch (derselbe Effekt tritt ein, wenn man die die Schrift vergrößert auf 200%).

Nach-Audit: Das wurde verbessert und somit ist das Kriterium erfüllt.




Kriterium 1.4.12 - Textabstände: Erfüllt / Nicht Anwendbar

Die Textabstände werden beim Slider "Digitale Services" am Textende vor dem "Mehr erfahren"-Link leicht abgeschnitten.

Nachaudit: Das wurd verbessert und somit ist das Kriterium nun erfüllt.




Kriterium 2.1.1 - Tastatur: Erfüllt / Nicht Anwendbar

Die Arrow-Buttons beim Slider haben sich verändert: Jetzt wird der Wrapper von den Buttons mit einem tabindex="0" versehen und die Buttons darin werden aus der Fokusreihenfolge genommen und machen die Bedienung des Arrow-Buttons via Tastatur somit unmöglich.




Kriterium 2.4.3 - Fokus-Reihenfolge: Silber

Nachaudit: Das Focus-Management beim Mobile Menü funktioniert jetzt. Allerdings das mit dem Haspopup ist nach wie vor nicht das, wofür es gedacht ist, siehe inzwischen aktualisierter Artikel auf developer.mozilla.org (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-haspopup#sect1). Es hätte wie schon mehrfach erwähnt kein haspopup benötigt.

Gutes Beispiel zum Vergleich: https://www.w3.org/WAI/tutorials/menus/flyout/#use-button-as-toggle

Hier sieht man, dass wenn das Dropdown offen ist, dass im Screen Reader dann auch die Items der Liste vorgelesen wird, was mit hinzugabe von aria-haspopup verhindert wird.

Daher die Einstufung jetzt auf Silber.




Kriterium 4.1.2 - Name, Rolle, Wert: Silber

Nachaudit: aria-expanded ist inzwischen vorhanden, dennoch nach wie vor noch gekoppelt mit aria-haspopup (siehe 2.4.3).




logwien T02: Startseite EN

Kriterium 1.3.1 - Info und Beziehungen: Erfüllt / Nicht Anwendbar

Bei den Headings ist die Struktur etwas problematisch: Einerseits sind bei "Participating partners" und "Digital Services" die darunter im Slider befindlichen Überschriften nicht als h3 ausgezeichnet, womit die Gliederung des Inhalts logischer wäre und somit eine inhaltliche Orientierung bieten würde (vergleichbar mit dem visuellen Scannen des Inhalts bei Sehenden). Anderseits werden durch den Slider Überschriften teilweise komplett ausgeblendet, dadurch ist die User Experience im Slider extrem eingeschränkt, da man gar nicht drauf kommt, dass es möglichweise weiteren Inhalt gibt. Vor lauter h2 wird man als Screen Reader User nicht schlau, was hier versteckt ist.

Nachaudit: Die Überschriftenhierarchie wurde linearisiert und somit ist das Kriterium jetzt erfüllt.




Kriterium 1.4.12 - Textabstände: Erfüllt / Nicht Anwendbar

Die Textabstände werden beim Slider "Digitale Services" am Textende vor dem "Learn more"-Link leicht abgeschnitten.

Nachaudit: Die Textabstände passen jetzt, der "Learn more"-Link ist nicht mehr abgeschnitten




Kriterium 2.4.3 - Fokus-Reihenfolge: Silber

Siehe T01




Kriterium 4.1.2 - Name, Rolle, Wert: Silber

Siehe T01




logwien T03: Kontakt

Kriterium 1.4.12 - Textabstände: Erfüllt / Nicht Anwendbar

Bei Textabständen laufen die Email-Adressen von Bestattung Wien und Friedhöfe Wien über die Box hinaus, sodass die Lesbarkeit etwas darunter leidet.

Nachaudit: Die Textabstände wurden verbessert und somit ist das Kriterium erfüllt.




logwien T04: Antwort FAQ

logwien T05: Services

Kriterium 1.4.12 - Textabstände: Erfüllt / Nicht Anwendbar

Bei Textabständen wird der der Teasertext kurz vor dem "Link" leicht abgeschnitten.

Nachaudit: Das ist jetzt nicht mehr der Fall. Das Kriterium ist somit vollständig erfüllt.






logwien T06: Contentseite

Kriterium 1.1.1 - Nicht-Text-Inhalt: Erfüllt / Nicht Anwendbar

Empfehlung zu den Alternativtexten der Bilder: Es ist besser "Bild von" etc. wegzulassen, da der Screenreader ohnehin weiss, dass es sich um ein Bild handelt und daher eine überflüssige Information ist.




Kriterium 1.3.2 - Bedeutungstragende Reihenfolge: Erfüllt / Nicht Anwendbar

Hier wir zuerst das Bild hinter dem Header ausgegeben, danach der Skiplink und dann erst der Headerinhalt.
Damit leidet die Konsistenz der Seitenstruktur quer über die Seiten bezüglich Header, Main und Footer. Daher sollte das Bild erst nach dem Header ausgegeben werden.

Nachaudit: Das wurde jetzt verbessert und somit ist das Kriterium jetzt erfüllt.




logwien T07: Registrierung DE

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Erfüllt / Nicht Anwendbar

Wenn man die Option Firma ausgewählt hat, dann erscheint das Feld Firmenname, wo offenbar das autocomplete-Attribute vergessen wurde zu implementieren.

Nachaudit: Das fehlende Autocomplete wurde hinzugefügt.




Kriterium 3.3.1 - Fehlererkennung: Erfüllt / Nicht Anwendbar

Die Inline Errors können im Screen Reader nicht erkannt werden.

Nachaudit: Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html

Nachaudit: Das wurde nun umgesetzt.






Kriterium 3.3.3 - Fehlerempfehlung: Erfüllt / Nicht Anwendbar

Da der Disabled Button nicht als solcher ausgezeichnet ist, kann man auf den Button klicken, selbst wenn die erforderlichen Felder nicht ausgefüllt sind. Es werden dann zwar Fehlermeldungen ausgegeben, aber jedoch kommt der Screen Reader User nicht drauf, dass es welche gibt.

Nachaudit: Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html#

Nachaudit:




Kriterium 4.1.1 - Syntaxanalyse: Erfüllt / Nicht Anwendbar

Anmerkung: Diese Seite nutzt HTML5-Elemente, jedoch hat es nicht den dafür benötigten Doctype:

<!DOCTYPE html>

statt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">






Kriterium 4.1.2 - Name, Rolle, Wert: Erfüllt / Nicht Anwendbar

Der Disabled Button kann vom Screen Reader nicht erkannt werden. Man kann den Button fokussieren und klicken, jedoch tut sich dann in der Screen Reader Experience nichts.

Hier ein guter Artikel dazu: https://css-tricks.com/making-disabled-buttons-more-inclusive/

Nachaudit: Das jetztige Szenario sieht kein Disabled Button mehr vor, somit ist es kein Hindernis mehr.




Kriterium 4.1.3 - Statusmeldungen: Erfüllt / Nicht Anwendbar

Die Inline Errors sind dem Screen Reader nicht zugänglich.

Nachaudit: Die aktuelle Umsetzung erfüllt nun das Kriterium nun besser, allerdings fehlt noch das aria-invalid-Attribut (siehe SC 3.3.1)

Nachaudit: Das wurde jetzt umgesetzt.




logwien T08: Registrierung EN

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Erfüllt / Nicht Anwendbar

Wenn man die Option Firma ausgewählt hat, dann erscheint das Feld Firmenname, wo offenbar das autocomplete-Attribute vergessen wurde zu implementieren.

Nachaudit: Der autocomplete-Attribut wurde jetzt korrekt hinzugefügt.




Kriterium 3.3.1 - Fehlererkennung: Erfüllt / Nicht Anwendbar

Die Inline Errors können im Screen Reader nicht erkannt werden.

Nachaudit: Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html#

Nachaudit: Das wurde jetzt behoben




Kriterium 3.3.3 - Fehlerempfehlung: Erfüllt / Nicht Anwendbar

Da der Disabled Button nicht als solcher ausgezeichnet ist, kann man auf den Button klicken, selbst wenn die erforderlichen Felder nicht ausgefüllt sind. Es werden dann zwar Fehlermeldungen ausgegeben, aber jedoch kommt der Screen Reader User nicht drauf, dass es welche gibt.

Nachaudit:

Der Disabled Button wurde ersetzt durch ein anderes Pattern und somit ist es hier kein Thema mehr.

Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html

Nachaudit: Das wurde jetzt behoben.




Kriterium 4.1.1 - Syntaxanalyse: Erfüllt / Nicht Anwendbar

Anmerkung: Diese Seite nutzt HTML5-Elemente, jedoch hat es nicht den dafür benötigten Doctype:

<!DOCTYPE html>

statt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Nachaudit: Der Doctype ist jetzt korrekt und somit das Kriterium nun erfüllt.




Kriterium 4.1.2 - Name, Rolle, Wert: Erfüllt / Nicht Anwendbar

Der Disabled Button kann vom Screen Reader nicht erkannt werden. Man kann den Button fokussieren und klicken, jedoch tut sich dann in der Screen Reader Experience nichts.

Hier ein guter Artikel dazu: https://css-tricks.com/making-disabled-buttons-more-inclusive/

Nachaudit: Die aktuelle Umsetzung erfüllt nun das Kriterium nun besser, allerdings fehlt noch das aria-invalid-Attribut (siehe SC 3.3.1)

Nachaudit: Das wurde jetzt umgesetzt




Kriterium 4.1.3 - Statusmeldungen: Erfüllt / Nicht Anwendbar

Die Inline Errors sind dem Screen Reader nicht zugänglich.

Nachaudit: Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html

Nachaudit: Das wurde jetzt umgesetzt.




logwien T09: Bestätigung

Kriterium 2.4.1 - Blöcke umgehen: Erfüllt / Nicht Anwendbar

Skip-Link geht ins Leere.

Nachaudit: Wurde jetzt umgesetzt.




Kriterium 4.1.1 - Syntaxanalyse: Erfüllt / Nicht Anwendbar

Anmerkung: Diese Seite nutzt HTML5-Elemente, jedoch hat es nicht den dafür benötigten Doctype:

<!DOCTYPE html>

statt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Nachaudit: Der Doctype ist jetzt korrekt und somit ist das Kriterium nun erfüllt.




logwien T10: Login/Logout

Kriterium 1.3.1 - Info und Beziehungen: Erfüllt / Nicht Anwendbar

Der "Button" zum Editieren der E-Mail-Adresse im zweiten Multistep Formular ist missbräuchliche Verwendung des Link und sollte ein natives Button-Element sein, das im selben Stil dargestellt ist.

Empfehlung: https://css-tricks.com/buttons-vs-links/

Nach dem Passwort Feld wird im Screenreader ein Link vorgelesen, der kein Linkziel hat. Was ist der Sinn und Zweck?

Nachaudit: Nun ist das angesprochene Element korrekt und somit das Kriterium erfüllt.




Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Erfüllt / Nicht Anwendbar

Das Password-Feld im zweiten Step des Formulars hat kein Autocomplete.

Nachaudit: Das Kriterium ist jetzt erfüllt.




Kriterium 2.4.7 - Fokus sichtbar: Erfüllt / Nicht Anwendbar

Der Link <a href="" class="u-sr-only">Passwort vergessen?</a> (Button?) ist visuell versteckt und daher ist der Fokus nicht sichtbar.

Nachaudit: Der Link "Passwort vergessen wurde entfernt". Kriterium ist auf diese Weise entfernt.




Kriterium 4.1.1 - Syntaxanalyse: Erfüllt / Nicht Anwendbar

Anmerkung: Diese Seite nutzt HTML5-Elemente, jedoch hat es nicht den dafür benötigten Doctype:

<!DOCTYPE html>

statt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Nachaudit: Der Doctype ist nun korrekt gesetzt und somit das Kriterium erfüllt.




logwien T11: Passwort vergessen

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Erfüllt / Nicht Anwendbar

Das E-Mail-Adressfeld hat kein Autocomplete-Attribute.

Nachaudit: Das korrekte Autocomplete-Attribute wurde nun hinzufgefügt und somit ist das Kriterium erfüllt.




Kriterium 4.1.1 - Syntaxanalyse: Erfüllt / Nicht Anwendbar

Anmerkung: Diese Seite nutzt HTML5-Elemente, jedoch hat es nicht den dafür benötigten Doctype:

<!DOCTYPE html>

statt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Nachaudit: Der Doctype ist nun korrekt und somit das Kriterium erfüllt.




logwien T12: Mein Profil

Kriterium 3.2.2 - Bei Eingabe: Erfüllt / Nicht Anwendbar

Nach dem Klick auf dem Dropdown weiss der Screen Reader nicht, was da auf diesem Button passiert.

Nachaudit: Die Dropdown-Komponente ist nach wie vor unverändert. Das hier verwendete Pattern ist nicht sehr zugänglich. Empfehlung: Prüfen Sie das folgende Pattern im Screenreader und sehen Sie, was es hier tut. https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/

Nachaudit: Das wurde jetzt verbessert.




Kriterium 4.1.2 - Name, Rolle, Wert: Erfüllt / Nicht Anwendbar

Beim Dropdown (Sprachumschalter) können keine Zustände (States) erkannt werden, ob das Dropdown offen oder geschlossen ist.

Nachaudit: Das wurde nun verbessert (siehe Empfehlung im SC 3.3.2)




logwien T13: Mein Profil bearbeiten

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Erfüllt / Nicht Anwendbar

Bei Kontaktadresse editieren fehlt das Autocomplete für Land. Andere Felder, wo kein autocomplete Sinn macht sollten mit autocomplete="off" ausgezeichnet sein.

Nachaudit: Autocompletes wurden angepasst, das Kriterium ist somit erfüllt.




Kriterium 3.3.1 - Fehlererkennung: Erfüllt / Nicht Anwendbar

Die Inline Errors können im Screen Reader nicht erkannt werden.

Nachaudit: Wurde nun behoben.




Kriterium 4.1.3 - Statusmeldungen: Erfüllt / Nicht Anwendbar

Die Inline Errors können im Screen Reader nicht erkannt werden.

Nachaudit: Die Inline Errors werden zwar mit aria-describedby referenziert, allerdings ist es noch nicht funktional, weil es noch ein aria-invalid-Attribut benötigt. Hier ist eine Demo, die funktional ist: https://pauljadam.com/demos/aria-describedby-validation.html

Nachaudit: Ist nun behoben worden.




logwien T14: Konto löschen

Kriterium 2.4.3 - Fokus-Reihenfolge: Erfüllt / Nicht Anwendbar

Wenn man das Modalfenster öffnet, fehlt das Fokus Management in dem der Fokus auf das erste interaktive Element (Close Button) springt und beim Schließen wieder auf den Ursprung (Konto löschen) zurückspringt.

Nachaudit: Der Close Button wurde korrekt mit Fokusmanagement umgesetzt.




Kriterium 2.4.4 - Linkzweck (im Kontext): Erfüllt / Nicht Anwendbar

Hier wir ein Link mit leeren href als Button benutzt (Konto löschen), dies sollte ein Button-Element sein, da es via JS ein Modalfenster öffnet.

Nachaudit: Der Link "Konto löschen" ist jetzt ein Button und somit korrekt. Allerdings wurde das beim "Abbrechen" übersehen (ist dasselbe Prinzip).

Nachaudit: Das wurde nun behoben.




logwien T15: Meine Partner

Kriterium 1.4.13 - Eingeblendete Inhalte: Erfüllt / Nicht Anwendbar

Das Tooltip Pattern ist nicht wirklich zugänglich und zu kompliziert.

Empfehlung: https://zoebijl.github.io/apg-tooltip/ und mit dem Screen Reader testen.

Nachaudit: Tooltip wurde mit einem einfachen Link ersetzt.




Kriterium 2.4.3 - Fokus-Reihenfolge: Erfüllt / Nicht Anwendbar

Tooltip hat in diesem Pattern kein Fokus Management.

Besseres Pattern wird empfohlen, weniger komplex in der UX: https://zoebijl.github.io/apg-tooltip/

Nachaudit: Tooltip wurde mit einem einfachen Link ersetzt




Kriterium 4.1.2 - Name, Rolle, Wert: Erfüllt / Nicht Anwendbar

Das Tooltip Pattern ist nicht optimal und auch nicht funktional (siehe 1.4.13)

Nachaudit: Tooltip wurde mit einem einfachen Link ersetzt.




logwien T16: Partner verknüpfen

Kriterium 1.3.1 - Info und Beziehungen: Erfüllt / Nicht Anwendbar

Modalfenster hat ein Markup, das für diesen Inhalt nicht sinnvoll ist. Denn der Inhalt ist kein Formular und dennoch in einem Form Element (mit Fieldset und Legend) eingebettet. Dazu noch sind hier Section Elemente, die eigentlich so auch nicht korrekt sind. Der Screen Reader kommt nach dem Schließen Button nicht weiter und bleibt stecken und kann den Inhalt nicht lesen:

Korrektes Markup wäre nach dem Schließen-Button:
<h1> ... </h1>
<p> ... </p>
<ul>
<li> ... </li>
<li> ... </li>
<li> ... </li>
<li> ... </li>
</ul>
<p> ... </p>
<button> ... </button>
<button> ... </button>

Section-Element ist hier auch nicht korrekt, weil Section-Element müsste immer auch ein Heading haben und es ist dafür auch nicht der korrekte Usecase.

Nachaudit: Die oben genannten Probleme wurden behoben.




Kriterium 2.4.3 - Fokus-Reihenfolge: Erfüllt / Nicht Anwendbar

Das Modal hat kein optimales Fokusmanagement und sollte auch Fokustrap haben, man kann über Modalfenster tabben.

Nachaudit: Die Fokusmanagement ist jetzt gewährleistet, somit ist das Kriterium jetzt erfüllt.




logwien T17: Verknüpfung aufheben

Kriterium 2.4.3 - Fokus-Reihenfolge: Erfüllt / Nicht Anwendbar

Die Modalfenster sind nicht optimal, man kann raustabben und aus irgendeinen Grund kann im Screen Reader der Inhalt nicht gut vorgelesen werden. Und es fehlt ein Focus Management und der Focus Trap.

Nachaudit: Das wurde nun verbessert und ist somit behoben.




logwien T18: Login Partnerseiten

logwien T19: Zufallssample

logwien T20: Dashbord

logwien T21: Feedback geben