Dieser Artikel ist auch verfügbar in:

Ist das Cookie-Banner barrierefrei? WCAG 2.2 AA und ADA (Neue Version)

Übersicht

Das Pandectes-Cookie-Banner ist WCAG 2.2 Level AA zertifiziert. Zoonou Limited, ein unabhängiges Prüfunternehmen für Barrierefreiheit, hat es nach WCAG 2.2, Section 508 und EN 301 549 geprüft und die Ergebnisse in einem VPAT-2.5-Konformitätsbericht veröffentlicht.

Die Prüfung umfasst jede Ebene, die ein Besucher öffnen kann: den Cookie-Hinweis, die Einstellungen und die Cookie-Details. Sie umfasste manuelle Tests mit den Screenreadern JAWS, NVDA und VoiceOver, der Windows-Lupe, der Sprachsteuerung Dragon sowie VoiceOver und TalkBack auf Mobilgeräten. Jedes WCAG-2.2-Kriterium der Stufen A und AA wurde mit Supports oder Not Applicable bewertet.

Die vollständige Konformitätserklärung finden Sie auf unserer Website: Barrierefreiheit: Konformität.

New Banner. Für Shops mit dem Abzeichen New version auf Cookie banner. Zum Legacy Banner siehe So wechseln Sie zum neuen Banner oder zurück zur vorherigen Version.

WCAG, ADA und Ihr Shop

Für ADA gibt es kein offizielles Zertifikat für Websites. In den USA ist WCAG der am häufigsten genutzte Maßstab, wenn die ADA auf Websites angewendet wird. In der Europäischen Union verweist der European Accessibility Act auf EN 301 549, das WCAG einschließt. Das Banner erfüllt beides.

Die Zertifizierung betrifft das Banner selbst. Ihr Theme, Produktinhalte und Checkout müssen die Richtlinien weiterhin eigenständig erfüllen. Dieser Artikel dient der Information und ist keine Rechtsberatung.

Wenn Sie unsere Ergebnisse mit einem Prüfer teilen, ist die Seite Barrierefreiheit: Konformität der beste Link dafür.

Häufige Prüfergebnisse erklärt

Automatische Scanner und einige Prüfungen melden dieselben drei Punkte. Hier erfahren Sie, wie sich das Banner verhält und was Sie ändern können.

"Der Fokus ist nicht im Banner gefangen"

Standardmäßig ist das Banner nicht modal. Besucher können die Seite beim Öffnen weiter lesen und durchsuchen, sodass der Tastaturfokus zwischen Banner und Seite wechselt. Das ist beabsichtigt: WCAG verlangt einen gefangenen Fokus nur, wenn ein Dialog den Rest der Seite blockiert, und das Erfolgskriterium 2.1.2 (No Keyboard Trap) verlangt, dass Besucher den Fokus von nicht modalen Inhalten immer wegbewegen können.

Wenn Besucher vor der Nutzung der Seite eine Entscheidung treffen sollen, aktivieren Sie erzwungene Einwilligung. Das Banner öffnet sich dann als modaler Dialog: Die Seite dahinter ist blockiert, und Tab sowie Shift + Tab bleiben im Banner, bis der Besucher eine Wahl trifft.

Öffnen Sie Shopify-Admin > Apps > Pandectes GDPR Compliance.
Gehen Sie zu Cookie banner.
Öffnen Sie den Tab Advanced.
Aktivieren Sie unter Enforced consent (modals) die Option Enforced consent (modals).
Optional: Aktivieren Sie Lock background scroll.
Speichern.

Weitere Details: So verwenden Sie erzwungene Einwilligung (Modals) im New Banner.

"Der Fokus wechselt nach dem Schließen des Banners nicht zur Seite"

Beim Öffnen des Banners wandert der Tastaturfokus hinein, sodass Tastatur- und Screenreader-Nutzer mit der Banner-Meldung beginnen.

Beim Schließen verlässt der Fokus das Banner und kehrt zur Seite zurück:

Hat der Besucher das Banner über Consent widget oder einen Reopen-Link geöffnet, kehrt der Fokus zu diesem Widget oder Link zurück.
Beim ersten Besuch hatte vor dem Banner nichts auf der Seite den Fokus, daher setzt die nächste Tab-Taste dort an, wo das Banner auf der Seite liegt.

Der Fokus bleibt nie auf einem verborgenen Element, und kein Teil der Seite wird übersprungen. Wenn der Fokus nach dem Schließen auf einem bestimmten Element landen soll (zum Beispiel einem Link Skip to content Ihres Themes), ist das eine Änderung am Theme und nicht am Banner.

"Links kündigen nicht an, dass sie einen neuen Tab oder eine andere Website öffnen"

Die Links im Banner sind die, die Sie auf dem Tab Content unter Links festlegen:

Privacy policy und Imprint öffnen standardmäßig im selben Tab. Sie öffnen nur dann in einem neuen Tab, wenn Sie Always open links in a new tab aktivieren.
Der Link Google partners öffnet Googles Seite immer in einem neuen Tab.
In den Einstellungen öffnen Links Learn more about provider die Seite des Anbieters in einem neuen Tab.

Ein Link, der ohne Warnung in einem neuen Tab öffnet, verstößt nicht gegen WCAG 2.2 Level A oder AA, eine Warnung ist aber hilfreich. Sie können auf zwei Arten eine hinzufügen:

Öffnen Sie Shopify-Admin > Apps > Pandectes GDPR Compliance.
Gehen Sie zu Cookie banner.
Öffnen Sie den Tab Content und scrollen Sie zu Links.
Entweder deaktivieren Sie Always open links in a new tab, damit Ihre eigenen Seiten im selben Tab öffnen, oder Sie ergänzen die Warnung im Linktext, zum Beispiel Privacy policy (opens in a new tab).
Speichern Sie und wiederholen Sie die Änderung in All settings > Translations für Ihre anderen Sprachen.

Weitere Details: So bearbeiten Sie Banner-Texte und Links (New Version).

Das Banner nach der Anpassung barrierefrei halten

Die Zertifizierung gilt für das Banner in der ausgelieferten Form. Manche Änderungen können Kontrast oder Lesbarkeit verringern:

Colors: sorgen für ausreichenden Kontrast zwischen Text und Hintergrund sowie zwischen Schaltflächen und deren Beschriftungen. Im Zweifel nutzen Sie eine Voreinstellung im Tab Style.
Custom styling (CSS): dürfen Fokusrahmen nicht ausblenden, Text nicht unter eine lesbare Größe verkleinern und keine Schaltflächen verbergen.
Texts: sollten klare Schaltflächenbeschriftungen behalten, etwa Accept, Decline und Preferences.

Feedback

Wenn Sie oder Ihr Prüfer im Banner etwas finden, das schwer zu bedienen ist, kontaktieren Sie uns über den Chat in der App. Wir hören lieber von einer Hürde, als dass ein Besucher deswegen geht.