2.4.3 Po prechode na ďalší krok sa stratí zameranie a čítač obrazovky dostane obsah kroku ako súvislý text

Added by Milan Regec Milan R. (October 3, 2026)
Notes

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


Popis problému:

Kroky sprievodcu sa menia bez opätovného načítania stránky (smerovač Next.js). Po aktivovaní tlačidla „Súhlasím a chcem pripraviť daňové priznanie“ alebo „Pokračovať“ sa zobrazí nový krok, document.activeElement je však <body> a aplikácia urobí iba window.scrollTo(0, 0). Názov stránky sa nemení (pozri zistenie k názvom stránok), preto vstavané oznamovanie zmeny stránky v Next.js (<next-route-announcer>, role="alert") zopakuje stále ten istý názov alebo nepovie nič.


Celá aplikácia je zároveň zabalená do živej oblasti: <div aria-live="polite" class="main"> v src/components/Layout.tsx. Každá zmena obsahu — nový krok, zobrazené polia, chybové hlásenie — sa preto prečíta ako jeden súvislý text bez rolí a bez stavov prvkov.


Overené čítačom obrazovky NVDA 2026.2 vo Firefoxe 158 a v Chrome 154 (3. 10. 2026):


  • Po „Súhlasím a chcem pripraviť daňové priznanie“ NVDA vo Firefoxe prečíta „Späť Mali ste v roku 2025 príjmy zo živnosti na území SR? Áno Áno Nie Nie Ktoré príjmy podporujeme a ktoré nie? Pokračovať“ a potom „alert, Elektronické daňové priznanie“. Príkaz na oznámenie zamerania (NVDA+Tab) hlási „Elektronické daňové priznanie, document, focused, read only“.
  • Po „Pokračovať“ na ďalší krok NVDA prečíta už iba súvislý text kroku („Späť Mali ste v roku 2025 príjmy zo zamestnania v SR? Áno Áno Nie Nie Pokračovať“), názov stránky nezopakuje a zameranie je opäť na dokumente. V Chrome je správanie rovnaké, len sa menovky prepínačov neopakujú.
  • Kroky o manželovi alebo manželke, o prenájme a o úrokoch pridávajú ďalšiu otázku na tú istú adresu nad tlačidlo „Pokračovať“, ktoré zameranie podrží. NVDA nové otázky prečíta ako text („Žije s vami manželka / manžel v spoločnej domácnosti? Áno Áno Nie Nie Späť“); skupinu prepínačov musí používateľ nájsť sám.
  • Po výbere „Áno“ v prvom kroku NVDA najprv prečíta všetky novo zobrazené menovky a nápovedy za sebou („Príjmy a odvody do sociálnej a zdravotnej poisťovne zo živnosti Príjmy Vaše celkové príjmy prijaté na účet …“) a až potom stav prepínača „checked“.


Dopad:

Používateľ čítača obrazovky po každom kroku stratí miesto, na ktorom pracoval. Obsah kroku počuje iba ako prúd slov, v ktorom sa nerozlišujú nadpisy, otázky, voľby a tlačidlá (vo Firefoxe sa menovky navyše opakujú: „Áno Áno Nie Nie“), a odpovedať musí až po tom, čo otázku a voľby v stránke sám vyhľadá. Dlhé hlásenia živej oblasti prekrývajú to, čo práve robí — stav zvolenej voľby počuje až po celom bloku textu. Používateľ klávesnice nevidí, kde je zameranie, a používatelia s kognitívnym znevýhodnením nedostávajú jasný signál, že sa začal nový krok. Postihnutí sú nevidiaci a ťažko slabozrakí používatelia čítačov obrazovky, používatelia, ktorí ovládajú stránku iba klávesnicou, a používatelia s kognitívnym znevýhodnením.


Závažnosť: vysoká — opakuje sa v každom zo 14 krokov hlavného procesu.


Efektívne riešenie:

Pre splnenie kritéria úspešnosti je potrebné po každej zmene kroku presunúť zameranie na nadpis nového kroku (nadpis dostane tabindex="-1"), napríklad v udalosti smerovača routeChangeComplete v src/pages/_app.tsx namiesto samotného window.scrollTo(0, 0). Pri podkrokoch na tej istej adrese (manžel / manželka, prenájom, úroky) je potrebné rovnako presunúť zameranie na legendu alebo nadpis novej otázky.


router.events.on('routeChangeComplete', () => {
  const heading = document.querySelector<HTMLElement>('main h1, main legend h2, main h2')
  if (heading) { heading.setAttribute('tabindex', '-1'); heading.focus() }
})


Zároveň je potrebné odstrániť aria-live="polite" z obalového elementu <div class="main"> v Layout.tsx a živé oblasti používať iba pre krátke stavové hlásenia (napríklad súhrn chýb, ktorý už má role="alert"). Nad rámec kritéria úspešnosti odporúčame doplniť do nadpisu alebo názvu stránky poradie kroku („Krok 3 z 14“).


1-nvda-po-zmene-kroku.png
1-nvda-po-zmene-kroku.png Download