Zertifikatsbericht für Clever Leben

Webseiten Betreiber: Delikatessa Lebensmittel-Handels-und Erzeugungs-Gesellschaft m.b.H.
Webseiten Domain: www.cleverleben.at
Zertifikat Status: Silber
Zertifizierungsdatum: 23.11.2020

Allgemeiner Kommentar:

Erster jährlicher Überprüfungsaudit durchgeführt am: 21.12.2021

Vom Audit ausgeschlossen sind folgende Inhalte bzw. Funktionen der Website:
a. PDFs
b. EPUB
c. Flash
d. live übertragene zeitbasierte Medien
e. Inhalte, die nur für eine geschlossene Gruppe von Personen und nicht für die allgemeine Öffentlichkeit verfügbar sind (Extranets und Intranets).
f. 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:
1. Drittanbieter Inhalte, mit denen man nicht interagieren kann (z.B. Facebook Trackingpixel), sind von der Überprüfung ausgenommen.
2. Drittanbieter Inhalte, die keine grundlegende, zentrale Funktionalität der Seite bereitstellen, sind von der Überprüfung ausgenommen.
3. Drittanbieter Inhalte, die zusätzliche Informationen bereitstellen und für die BenutzerInnen essentiell sind, benötigen eine Alternative.
4. Wenn eine Website weitestgehend aus Drittanbieter Inhalten besteht, wird eine Zertifizierung abgelehnt und Auftrag nicht angenommen.
g. Online-Karten und Kartendienste, diese müssen aber eine barrierefreie Alternative haben.
h. Google Captcha (ReCaptcha V2): Verwendung gültig nur für die Qualitätsstufen Silver und Bronze.
i. Websites mit nicht deutscher und/oder englischer Sprache.

Definition der grundsätzlichen Merkmale und Ausrichtung der Abstufungen für Gold:
• Website ist WCAG 2.0 AA konform und erfüllt Grundform aller Erfolgskriterien
• Die Website ist für alle BenutzerInnen vollständig zugänglich (gemäß WCAG 2.0 AA)
Silber:
• Website erfüllt weitgehendst die WCAG 2.0 AA - Erfolgskriterien
• Der gesamte Inhalt ist für alle BenutzerInnen zugänglich
• Die Grundfunktionalität ist für alle BenutzerInnen uneingeschränkt zugänglich
• Teile der erweiterten/optionalen Funktionalität sind für einige BenutzerInnen umständlicher zu bedienen, aber trotzdem zugänglich
Bronze:
• Website erfüllt die meisten WCAG 2.0 AA - Erfolgskriterien
• Die Grundfunktionalität ist für alle BenutzerInnen uneingeschränkt zugänglich
• Teile der erweiterten/optionalen Funktionalität, die für die Benutzung der Website wenig relevant sind, sind für einige BenutzerInnen nicht zugänglich

cleverleben: T01 Home

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Headerimage fehlt der Alt-Text, wodurch man zwar den Button zu den Rezepten angezeigt bekommt, aber keine Info erhält, dass es sich um festliche Menüs zu Weihnachten handelt.

Kriterium 1.3.1 - Info und Beziehungen: Silber

Die Frontpage verfügt über keine H1

Kriterium 1.4.3 - Kontrast (Minimum): Bronze

Es wird zwar ein Kontrast-Switch geboten, der jedoch die User Experience ebenfalls nur peripher verbessert, da andere Inhalte dadurch wieder den Kontrast verlieren (Bild auf Texten, usw).

Kriterium 1.4.4 - Textgröße ändern: Silber

Es gehen bei Vergrößerung Inhalte im Bereich der Social Media Posts verloren.

Kriterium 1.4.5 - Bilder eines Textes: Silber

Bilder eines Textes werden im Hero Image nicht beschrieben.

Kriterium 2.4.6 - Überschriften und Beschriftungen (Labels): Silber

H1 fehlt.

Kriterium 2.4.7 - Fokus sichtbar: Silber

Fokus ist fast überall sichtbar. Teilweise wird er bei den Produkten abgeschnitten, oder ist bei den Social Media Posts überhaupt nicht sichtbar.

Kriterium 3.3.1 - Fehlererkennung: Silber

Suche funktioniert erst ab 2 Characters. Info darüber wird bei Eingabe von einem Buchstaben nicht ausgegeben.

Kriterium 3.3.2 - Beschriftungen (Labels) oder Anweisungen: Silber

Suchfeld verfügt über keine Info zu Bedingung von min. 2 Buchstaben

Kriterium 3.3.3 - Fehlerempfehlung: Silber

Keine Fehlerempfehlung bei Suche.

Kriterium 4.1.1 - Syntaxanalyse: Silber

Kleinere Fehler, die aber keine nachteiligen Auswirkungen auf User haben.

cleverleben: T02 Produktübersicht

Kriterium 3.3.1 - Fehlererkennung: Silber

Hauptsache gibt keinen Response, wenn man nach einem Buchstaben sucht. Die Suche in der Lebensmittel-Übersicht hingegen gibt auch für einen Buchstaben Resultate aus.

Kriterium 4.1.1 - Syntaxanalyse: Silber

Kleinere Fehler, die aber keinen Nachteil für User bringen.

cleverleben: T03 Produktliste

Kriterium 1.3.1 - Info und Beziehungen: Silber

Korrekte Hierarchie ist nich gegeben, jedoch keine grobe Einschränkung.

Kriterium 1.4.4 - Textgröße ändern: Bronze

Durch die Vergrößerung der Seite auf 200% ändert sich der Kontext, da im Footer befindliche Links in das mobile Menü verschoben werden (Rezepte, Newsletter).

Kriterium 2.4.7 - Fokus sichtbar: Silber

Wie bereits auf der Startseite angemerkt, wird die Outline von Elementen nicht durchgängig dargestellt (Filialfinder, Einkaufsliste). Durch den Hover-Effekt, der auch einen Fokusstate entspricht, wird jedoch die Unterscheidbarkeit dennoch gewahrt.

cleverleben: T04 Produktdetail

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Durch die falsche Reihenfolge der Elemente (Bild, Preis, Titel), wurden Alternativtexte für das Produktbild bewusst gleich benannt, wie der danachfolgende Titel, um einen Kontext herzustellen. Dadurch wird jedoch eine korrekte Bildbeschreibung verhindert. zB. Becher, Tetrapack, Plastilkbeutel;

Kriterium 1.3.1 - Info und Beziehungen: Silber

Durch die inkonsistente Darstellung der Hierarchie (Headlines), weicht der visuelle Kontext von Größe und Farbe gegenüber jenem einer Audioausgabe ab. So wurde im oberen Bereich "Einfach clever" (Hellblau, 2rem) als eine H2 definiert, während im unteren Bereich "Ähnliche Produkte" eine H2 darstellen, jedoch mit dem CSS einer H1 versehen wurden.

Kriterium 1.4.3 - Kontrast (Minimum): Silber

Die H2 "Einfach clever" verfügt über einen zu geringen Kontrast.

Kriterium 1.4.4 - Textgröße ändern: Silber

Wird die Seite auf 200% vergrößert, wechselt die Seite in das mobile Design, wodurch die position von Elementen verändert wird. So wandern zwei Elemente aus der Footer Navigation in das mobile Menü, die Einkaufsliste in die Prouktdetailansicht.

Kriterium 2.4.7 - Fokus sichtbar: Silber

Durch die nicht durchgehend gleiche Fokusierung (Outline) von Elementen. Hover ist jedoch vorhanden.

cleverleben: T05 Rezeptsuche

Kriterium 1.3.1 - Info und Beziehungen: Silber

Die Überschriftenstruktur ist inkonsistent. H4 (Teaser-Title) folgt auf H2 (Rezept suchen). H2 sieht gleich, wie Filter-Überschriften aus.

Kriterium 1.4.3 - Kontrast (Minimum): Silber

"Filter zurücksetzen" verfügt über keinen ausreichenden Kontrast.

Kriterium 2.4.7 - Fokus sichtbar: Silber

Betrifft ebenfalls hier konsistente Verwendung von Outlines. Hover jedoch existent.

cleverleben: T06 Rezeptdetail

Kriterium 1.4.4 - Textgröße ändern: Silber

Wenn man 200% vergrößert, geht die Druck-Funktion verloren, da scheinbar diese nicht für mobile Geräte gedacht ist.

Kriterium 3.3.1 - Fehlererkennung: Silber

Hauptsuche gibt bei Eingabe von einem Buchstaben keinen Response.

Kriterium 4.1.1 - Syntaxanalyse: Silber

Mehrere kleine Fehler, wie etwa:
Element p not allowed as child of element span in this context. (Suppressing further errors from this subtree.)

From line 867, column 29; to line 867, column 53

<p class="headline-slim">pro Person..

Restliche Fehler haben keine Auswirkungen.

cleverleben: T07 Contentseite - Über die Marke

Kriterium 1.3.1 - Info und Beziehungen: Silber

Die Überschriften Hierarchie sowie deren konsistente Darstellung sind nicht gegeben. So folgt auf eine H2 eine h4, bzw. sieht die H2 wie der übrige Fließtext aus.

Kriterium 2.4.7 - Fokus sichtbar: Silber

inkonsistente Darstellung des Fokus-Stils (Outlines).

cleverleben: T08 Contentseite - Testimonial

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Es fehlt der Alternativ-Text beim Bild. Da es hier um eine Beschreibug geht, erfüllt die H1 nicht den Zweck.

Kriterium 2.4.7 - Fokus sichtbar: Silber

erneut die fehlende konsistente Auszeichnung des Fokus (Outlines)

cleverleben: T09 Newsletteranmeldung

Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

Es gibt zwar einen Alternativtext, der aber nicht das Bild beschreibt. Dadurch wird zudem noch eine redundaten Information vermittelt, da der darauffolgende Titel genau gleich lautet.

Kriterium 2.4.7 - Fokus sichtbar: Silber

inkonsistente Auszeichnung (Outlines), jedoch Hovere vorhanden.

cleverleben: T10 Kontaktformular

Kriterium 3.2.2 - Bei Eingabe: Silber

Der Datepicker gibt keine sinnvolle Information aus.

cleverleben: T11 Suchergebnisseite

Kriterium 2.4.7 - Fokus sichtbar: Silber

Keine konsistente Outline, jedoch Hover.

cleverleben: T12 Filialfinder

Kriterium 2.4.7 - Fokus sichtbar: Silber

Outlines nicht konsistent, Hover jedoch vorhanden.

Kriterium 3.3.2 - Beschriftungen (Labels) oder Anweisungen: Silber

Das Autocomplete gibt dem Screenreader keine Info über Vorschläge aus.

Kriterium 4.1.2 - Name, Rolle, Wert: Silber

Autocomplete Optionen werden nicht vorgelesen.

cleverleben: T13 Gewinnspiel neu

Kriterium 2.4.7 - Fokus sichtbar: Silber

inkonsistente Outlines, Hover jedoch vorhanden

cleverleben: T14 Einkaufsliste

Kriterium 2.4.7 - Fokus sichtbar: Silber

keine konsistenten Outlines, jedoch Hover

cleverleben: T15 Zufallssample neu

Kriterium 1.3.1 - Info und Beziehungen: Silber

Die Überschriften Hierarchie ist inkonsistent. Da zB. Tipp suchen lediglich für de Screenreader ausgezeichnet ist.

Kriterium 2.4.7 - Fokus sichtbar: Silber

keine konsistenten Outlines, jedoch Hover;