Čo je Focus Management?
Focus management je technika riadenia fokusového indikátora na webstránke, ktorá zabezpečuje logický a predvídateľný pohyb kurzora pri navigácii klávesnicou. Je kľúčová pre prístupnosť interaktívnych komponentov.
Definícia Focus Management
Čo je focus management
Focus management (riadenie fokusu) je technika webového vývoja, ktorá zabezpečuje, že fokusový indikátor sa na stránke pohybuje logicky a predvídateľne. Keď používateľ naviguje klávesnicou (klávesom Tab), fokus sa presúva medzi interaktívnymi prvkami — odkazmi, tlačidlami a formulárovými poľami.
Správny focus management je nevyhnutný pre používateľov, ktorí nepoužívajú myš — ľudí s motorickým postihnutím, používateľov screen readerov a „power users", ktorí preferujú klávesnicu.
Kľúčové princípy
- Viditeľný focus indikátor — používateľ musí vždy vidieť, ktorý prvok je aktívny (nikdy neodstraňujte
outline) - Logické poradie — fokus musí prechádzať prvkami v zmysluplnom poradí, nie náhodne
- Focus trapping — v modálnych oknách musí fokus zostať vnútri dialógu, kým ho používateľ nezatvorí
- Focus restoration — po zatvorení modálneho okna sa fokus vráti na prvok, ktorý dialóg otvoril
Bežné problémy
Medzi najčastejšie chyby patrí odstraňovanie CSS outline na fokusovaných prvkoch, nesprávne použitie tabindex s hodnotami vyššími ako 0, a chýbajúci focus trap v modálnych oknách. Tieto problémy spôsobujú, že klávesnicoví používatelia stratia orientáciu na stránke.
Praktický príklad
Príklad: Modálne okno s prihlasovacím formulárom.
Používateľ klikne na tlačidlo „Prihlásiť sa" a otvorí sa modálne okno. Bez focus managementu sa fokus po otvorení modálu presunie za dialóg a používateľ klávesnicou nevidí formulárové polia.
Správne riešenie: Po otvorení modálu sa fokus presunie na prvé pole (e-mail), Tab cykluje iba medzi poliami a tlačidlami v modáli (focus trap), a po zatvorení sa fokus vráti na pôvodné tlačidlo „Prihlásiť sa".
Často kladené otázky
Čo je focus management na webe?
Focus management je technika riadenia klávesnicového fokusu na webstránke. Zabezpečuje, že fokusový indikátor sa presúva medzi prvkami logicky a predvídateľne, čo je kľúčové pre prístupnosť.
Čo je focus trapping?
Focus trapping znamená, že v modálnom okne sa fokus cyklicky pohybuje iba medzi prvkami vnútri dialógu. Používateľ sa nemôže klávesnicou dostať za modálne okno, čo zabraňuje strate orientácie.
Prečo by som nemal odstraňovať CSS outline?
CSS outline na fokusovaných prvkoch je vizuálny indikátor pre používateľov klávesnice. Bez neho nevedia, ktorý prvok je aktívny. Namiesto odstránenia outline ho nahraďte vlastným viditeľným štýlom.
Súvisiace pojmy
Potrebujete pomôcť s webom?
Napíšte mi a poradím vám s vaším projektom. Prvá konzultácia je zadarmo a nezáväzná.