Instruktioner til formularer

Silktide finder formularfelter, der muligvis kræver en forklaring, f.eks. fritekstfelter, og beder dig afgøre, om hvert enkelt har brug for instruktioner, der beskriver, hvad der skal indtastes. Felter, der har brug for instruktioner, bør have dem tilknyttet i koden og ikke blot placeret i nærheden.

Hvorfor det er vigtigt

En etiket alene er ofte ikke nok. "Dato" fortæller intet om det forventede format, som varierer fra land til land; "Reference" angiver ikke, hvilket af dine tre referencenumre der ønskes. Besøgende, der gætter forkert, får en fejlmeddelelse – eller værre endnu: deres indsendelse accepteres med dårlige data.

Det er lige så vigtigt at tilknytte instruktionen i koden som at skrive den: et tip, der blot er visuelt placeret tæt på feltet, er usynligt for en bruger af , som har fokus på indtastningsfeltet.

Sådan løser du det

For hvert markeret felt skal du afgøre, om en besøgende kan være i tvivl om, hvad der skal indtastes. Hvis det er tilfældet:

Tilføj en beskrivelse, og forbind den med feltet ved hjælp af attributten aria-describedby:

<!-- Tippet annonceres, når feltet får fokus -->
<label for="date">Dato</label>
<input type="text" id="date" aria-describedby="date-hint">
<p id="date-hint">Format: dag/måned/år, f.eks. 28/07/2026</p>

Eller brug i stedet en specialudviklet -felttype. <input type="date"> giver besøgende en datovælger på deres eget sprog, uden behov for en forklaring – foretræk denne løsning, når der findes en passende type.

Hvis feltet er selvforklarende – et "Søg"-felt eller et "Besked"-felt i en kontaktformular – er der ikke behov for instruktioner; fundet.

Sådan tester Silktide dette

Find de formularkontrolelementer, hvor instruktioner sandsynligvis hjælper: <textarea>-elementer og <input>-felter af typen text, email, file, number, password eller range. Knapper, afkrydsningsfelter, alternativknapper og rullemenuer springes over, fordi en etiket normalt er tilstrækkelig for dem.
Spring felter over, som ikke er synlige for seende brugere, samt felter, der indsættes af kendte tredjepartswidgets, såsom de skjulte formularer, som sporings- og oversættelsesscripts tilføjer til eget brug.
Spring felter over, som allerede har en tilknyttet beskrivelse – en aria-describedby, der peger på ægte, ikke-tom tekst, eller en ikke-tom aria-description-attribut.
Markér hvert resterende felt til din gennemgang: Et menneske afgør, om det faktisk har brug for instruktioner.

Fejlfinding

Mit felt har et tip lige under det

Visuel nærhed er ikke en tilknytning. Medmindre tippet er forbundet med feltet via aria-describedby (eller aria-description), annoncerer det ikke, og Silktide markerer feltet. Tilføjelse af attributten løser begge dele.