Prečo sa Prístupnosť a Súhlas Teraz Prekrývajú

GDPR vyžaduje, aby súhlas mohol byť získaný od každého používateľa, nielen od tých, ktorí dokážu vidieť a kliknúť na banner. Európsky výbor pre ochranu údajov objasnil, že ak dotknutá osoba nedokáže zmysluplne interagovať s rozhraním súhlasu — z dôvodu zdravotného postihnutia, ktoré stránka nezohľadnila — súhlas nebol platne získaný. To znamená, že súbory cookie nikdy nemali byť načítané.

Na strane prístupnosti Európsky akt o prístupnosti (EAA), transponovaný do vnútroštátnych právnych predpisov vo všetkých členských štátoch EÚ, robí z WCAG 2.1 AA minimum pre webové stránky a aplikácie súkromného sektora ponúkajúce spotrebiteľské služby. Systém sankcií sa líši v závislosti od krajiny, ale zvyčajne sa pohybuje od 50 000 do 500 000 eur za porušenie, plus príkazy na stiahnutie z trhu za pretrvávajúce nedodržiavanie.

Základné Požiadavky WCAG na Bannery Súborov Cookie

Ovládateľnosť Klávesnicou

Každý ovládací prvok bannera — Prijať, Odmietnuť, Spravovať predvoľby, zatvoriť — musí byť dostupný a ovládateľný iba klávesnicou. Používatelia by mali byť schopní pomocou Tab prechádzať tlačidlami v logickom poradí a aktivovať ich pomocou Enter alebo Space. Fokus musí byť viditeľný s minimálnym kontrastným pomerom 3:1 voči pozadiu.

Zachytenie Fokusu v Modálnych Banneroch

Ak banner blokuje interakciu so zvyškom stránky, fokus klávesnice musí byť zachytený vo vnútri bannera, kým používateľ neurobí výber. Používatelia by nemali byť schopní Tab-ovať sa von z bannera, aby posúvali podkladovú stránku. Keď bol fokus zachytený a banner sa zatvorí, fokus by sa mal vrátiť na prvok, ktorý banner aktivoval, alebo na rozumné predvolené nastavenie.

Oznámenia Čítačky Obrazovky

Banner musí byť oznámený ako dialóg s prístupným názvom a rolou. Použite `role="dialog"` alebo `role="alertdialog"` s `aria-labelledby` odkazujúcim na nadpis bannera a `aria-describedby` odkazujúcim na vysvetľovací text.

Farebný Kontrast

Text tela musí spĺňať kontrast 4,5:1 voči pozadiu; veľký text (18pt+ alebo 14pt tučné) vyžaduje 3:1. Text tlačidiel, ikony a indikátory fokusu majú vlastné minimálne hodnoty kontrastu. Svetlošedé tlačidlo „Odmietnuť" na bielom pozadí je častým zlyhaním WCAG, ktoré vidíme v auditoch.

Žiadne Podnety Iba na Základe Farby

Nespoliehajte sa výlučne na farbu pri rozlišovaní Prijať od Odmietnuť. Používajte odlišné štítky, ikony alebo tvary, aby používatelia s poruchou farebného videnia mohli rozlíšiť tlačidlá.

Temné Vzory a Prístupnosť

WCAG 2.2 zavádza nové kritériá, ktoré priamo smerujú na temné vzory — obzvlášť relevantné pre súhlas:

• 3.3.8 Prístupná Autentifikácia — zakazuje kognitívne hádanky ako bariéru pri udeľovaní súhlasu.
• 3.3.7 Redundantné Zadávanie — používatelia by nemali musieť znovu zadávať informácie len preto, aby odvolali súhlas.
• 2.4.11 Fokus Nie je Zakrytý — samotný banner by nemal zakrývať indikátor fokusu prvkov za ním.
• 2.5.7 Pohyby Ťahania — ak váš banner používa interakciu ťahania na prijatie, musí existovať alternatíva s jedným ukazovateľom.

RTL a Internacionalizácia

Prístupnosť sa vzťahuje na jazyky sprava doľava (arabčina, hebrejčina, perzština, urdčina) a výslovnosť čítačky obrazovky:

• Nastavte `dir="rtl"` na banneri, keď je jazyk dokumentu RTL, aby poradie tlačidiel a tok fokusu zodpovedali smeru čítania.
• Používajte správne atribúty `lang` na preloženom texte bannera, aby čítačky obrazovky vyslovovaly slová so správnou fonetikou.
• Zrkadlenie ikonografie — šípy, šípky a indikátory pokroku by sa mali pre lokality RTL otočiť.

Testovanie Vášho Bannera na Súlad s WCAG

Nespoliehajte sa na jediný nástroj. Skombinujte automatické skenovanie s reálnym testovaním asistenčných technológií:

• axe DevTools alebo Lighthouse — automaticky zachytáva približne 30–40% zlyhaní WCAG.
• NVDA alebo JAWS na Windows, VoiceOver na Mac/iOS, TalkBack na Android — testujte so skutočnými čítačkami obrazovky. Môže byť banner oznámený, navigovaný a odmietnutý iba pomocou čítačky obrazovky?
• Navigácia iba klávesnicou — odpojte myš. Ak nedokážete Prijať, Odmietnuť a spravovať predvoľby, používatelia klávesnice to tiež nedokážu.
• Simulácia farbosleposti — Chrome DevTools má zabudované simulátory zrakových porúch. Skontrolujte, či sú Prijať a Odmietnuť rozlíšiteľné pri protanópii, deuteranópii a tritanópii.
• Priblíženie na 400 % — WCAG vyžaduje, aby obsah zostal použiteľný pri 400 % priblížení bez horizontálneho rolovania. Bannery s pevnou polohou tento test často nesplnia.

Bežné Zlyhania Prístupnosti, Ktoré Vidíme

• Odmietnuť skrytý za ikonou ozubeného kolieska — temný vzor plus zlyhanie prístupnosti (žiadny prístupný názov na tlačidle s ikonou).
• Fokus nikdy nedosiahne banner — bannery, ktoré kradnú vizuálnu pozornosť, ale sú preskočené v poradí Tab.
• Modálny banner bez zachytenia fokusu — používatelia môžu Tab-ovať sa na stránku na pozadí, kým banner tvrdí, že blokuje interakciu.
• Žiadne `aria-live` pri zmenách predvolieb — používatelia čítačky obrazovky nepočujú potvrdenie, že ich výber bol uložený.
• Preložené bannery bez atribútu `lang` — čítačky obrazovky vyslovujú španielsky text s anglickou fonetikou.

Ako FlexyConsent Zabezpečuje Prístupnosť