ID validi delle etichette

Silktide controlla le etichette dei moduli che identificano il relativo campo tramite un ID e verifica che l'ID esista nella pagina e appartenga a un elemento che possa effettivamente avere un'etichetta. Un'etichetta che punta a nulla o al tipo di elemento sbagliato lascia silenziosamente un campo senza nome.

In , un elemento <label> viene collegato al relativo campo del modulo impostando l'attributo for dell'etichetta sull'id del campo. Il collegamento si interrompe quando l'ID contiene un errore di battitura, quando l'ID del campo cambia o quando l'elemento di destinazione non è affatto un campo del modulo.

<!-- Problema: non esiste alcun elemento con id="fullname" -->
<label for="fullname">Nome completo</label>
<input type="text" id="full-name">

Perché è importante

L'etichetta è il modo in cui uno annuncia un campo. Quando il riferimento for è interrotto, l'etichetta e il campo sono due elementi indipendenti: il visitatore sente "modifica testo" senza nome e deve indovinare cosa inserire. A livello visivo non cambia nulla: l'etichetta rimane accanto al campo, quindi questi problemi passano inosservati finché qualcuno che dipende da questo collegamento non prova a usare il modulo.

Come risolvere il problema

Individua il campo a cui era destinata l'etichetta e fai in modo che il valore for dell'etichetta corrisponda esattamente all'id del campo (gli ID distinguono tra maiuscole e minuscole):

<!-- Corretto: il riferimento corrisponde all'id del campo -->
<label for="full-name">Nome completo</label>
<input type="text" id="full-name">

Se l'etichetta punta a qualcosa che non può avere un'etichetta, come un <div> che funge da controllo personalizzato, usa : aggiungi all'elemento aria-labelledby in modo che punti al testo che lo identifica.
Se l'etichetta è rimasta senza un campo corrispondente, rimuovila.

Come Silktide esegue questo controllo

Individua ogni elemento <label> con un attributo for in ciascuna pagina.
Cerca l'elemento il cui id corrisponde al valore di for.
Segnala l'etichetta se non esiste alcun elemento di questo tipo.
Se esiste, segnala l'etichetta se l'elemento di destinazione non è un elemento di modulo etichettabile: un pulsante, un input (diverso da uno nascosto), un menu a discesa, un'area di testo, un indicatore, un campo di output o una barra di avanzamento.

Risoluzione dei problemi

Il campo viene aggiunto dagli script

Silktide esamina ogni pagina così come viene visualizzata. Se il campo di destinazione esiste solo in alcuni stati della pagina, ad esempio dopo l'apertura di un pannello, la destinazione dell'etichetta potrebbe mancare durante il controllo. Valuta di visualizzare insieme l'etichetta e il relativo campo.