ID duplicati
Silktide individua le pagine in cui lo stesso valore id viene usato su più di un elemento. Gli ID devono essere univoci all'interno di una pagina, perché qualsiasi elemento che fa riferimento a un ID - etichette dei moduli, relazioni ARIA, link interni alla pagina - può trovarne solo uno tra i duplicati.
<!-- Entrambi gli input condividono id="name": quale campo descrive ciascuna etichetta? -->
<label for="name">Il tuo nome</label>
<input id="name">
<label for="name">Nome dell'azienda</label>
<input id="name">
Perché è importante
La dipende dai riferimenti agli ID per collegare elementi correlati.
Quando gli ID sono duplicati, un
può leggere l'etichetta sbagliata per un campo del modulo, oppure nessuna etichetta; nell'esempio
precedente, entrambi i campi potrebbero essere annunciati come "Il tuo nome", quindi l'utente inserisce il proprio nome nel campo dell'azienda. Lo stesso problema riguarda gli attributi
come aria-labelledby e aria-describedby, oltre ai link interni alla pagina
che portano a un #id.
Come risolvere il problema
- Rinomina i duplicati in modo che ogni
iddella pagina sia univoco e aggiorna qualsiasi elemento che vi faceva riferimento (attributifor, attributi ARIA, link). - Se i duplicati provengono da un componente ripetuto - un modello inserito più volte nella stessa pagina - modifica il modello affinché generi ID univoci, oppure usa classi invece degli ID per gli hook di stile che non richiedono riferimenti.
- Se un duplicato segnalato è effettivamente innocuo nel tuo contesto, puoi ignorare il risultato.
Come Silktide esegue questo controllo
- Individua ogni elemento della pagina con un attributo
id. Gli elementi all'interno di elementi grafici SVG vengono ignorati, perché i relativi ID appartengono a un contesto separato. - Raggruppa gli elementi in base al valore del relativo
id. - Quando più di un elemento condivide lo stesso
id, segnala ciascuno di essi.