Errori comuni nei nomi che rendono silenziosi i controlli

Un controllo senza un nome calcolato viene letto semplicemente come pulsante o collegamento. Questi errori di denominazione lasciano gli utenti a indovinare la funzione dell'elemento.

Un pulsante che contiene solo un'icona spesso non ha un nome calcolato. Aggiungi un aria-label, così il controllo privo di testo annuncia comunque la propria azione.

Un placeholder non è un nome accessibile affidabile. Scompare quando si inizia a digitare e molti screen reader lo ignorano: aggiungi quindi una vera etichetta.

Un aria-labelledby che fa riferimento a un ID mancante o scritto in modo errato non produce alcun nome e annulla silenziosamente l'etichetta prevista.

Impostare aria-label su una stringa vuota elimina il nome. L'elemento resta senza nulla da annunciare per uno screen reader.

Applicare aria-hidden all'unico testo contenuto in un pulsante elimina la fonte del suo nome, rendendo il controllo anonimo per gli screen reader.

I collegamenti denominati Leggi di più o Fai clic qui hanno tecnicamente un nome, ma sono inutili fuori contesto, perché l'utente non ne ricava la destinazione.

Usare title come unico nome è rischioso. È la fonte con la priorità più bassa e diversi screen reader la ignorano del tutto.

Un input privo di un label associato spesso non ha un nome calcolato, lasciando gli utenti incerti su cosa digitare nel campo.

Dieci pulsanti con il nome Modifica costringono gli utenti a indovinare quale riga verrà modificata. Assegna a ciascuno un nome distinto che includa l'elemento di destinazione.

Apri il pannello di accessibilità del browser e leggi il nome calcolato di ogni controllo. Se è vuoto, c'è un errore da correggere.

Hai imparato a riconoscere le trappole che rendono muti i controlli, dai pulsanti composti solo da icone agli ID non validi, e a verificare ogni nome nell'inspector. ✅