Ce este Form Labels (Etichete formulare)?

Etichetele asociate campurilor din formulare, esentiale pentru accesibilitate

Definiție Form Labels (Etichete formulare)

Fiecare camp dintr-un formular (input, select, textarea) trebuie sa aiba o eticheta (label) asociata corect prin atributul "for". Etichetele permit utilizatorilor de cititoare de ecran sa inteleaga ce date trebuie introduse si, pe mobile, apasarea etichetei activeaza campul. Placeholder-ul NU este un substitut pentru label.

De ce contează Form Labels (Etichete formulare)

Un camp de formular fara label asociat prin atributul for/id este complet nedescris pentru screen readere — utilizatorul aude doar "edit text" fara sa stie ce informatie trebuie sa completeze. Conform unui studiu Baymard Institute, 67% din formularele din e-commerce au cel putin o eroare de label care afecteaza rata de completare. Formularele inaccesibile scad conversia cu pana la 30%.

Cum verifici Form Labels (Etichete formulare)

SoftAudit scaneaza toate formularele din pagina si verifica fiecare <input>, <select> si <textarea> pentru prezenta unui <label> asociat corect prin atributul for care corespunde id-ului campului. Alternativele valide (aria-label, aria-labelledby, title) sunt de asemenea recunoscute.

Greșeli frecvente

Folosirea placeholder-ului ca singura eticheta este cea mai raspandita greseala — placeholder-ul dispare la focus, lasand utilizatorul fara context dupa ce incepe sa scrie. Imbricarea input-ului in <label> fara for/id functioneaza tehnic, dar aria-labelledby si unele screen readere mai vechi nu il interpreteaza consistent.

Bune practici

Asociaza explicit fiecare camp cu un <label for="id-camp"> vizibil permanent si adauga aria-describedby pentru instructiuni suplimentare (format, lungime, cerinte). Plaseaza label-ul deasupra campului (nu in stanga) — aceasta pozitionare reduce timpul de completare cu 50% conform studiilor eye-tracking.