Zertifikatsbericht für Blühendes Österreich

Webseiten Betreiber: Blühendes Österreich - REWE International gemeinnützige Privatstiftung
Webseiten Domain: www.bluehendesoesterreich.at
Zertifikat Status: Bronze
Zertifizierungsdatum: 02.11.2021

Allgemeiner Kommentar:

Die Website-Basis ist in Bezug auf Barrierefreiheit recht gut. Die meisten Controls sind gut zu bedienen, die Webseite ist responsive. Allerdings sind einige WCAG-Mängel vorhanden, die nur ein Zertifikat in Bronze erlauben. Im Scope des Audits war auch der interne Bereich der Website inkl. Registrierung, womit externe UserInnen unter anderem Content für die Website erstellen können. Dies stellt auch eine Hürde dar, um eine höhere WACA-Stufe zu erreichen. Aber aufgrund der Größe der Website ist es eine gute Leistung.

Folgende Verlinkung der Website war nicht im Scope des Audits, da externe URL: https://schmetterlingsapp.at/

Beim Zertifikat WACA sind ganz allgemein vom Audit ausgeschlossen folgende Inhalte bzw. Funktionen einer Website:
Websites mit nicht deutscher und/oder englischer Sprache
Apps für mobile Anwendungen
PDFs
EPUB
Flash
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, Intranets)
externe Inhalte von Drittanbietern, die vom Betreiber der Website weder finanziert noch entwickelt wurden und somit auch nicht dessen Kontrolle unterliegen (wie z.B. Google Maps, Youtube, Facebook, andere Iframes und Widgets,...) wie folgt:
Drittanbieter Inhalte, mit denen man nicht interagieren kann (z.B. Facebook Trackingpixel), sind von der Überprüfung ausgenommen.
Drittanbieter Inhalte, die keine grundlegende, zentrale Funktionalität der Seite bereitstellen, sind von der Überprü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 Zertifizierung abgelehnt und Auftrag nicht angenommen. Website ist nicht auditierbar.
Online-Karten und Kartendienste, diese müssen aber eine barrierefreie Alternative haben
Google Captcha (ReCaptcha V2): gültig nur für Silber und Bronze

BÖ T01: Startseite

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Favoriten im Herzen: Icons unter 1., 2., 3.: Screenreader liest „leer“ vor. Sollte aber da es dekorativ ist für Screenreader generell ausgeblendet werden, da es sonst möglicherweise etwas verwirrend sein kann.

Begründung Einstufung: Sollte die Barrierefreiheit der Webseite nicht erheblich beeinflussen.

Kriterium 1.3.1 - Info und Beziehungen: Bronze

Überschriften-Struktur stimmt nicht mit der logischen Struktur überein: zB Obwohl logisch und visuell „Fliegenpilz“ ein Kind-Element von „Die begehrtesten Lexikonartikel“ ist, sind beide Elemente Überschriften der Ebene H2. Aber auch an anderen Stellen das gleiche Problem.
Begründung Einstufung "bronze": Ist vor allem für Screenreader BenutzerInnen mitunter recht verwirrend.

Liste aus farbigen Symbolen im Footer „UN-Nachhaltigkeitsziele“: sieht wie eine Liste aus, sollte auch als Liste ausgezeichnet werden
Begründung Einstufung (silber): Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 1.4.1 - Benutzung von Farbe: Bronze

Artikel unter „Die begehrtesten Lexikonartikel“. Farbige Punkt zeigen an, ob die Pflanze gefährdet ist. Dies wird nur per Farbe kommuniziert.
Begründung Einstufung (bronze): Sollte keinen allzu gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 1.4.3 - Kontrast (Minimum): Bronze

Kontrastwerte bei Cookie-Meldung → Button „Cookie-Einstellungen“ zu gering bei Mouse-Hover: nur 2:1. Ansonst 2,8:1, was auch zu wenig ist.
Begründung Einstufung: Wird im Normalfall nur einmal fällig. Darum nicht ganz so tragisch.


Kontrast bei Label für Eingabefelder „Wo?“ und „Wann?“ zu gering durch Hintergrundbild.

Begründung Einstufung: Recht zentrale Stelle, aber durch die Placeholder-Texte sollte es für die meisten Benutzer:innen trotzdem kein größeres Problem sein alles lesen.


Kriterium 1.4.11 - Nicht-Text Kontrast: Bronze

Bei Herz-Buttons ist der Tastaturfokus (Blauer Rahmen) abhängig vom Hintergrund schwer zu erkennen und unterschreitet den geforderten Wert von 3:1. Auch bei vielen Unterseiten der Fall (Bei Verwendung von Firefox)

Blauer Rahmen für Tastaturfokus erfüllt teilweise Kontrastwerte nicht von 3:1 nicht. ZB in der Titelzeile beim dunkelgrünen Hintergrund. Auch bei vielen Unterseiten der Fall (Bei Verwendung von Firefox)

Begründung Einstufung: Webseite sollte annehmbar zu bedienen sein

Kriterium 2.1.1 - Tastatur: Bronze

Datenpicker "Wann?": Fokus Trap funktioniert nicht mehr wenn sobald ein der zwei Datumteile für den Zeitraum ausgewählt wurde

Begründung Einstufung: Erschwert die Bedienung per Tastatur, aber bleibt trotzdem bedienbar.

Kriterium 2.4.7 - Fokus sichtbar: Bronze

Beim Zurücktabben verschwindet der Tastaturfokus hinter der Hauptnavigation.
Begründung Einstufung (bronze): Kann durchaus verwirrend sein.

Kriterium 3.1.2 - Sprache von Teilen: Silber

Liste aus farbigen Symbolen im Footer „UN-Nachhaltigkeitsziele“: alt-Texte sind Englisch (was richtig ist, da ja auch die Symbole englisch sind). Dann muss aber auch die Sprache von Teilen richtig gesetzt werden, damit der Screenreader die alt-Texte richtig ausspricht.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 4.1.1 - Syntaxanalyse: Bronze

Doppelte IDs, doppelte Attribute und Elemente, die nicht als Kind-Element eines anderen Element erlaubt sind:
Begründung Einstufung: mehrere schwerere Fehler, welche auf unterschiedlichen Endgeräten zu Probleme führen können. (Bei den Unterseiten ebenfalls der Fall)

The aria-hidden attribute must not be specified on the noscript element.
Attribute block not allowed on element ul at this point. (3)
Element a not allowed as child of element ul in this context. (Suppressing further errors from this subtree.) (3)
Duplicate ID ___. (19) · Hide all · Show all
Duplicate ID views-exposed-form-user-suche-page-1.
Duplicate ID Like. (18)
Bad value for attribute srcset on element source: Must contain one or more image candidate strings. (54)
Duplicate attribute href. (18)
An img element must have an alt attribute, except under certain conditions. For details, consult guidance on providing text alternatives for images.

BÖ T02: Suchergebnis

Kriterium 2.4.2 - Seite mit Titel versehen: Silber

Titel für Unterseite (Suche) fehlt

BÖ T03: Naturerlebnisse Übersicht

Kriterium 1.3.1 - Info und Beziehungen: Bronze

Navigationsleiste der Suche sollte auch als Navigation ausgezeichnet.
Begründung Einstufung (bronze): erschwert die Verständlichkeit und Bedienbarkeit schon etwas und nimmt auf der Unterseite recht zentrale Funktion ein.

Navigationsleiste der Suche: visuell eine Liste, sollte auch als solche im Code ausgezeichnet werden.
Begründung Einstufung (silber): Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 1.4.1 - Benutzung von Farbe: Bronze

Bei eingeblendeter Karte links: Beim Markieren der Artikel-Container rechts, wird der entsprechende Marker links auf der Karte (nur!) farblich hervorgehoben.
Begründung Einstufung: Ist etwas verwirrend, aber nimmt keine sehr zentrale Rolle ein.

Kriterium 2.1.1 - Tastatur: Bronze

Verschieben der Karte ist nur per Maus möglich. Per Tastatur nicht
Begründung Einstufung (bronze): macht gewisse Interaktionsmöglichkeiten unmöglich für TastaturbenutzerInnen, auch wenn diese keine wirklich zentrale Rolle einnehmen sollten.

Kriterium 3.1.2 - Sprache von Teilen: Silber

Kontrollelement der Karte „Zoom In, Zoom Out, View Fullscreen“ sind auf Englisch, aber nicht entsprechend ausgezeichnet.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

Pagination falsch beschriftet. Screenreader liest folgendes vor „pagination-heading“ (aufgrund des aria-Labels)

Außerdem ist für Screenreader-User nicht wirklich klar auf welcher Seite er/sie sich befindet. Statt zB nur „1“, wäre es besser, wenn „Seite 1, aktuelle Seite“ vorgelesen wird.

Pagination: Seiten werden auch immer nur mit Zahlen vorgelesen. Linkzweck wäre besser verständlich, wenn Screenreader statt „2“ „Ergebnis-Seite 2“ oder ähnliches vorgelesen wird.

Begründung Einstufung (bronze): Recht verwirrend. Für Screenreader-User wahrscheinlich nur schwer verständlich was der Sinn dieses Eingabe-Elementes ist.

BÖ T04: Naturerlebnisse Detail

Kriterium 1.3.1 - Info und Beziehungen: Silber

Im „Info-Kasten“ links gibt es visuell Überschriften „Wo?, Wann?…“. Diese sind aber nicht semantisch als solche ausgezeichnet.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 2.1.1 - Tastatur: Bronze

Verschieben der Karte (oben und unten) ist nur per Maus möglich. Per Tastatur nicht
Begründung Einstufung: macht gewisse Interaktionsmöglichkeiten unmöglich für TastaturbenutzerInnen, auch wenn diese keine wirklich zentrale Rolle einnehmen sollten.

Kriterium 2.4.4 - Linkzweck (im Kontext): Bronze

„Mitmachen & Anmelden“ Link: Linkzweck nicht ersichtlich. Nicht klar, dass ein neuer Tab mit einer externen Seite geöffnet wird.
Begründung Einstufung: Kann durchaus verwirrend sein.

Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

„Teilen“- Button ist nicht (richtig) beschriftet. Screenreader liest nur „Link“ vor.
Begründung Einstufung: Kann für manche BenutzerInnen die Funktion unzugänglich machen. Aber wahrscheinlich keine essentielle Funktion.

BÖ T05: Naturmagazin Übersicht

Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

Tabs oben „Magazin, Naturlexikon, Bauernlexikon“: nicht richtig ausgezeichnet. Für blinde BenutzerInnen nicht klar um welches Kontrollelement es sich hier handelt und auch welches der 3 Reiter gerade aktiv ist. Kann zB so gemacht werden: https://www.w3.org/TR/2016/WD-wai-aria-practices-1.1-20161214/examples/tabs/tabs.html
Begründung Einstufung: Kann durchaus verwirrend sein.

BÖ T06: Naturmagazin Detail

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Rahmen für Youtube-Video könnte besser beschriftet werden: nicht klar, dass es ein Video ist, bis man bei den Bedienelementen des Players ist.
Begründung Einstufung: Ist wahrscheinlich kein essentieller Inhalt

Kriterium 1.2.1 - Reine Audio- und Videoinhalte (aufgezeichnet): Silber

Yoututbe Video: keine Audiobeschreibung oder vollständige Text-Alternative
Begründung Einstufung: Ist wahrscheinlich kein essentieller Inhalt

Kriterium 1.2.3 - Audiodeskription oder Medienalternative (aufgezeichnet): Silber

Yoututbe Video: keine Audiobeschreibung oder vollständige Text-Alternative
Begründung Einstufung: Ist wahrscheinlich kein essentieller Inhalt

Kriterium 1.2.5 - Audiodeskription (aufgezeichnet): Silber

Yoututbe Video: keine Audiobeschreibung oder vollständige Text-Alternative
Begründung Einstufung: Ist wahrscheinlich kein essentieller Inhalt

Kriterium 1.4.11 - Nicht-Text Kontrast: Bronze

Image Slider: Buttons (Pfeile links und rechts, aber auch Schließen-Schalter wenn Bild vergrößert)haben, abhängig vom Hintergrund teilweise einen sehr geringe Kontrast, vor allem wenn fokussiert, da dann dunkel grün. Besser wäre wenn die Buttons eine Hintergrundfarbe wie weiß hätten, dann könnte sichergestellt werden, dass der Kontrast immer ausreicht (3:1).
Begründung Einstufung: Kann durchaus verwirrend sein, auch wenn die Inhalte nicht wirklich essentiell sind.

Kriterium 2.1.1 - Tastatur: Silber

Image Slider: Tastaturbedienung generell etwas eingeschränkt, da man zB nicht, wie bei Mausbedienung die Punkte unten anklicken kann.
Begründung Einstufung: dieser Aspekt sollte kein großes Problem sein, da die Bilder so auch angesprungen werden können.

Kriterium 2.4.4 - Linkzweck (im Kontext): Bronze

Schmetterlinks-App-Links (2mal): hier wäre es gut, wenn der Linkzweck darauf hinweist, dass eine externe Seite angesprungen wird.
Begründung Einstufung: Kann durchaus verwirrend sein.

Kriterium 3.1.2 - Sprache von Teilen: Silber

Image Slider: Schließen-Schalter wenn Bild vergrößert: alternativer Text ist „Close-Button“. Sprache von Teilen verletzt, sollte aber sowieso auf Deutsch übersetzt werden.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 3.2.2 - Bei Eingabe: Bronze

Beim Speichern der Filter "Themen", "Zielgruppe" und "Weitere Filter" wird die Seite neu geladen und der Tastenfokus geht verloren -> Änderung des Kontextes

Begründung Einstufung: die Seite ist zwar bedienbar, aber die Bedienung ist mühsamer.

Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

„Teilen“- Button ist nicht (richtig) beschriftet. Screenreader liest nur „Link“ vor.
Begründung Einstufung: Kann für manche BenutzerInnen die Funktion unzugänglich machen. Aber wahrscheinlich keine essentielle Funktion.

BÖ T07: Registrieren

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Silber

Autocomplete Attribute bei E-Mail Adresse fehlt
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 2.4.7 - Fokus sichtbar: Silber

Nach Abschicken der Registrierung landet der Fokus auf dem visuell nicht mehr sichtbaren (da bestätigten) Cookie Meldung. Fokus ist nicht mehr sichtbar.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 3.3.1 - Fehlererkennung: Bronze

Fehlermeldung „Die E-Mail-Adresse xyz ist bereits vergeben“ ist für Screenreader users schwer zu finden. Fokus springt nicht hin, es wird keine Benachrichtigung ausgegeben (zb mittels aria-live).
Begründung Einstufung: Kann durchaus verwirrend sein.

Kriterium 4.1.3 - Statusmeldungen: Bronze

Nach erfolgreicher Registrierung: Meldung „Es wurde eine Willkommensnachricht mit weiteren Anweisungen an deine E-Mail-Adresse versandt.“ ist für Screenreader users schwer zu finden. Fokus springt nicht hin, es wird keine Benachrichtigung ausgegeben (zb mittels aria-live).
Begründung Einstufung: Kann durchaus verwirrend sein. Da mit dieser E-Mail ja auch das Konto aktiviert werden muss.

BÖ T08: Login

Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Silber

Login Form: Autocomplete Attribute bei E-Mail und Passwort Feld nicht vorhanden.

„Passwort zurücksetzen“ Form: Autocomplete Attribute bei E-Mail nicht vorhanden.

Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

BÖ T09: Benachrichtigungen

Kriterium 3.1.2 - Sprache von Teilen: Bronze

Rotes Feld „Please fill out all required fields. “ + Close-Schalter:
Sprache von Teile nicht erfüllt, sowohl bei Text als auch Beschriftung des Schließen Schalters. Sollte aber sowieso übersetzt werden.
Begründung Einstufung: Kann durchaus verwirrend sein. Vor allem für Personen die der englischen Sprache nicht mächtig sind.

Kriterium 3.3.2 - Beschriftungen (Labels) oder Anweisungen: Silber

Fußnoten bei „per E-Mail*“ und „per Browser**“ sollten am Besten auch noch verlinkt werden zur Beschreibung unten, da sie sonst umständlich für Screenreader User zu finden ist.
Begründung Einstufung: Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben

Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

Bell-Icon / Benachrichtigungsanzeige-Icon: falsch beschriftet mit „notis 1“. Außerdem scheint es hier einen Bug zu geben. Da „1“ angezeigt wird, was suggeriert dass eine Nachricht vorhanden ist. Aber Benachrichtigungen sind leer.
Begründung Einstufung: Kann durchaus verwirrend sein.

BÖ T10: Profil einrichten

Kriterium 3.3.1 - Fehlererkennung: Bronze

Fehlermeldungen zB für Vor- und Nachname sind für Screenreader users schwer zu finden. Fokus springt nicht hin, es wird keine Benachrichtigung ausgegeben (zb mittels aria-live). Stattdessen landet der Fokus auf dem visuell nicht mehr sichtbaren (da bestätigten) Cookie Meldung. Fokus ist nicht mehr sichtbar.
Begründung Einstufung: Kann durchaus verwirrend sein.

Kriterium 3.3.2 - Beschriftungen (Labels) oder Anweisungen: Bronze

Anrede-Label ist nicht richtig verlinkt
Begründung Einstufung (bronze): Kann durchaus verwirrend sein.

Statt PLZ sollte bei diesem Feld ein anderes Label (zumindest für SR-users) gewählt werden, da es sonst vom Screenreader als „Please“ vorgelesen wird.
Begründung Einstufung (silber): Sollte keinen gravierenden Einfluss auf die Bedienbarkeit haben