Arbeta med tillgänglighet / WCAG
Som standard är samtyckesskiktet förberett för att vara tillgängligt för skärmläsare och liknande verktyg, men i vissa fall kan justeringar av designinställningarna vara nödvändiga.
Aktivera WCAG-stöd för Cookie Banners
För att aktivera stödet för WCAG (Web Content Accessibility Guidelines 2.2), vänligen logga in på ditt konto och gå till Meny > Motiv och redigera motsvarande design. Utöka inställningarna på "Boxinställningar" och aktivera WCAG:
WCAG-ändringar i samtyckesskiktets utdata
Om WCAG-inställningen är aktiverad för en design kommer följande ändringar att tillämpas på samtyckesskiktet:
- Samtyckslagret kommer att lindas in i ett shadowRoot-element
- Rubriker i samtyckeslagret kommer att använda element och i stället för
- Växla texter kommer att använda element istället för
- Meny på lager med anpassade inställningar kommer att använda element i stället för
- Åldersverifieringselement kommer att bifogas med en etikett
- Tabeller kommer att vara textade
- Element kommer att få aria-etikett, aria-markerad, aria-modal, roll och liknande attribut
- Gatekeeper-alternativet är tillgängligt (se nedan)
Gatekeeper alternativ
När WCAG är aktiverat kan alternativet Gatekeeper också aktiveras. Detta förhindrar att samtyckesskiktet tappar fokus: Om användaren trycker på TAB-tangenten (eller liknande navigeringselement på sitt tangentbord) kommer fokus alltid att stanna inom samtyckesskiktet och inte hoppa till positioner på webbplatsen.
Designhänsyn
Observera att de tekniska ändringarna också kan kräva ytterligare ändringar i själva designen för att bli helt WCAG-kompatibel. Exempel inkluderar:
- Använd en korrekt teckenstorlek (t.ex. em eller pt istället för px)
- Använda ett sans serif-typsnitt som är allmänt tillgängligt (t.ex. Times New Roman, Verdana, Arial, ...)
- Använda ett färg- och kontrastförhållande som lätt kan särskiljas (t.ex. kontrastförhållande 3:1 mellan text och bakgrund)
- Använd ett textmellanrum som gör det lätt att läsa innehållet (t.ex. radhöjd på 1.5 em)
Förutom rent grafiska ändringar, kan vissa WCAG-krav kräva att du använder vissa inställningar i designen. Till exempel, för att uppfylla WCAG-kraven kan du behöva aktivera menyer i ditt samtyckeslagerdesign.
Ytterligare läsning
- WCAG-riktlinjer på w3.org: https://www.w3.org/TR/WCAG22/
