Imaginați-vă un vizitator care deschide site-ul unui studio și trece de la pagina principală la servicii, apoi la datele de contact, fără să atingă mouse-ul. Își poate da seama unde se află? Poate deschide secțiunea de care are nevoie? Acest parcurs scurt arată dacă navigarea funcționează ca un instrument utilizabil, dincolo de aspectul ei într-o machetă. Principiul de bază din îndrumările W3C WAI privind tastatura este simplu: funcționalitatea interfeței trebuie să fie disponibilă prin tastatură.
Începeți cu o structură clară
Pentru navigarea obișnuită, folosiți linkuri grupate în liste în interiorul unui element nav, așa cum este descris în ghidul WAI privind structura meniurilor. Un link duce vizitatorul la o pagină; un buton deschide sau închide un submeniu. Dacă „Servicii” are atât o pagină de prezentare, cât și secțiuni imbricate, separați aceste acțiuni. Astfel, componenta este ușor de explicat înainte de dezvoltare: eticheta deschide prezentarea, iar un buton alăturat dezvăluie mai multe opțiuni.
Planificați ordinea navigării
Tab trebuie să urmeze un traseu inteligibil, iar Shift + Tab să se deplaseze înapoi. Îndrumările WAI privind ordinea focalizării subliniază păstrarea sensului și a posibilității de operare. Marcați traseul pe design: logo, linkuri principale, buton de solicitare, apoi următoarea comandă a paginii. Dacă focalizarea sare neașteptat între zone îndepărtate, inspectați ordinea elementelor în cod, nu doar aranjarea vizuală. Conveniți asupra ordinii dorite înainte de a adăuga animație.
Faceți focalizarea ușor de observat
Focalizarea identifică elementul care va primi următoarea acțiune de la tastatură. Îndrumările privind focalizarea vizibilă explică faptul că indicatorul trebuie să rămână vizibil pe durata afișării focalizării. Nu eliminați conturul implicit fără un înlocuitor clar. Ghidul WAI privind stilizarea meniurilor tratează focalizarea și pagina curentă ca stări diferite. Proiectați-le împreună: o subliniere poate identifica secțiunea curentă, iar un contur distinct poate marca poziția tastaturii.
Deschideți submeniurile în mod deliberat
Trecerea cursorului nu trebuie să fie singura modalitate de a dezvălui linkuri imbricate. Îndrumările WAI privind meniurile derulante acoperă operarea cu tastatura și comunicarea stării extinse prin aria-expanded. Navigarea obișnuită nu are automat nevoie de rolul menu. În exemplul WAI de navigare cu afișare și ascundere, Enter și Space activează butoanele; Escape închide un meniu derulant și readuce focalizarea la butonul său. Testați acest model de interacțiune în implementarea voastră, în loc să considerați exemplul drept cod gata de producție.
Parcurgeți un traseu real
- Deschideți pagina principală și lăsați mouse-ul deoparte. Folosiți Tab pentru a găsi primul element de navigare.
- Ajungeți la „Servicii”, deschideți submeniul și alegeți o pagină. Repetați traseul în sens invers.
- Închideți și redeschideți submeniul. Verificați unde apare focalizarea după fiecare acțiune.
- Repetați într-o fereastră îngustă și cu pagina mărită. Lăsați vizibile notificările existente și panourile fixe.
Verificați separat conținutul suprapus: WAI avertizează împotriva acoperirii complete a componentei focalizate cu elemente ale paginii. Utilizatorii trebuie, de asemenea, să poată părăsi o componentă folosind tastatura. Un meniu obișnuit nu trebuie să-i țină într-un ciclu în interiorul său.
Consemnați comportamentul, nu impresiile
Un raport util de problemă include URL-ul paginii, browserul, lățimea ferestrei, tastele apăsate și rezultatul așteptat. În loc de „meniul pare incomod”, scrieți: „Închiderea submeniului pierde focalizarea vizibilă; următorul Tab reia traseul de la început.” Acest detaliu ușurează retestarea. Exercițiul scurt poate descoperi probleme de navigare, dar nu înlocuiește o evaluare completă a accesibilității și nu demonstrează conformitatea cu WCAG.