4.1.2; 2.4.3 Odkaz „Napíšte nám“ otvára formulár ako tlačidlo a zameranie sa po otvorení aj zatvorení stratí

Porušenie sa týka celého webového sídla.

Popis problému:

Na každej stránke je v pruhu „Našli ste na stránke chybu?“ odkaz <a href="#" class="sdn-feedbackbar__link">Napíšte nám</a>. Neodkazuje na inú stránku: skript zruší navigáciu a na jeho mieste vykreslí formulár „Nahlásenie chyby“. Odkaz nemá aria-expanded a ako odkaz nereaguje na medzerník. Pri otvorení formulára sa odkaz odstráni a zameranie skončí na <body>. Formulár zatvára ďalší odkaz <a href="#">zatvoriť</a>; po jeho aktivovaní sa formulár odstráni a zameranie je opäť na <body>.

Overené čítačom obrazovky NVDA 2026.2 vo Firefoxe 158 (3. 10. 2026): po aktivovaní „Napíšte nám“ NVDA prečíta formulár ako súvislý text zo živej oblasti („Nahlásenie chyby Pomocou tohto formuláru môžete nahlásiť chybu v návode, alebo na stránke. …“) a NVDA+Tab hlási „Elektronické daňové priznanie, document, focused, read only“. Odkaz na zatvorenie oznámi ako „zatvoriť, same page, link“; po jeho aktivovaní NVDA prečíta „Našli ste na stránke chybu? Napíšte nám“ a zameranie je znova na dokumente.

Dopad:

Používateľ čítača obrazovky počuje „odkaz“, a očakáva preto prechod na inú stránku; nedozvie sa, že sa niečo rozbalilo, ani v akom stave je. Po otvorení aj zatvorení formulára stratí miesto na stránke a musí formulár alebo pôvodný odkaz hľadať. Používateľ klávesnice, ktorý ovládacie prvky aktivuje medzerníkom, formulár neotvorí. Postihnutí sú nevidiaci a ťažko slabozrakí používatelia čítačov obrazovky a používatelia, ktorí ovládajú stránku iba klávesnicou.

Závažnosť: stredná — formulár sa dá otvoriť a použiť, ale jeho ovládanie nezodpovedá roli a zameranie sa stráca.

Efektívne riešenie:

Pre splnenie kritéria úspešnosti je potrebné ovládacie prvky, ktoré otvárajú a zatvárajú formulár, vytvoriť ako tlačidlá (<button type="button">) a stav vyjadriť atribútom aria-expanded. Po otvorení je potrebné presunúť zameranie na nadpis formulára „Nahlásenie chyby“ (s tabindex="-1") a po zatvorení ho vrátiť na tlačidlo „Napíšte nám“.

<button type="button" className="sdn-feedbackbar__link" aria-expanded={isOpen} aria-controls="sdn-feedbackbar-form-foundbug" onClick={() => setIsOpen(true)}>Napíšte nám</button>