Gyldige etikett-ID-er for fragmenter

Silktide kontrollerer skjemaetiketter som viser til et annet element ved hjelp av en ID, og rapporterer etiketter der ID-en ikke finnes noe sted på siden. En etikett som ikke peker på noe, kan ikke navngi noe.

I HTML navngir et <label>-element et skjemafelt ved å sette for-attributtet til feltets id. Denne kontrollen verifiserer bare at den refererte ID-en finnes et sted på siden – en tilhørende kontroll, Gyldige etikett-ID-er, går lenger og verifiserer at målet er et skjemafelt som kan ha en etikett.

<!-- Problem: ingenting på siden har id="food" -->
<label for="food">Favorittmat</label>

Hvorfor dette er viktig

En etikett med en ødelagt referanse gjør ingenting: En skjermleser kan ikke koble den til et felt, så feltet etiketten var ment for, blir lest opp uten et navn, og når du klikker på etiketten, får feltet ikke lenger fokus. Fordi siden ser uendret ut, oppstår disse feilene vanligvis ubemerket når ID-er endres eller markeringen bygges om, og bare automatiserte kontroller oppdager dem.

Slik løser du det

1. Finn elementet etiketten var ment å beskrive, og angi elementets nøyaktige id som etikettens for-verdi (ID-er skiller mellom store og små bokstaver):

<!-- Rettet: etiketten peker på en faktisk ID -->
<label for="food">Favorittmat</label>
<input type="text" id="food">

2. Hvis målelementet mangler en id, legger du til en.
3. Hvis etiketten er en rest som ikke lenger beskriver noe, fjerner du den.

Slik tester Silktide dette

1. Finn alle <label>-elementer med et ikke-tomt for-attributt på hver side.
2. Se etter et element hvor som helst på siden med en samsvarende id.
3. Rapporter etiketten hvis det ikke finnes et slikt element.

Finn ut mer

• Forstå suksesskriterium 1.3.1: Informasjon og relasjoner (WCAG 2.2)
• label-elementet (MDN)
• Gyldige etikett-ID-er