Geldige label-ID's

Silktide controleert formuliervelden waarvan het label het veld benoemt met een ID, en controleert of de ID op de pagina bestaat en hoort bij een element waaraan daadwerkelijk een label kan worden gekoppeld. Een label dat naar niets verwijst, of naar het verkeerde soort element verwijst, laat een veld stilzwijgend zonder naam.

In wordt een <label> aan het formulierveld gekoppeld door het for-attribuut van het label in te stellen op de id van het veld. De koppeling wordt verbroken wanneer de ID verkeerd is gespeld, wanneer de ID van het veld verandert, of wanneer het doel helemaal geen formulierveld is.

<!-- Probleem: er bestaat geen element met id="fullname" -->
<label for="fullname">Volledige naam</label>
<input type="text" id="full-name">

Waarom dit belangrijk is

Het label is de manier waarop een een veld aankondigt. Wanneer de for-verwijzing verbroken is, zijn het label en het veld twee niet-gerelateerde elementen: de bezoeker hoort een naamloos "tekst bewerken" en moet raden wat erin hoort. Visueel verandert er niets - het label staat nog steeds naast het veld - waardoor deze problemen onopgemerkt blijven totdat iemand die van deze koppeling afhankelijk is het formulier probeert te gebruiken.

Hoe je dit oplost

Zoek het veld waarvoor het label bedoeld was en zorg dat de waarde van for van het label exact overeenkomt met de id van het veld (ID's zijn hoofdlettergevoelig):

<!-- Opgelost: de verwijzing komt overeen met de id van het veld -->
<label for="full-name">Volledige naam</label>
<input type="text" id="full-name">

Als het label verwijst naar iets waaraan geen label kan worden gekoppeld - zoals een <div> die als aangepaste bediening fungeert - gebruik dan in plaats daarvan : voeg aan het element aria-labelledby toe, dat verwijst naar de tekst die het benoemt.
Als het label is achtergebleven zonder bijbehorend veld, verwijder het dan.

Hoe Silktide dit test

Zoek op elke pagina elk <label>-element met een for-attribuut.
Zoek het element op waarvan de id overeenkomt met de waarde van for.
Rapporteer het label als er geen dergelijk element bestaat.
Als het bestaat, rapporteer het label als het doel geen labelbaar formulierelement is - een knop, invoerveld (behalve verborgen invoervelden), keuzelijst, tekstgebied, meter, output- of voortgangsbalk.

Problemen oplossen

Het veld wordt door scripts toegevoegd

Silktide onderzoekt elke pagina zoals die wordt weergegeven. Als het doelveld alleen in bepaalde toestanden van de pagina bestaat - bijvoorbeeld nadat een paneel is geopend - kan het doel van het label ontbreken wanneer de controle wordt uitgevoerd. Overweeg het label en het bijbehorende veld samen weer te geven.