> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.pandectes.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Is de cookiebanner toegankelijk? WCAG 2.2 AA en ADA (Nieuwe versie)

### Overzicht

De Pandectes-cookiebanner is **WCAG 2.2 Level AA-gecertificeerd**. Zoonou Limited, een onafhankelijk bedrijf voor toegankelijkheidstests, heeft de banner gecontroleerd aan de hand van **WCAG 2.2**, **Section 508** en **EN 301 549**, en de resultaten gepubliceerd in een VPAT 2.5-conformiteitsrapport.

De audit omvat elke laag die een bezoeker kan openen: de cookiemelding, de voorkeuren en de cookiedetails. Hij omvatte handmatige tests met de schermlezers JAWS, NVDA en VoiceOver, Windows Magnifier, Dragon-spraakbesturing, en VoiceOver en TalkBack op mobiel. Elk WCAG 2.2-criterium op niveau A en AA kreeg de beoordeling **Supports** of **Not Applicable**.

Je kunt de volledige conformiteitsverklaring lezen op onze website: [Accessibility conformance](https://pandectes.io/accessibility-conformance/).

||| **Nieuwe banner.** Voor winkels met de badge **New version** bij **Cookie banner**. Zie voor de legacy banner [Zo schakel je over naar de nieuwe banner of terug naar de vorige versie](/nl/article/overstappen-naar-de-nieuwe-banner-of-terug-naar-de-vorige-versie-1l5zakw/).

### WCAG, ADA en je winkel

De ADA kent geen officieel certificaat voor websites. In de Verenigde Staten is **WCAG** de meest gebruikte maatstaf wanneer de ADA op websites wordt toegepast. In de Europese Unie verwijst de European Accessibility Act naar **EN 301 549**, die WCAG omvat. De banner voldoet aan beide.

De certificering geldt voor de banner zelf. Je thema, productinhoud en checkout moeten nog steeds zelfstandig aan de richtlijnen voldoen. Dit artikel is informatie, geen juridisch advies.

Als je onze resultaten met een auditor deelt, is de pagina [Accessibility conformance](https://pandectes.io/accessibility-conformance/) de beste link om te sturen.

### Veelvoorkomende auditbevindingen, uitgelegd

Geautomatiseerde scanners en sommige audits markeren dezelfde drie punten. Hier lees je hoe de banner zich gedraagt en wat je kunt wijzigen.

#### "Focus is not trapped inside the banner"

Standaard is de banner **non-modal**. Bezoekers kunnen de pagina blijven lezen en bekijken terwijl de banner open is, dus het toetsenbord beweegt van de banner naar de pagina en terug. Dit is zo bedoeld: WCAG verwacht alleen dat de focus binnen een dialoog blijft wanneer de dialoog de rest van de pagina blokkeert, en succescriterium 2.1.2 (No Keyboard Trap) vereist dat een bezoeker de focus altijd weg kan bewegen van non-modal inhoud.

Als je wilt dat bezoekers een keuze maken voordat ze de pagina kunnen gebruiken, schakel dan afgedwongen toestemming in. De banner opent dan als een **modal dialog**: de pagina erachter wordt geblokkeerd en **Tab** en **Shift + Tab** blijven binnen de banner totdat de bezoeker een keuze maakt.

1. Open **Shopify Admin > Apps > Pandectes GDPR Compliance**.
2. Ga naar **Cookie banner**.
3. Open het tabblad **Advanced**.
4. Schakel onder **Enforced consent (modals)** de optie **Enforced consent (modals)** in.
5. Optioneel: schakel **Lock background scroll** in.
6. Sla op.

Meer details: [Afgedwongen toestemming (modals) gebruiken in de nieuwe banner](/nl/article/afgedwongen-toestemming-modals-gebruiken-in-de-nieuwe-banner-qnh1i5/).

#### "Focus does not move to the page after the banner closes"

Wanneer de banner opent, gaat de toetsenbordfocus naar de banner, zodat gebruikers van toetsenbord en schermlezer beginnen bij het bannerbericht.

Wanneer de banner sluit, verlaat de focus de banner en gaat terug naar de pagina:

* Als de bezoeker de banner heeft geopend via de **Consent widget** of een link om opnieuw te openen, keert de focus terug naar die widget of link.
* Bij het eerste bezoek had niets op de pagina focus vóór de banner, dus de volgende druk op **Tab** gaat verder vanaf de positie van de banner op de pagina.

De focus blijft nooit op een verborgen element en er wordt geen enkel deel van de pagina overgeslagen. Als je wilt dat de focus na het sluiten van de banner op een specifiek element terechtkomt (bijvoorbeeld de link **Skip to content** van je thema), is dat een aanpassing in je thema en niet in de banner.

#### "Links do not announce that they open a new tab or another website"

De links in de banner zijn die je instelt op het tabblad **Content** onder **Links**:

* **Privacy policy** en **Imprint** openen standaard in hetzelfde tabblad. Ze openen alleen in een nieuw tabblad als je **Always open links in a new tab** inschakelt.
* De link **Google partners** opent de pagina van Google altijd in een nieuw tabblad.
* In de voorkeuren openen de links **Learn more about provider** de pagina van de provider in een nieuw tabblad.

Een link zonder waarschuwing in een nieuw tabblad openen is geen WCAG 2.2 Level A- of AA-fout, maar een waarschuwing is nuttig. Je kunt er op twee manieren een toevoegen:

1. Open **Shopify Admin > Apps > Pandectes GDPR Compliance**.
2. Ga naar **Cookie banner**.
3. Open het tabblad **Content** en scroll naar **Links**.
4. Schakel **Always open links in a new tab** uit, zodat je eigen pagina's in hetzelfde tabblad openen, of voeg de waarschuwing toe aan de linktekst, bijvoorbeeld `Privacy policy (opens in a new tab)`.
5. Sla op en herhaal de wijziging vervolgens in **All settings > Translations** voor je andere talen.

Meer details: [Zo bewerk je banneroverteksten en links (Nieuwe versie)](/nl/article/banner-teksten-en-links-bewerken-nieuwe-versie-q9ewov/).

### Houd de banner toegankelijk nadat je hem hebt aangepast

De certificering geldt voor de banner zoals wij hem leveren. Sommige wijzigingen kunnen het contrast of de leesbaarheid verlagen:

* **Kleuren:** zorg voor voldoende contrast tussen tekst en achtergrond, en tussen knoppen en hun labels. Gebruik bij twijfel een preset op het tabblad **Style**.
* **Aangepaste styling (CSS):** verberg geen focusomlijningen, maak tekst niet kleiner dan een leesbare grootte en verberg geen knoppen.
* **Teksten:** houd knoplabels duidelijk, zoals **Accept**, **Decline** en **Preferences**.

### Feedback

Als jij of je auditor iets in de banner vindt dat moeilijk te gebruiken is, neem dan contact met ons op via de chat in de app. We horen liever over een barrière dan dat een bezoeker er door weggaat.

### Gerelateerde artikelen

* [Afgedwongen toestemming (modals) gebruiken in de nieuwe banner](/nl/article/afgedwongen-toestemming-modals-gebruiken-in-de-nieuwe-banner-qnh1i5/)
* [Zo bewerk je banneroverteksten en links (Nieuwe versie)](/nl/article/banner-teksten-en-links-bewerken-nieuwe-versie-q9ewov/)
* [Zo schakel je over naar de nieuwe banner of terug naar de vorige versie](/nl/article/overstappen-naar-de-nieuwe-banner-of-terug-naar-de-vorige-versie-1l5zakw/)