Skjemaelementer mangler merkelapp (label)
Alle felter i et skjema må ha en tilknyttet ledetekst (label) for at skjermlesere skal forstå dem.
Hva betyr dette?
Alle skjemaelementer (som input, select, textarea) må ha en programmatisk tilknyttet tekst som beskriver hva feltet er til for. Uten dette vet ikke brukere med skjermleser hva de skal skrive inn.
Hvorfor er det viktig?
Når en blind bruker navigerer til et inntastingsfelt, vil skjermleseren lese opp den tilknyttede labelen. Hvis den mangler, hører de ofte bare "rediger tekst", uten å vite om det er fornavn, etternavn eller e-postadresse.
Hvordan fikser jeg det?
Den beste måten er å bruke et <label>-element som peker på input-feltet med for-attributtet.
Riktig måte
<label for="fornavn">Fornavn</label>
<input type="text" id="fornavn" name="fornavn">
Feil måte
<!-- Mangler kobling -->
<div>Fornavn</div>
<input type="text" name="fornavn">
Unntak
Hvis du ikke kan bruke en synlig label (f.eks. i et søkefelt med forstørrelsesglass-ikon), kan du bruke aria-label:
<input type="search" aria-label="Søk etter innhold">
<button>Søk</button>