Design to Improve Life

Gør forståeligt

Den gode formular begynder med en synlig label

Et felt skal kunne forklares, også efter man er begyndt at skrive. Se på labels, hjælp og fejl som én samlet samtale.

AI-genereret motiv til: Den gode formular begynder med en synlig label
AI-genereret motiv — ikke et dokumentarisk foto.

Et tomt felt med ordet e-mail indeni kan se enkelt ud. Men når du begynder at skrive, forsvinder den tekst, hvis den kun er en placeholder. En synlig label uden for feltet bliver stående og hjælper med at holde styr på, hvad oplysningen skal bruges til.

Et navn til hvert felt

W3C’s formularvejledning beskriver sammenhængen mellem labels og de felter, de hører til. Det handler både om den synlige placering og om den tekniske forbindelse. En tekst, som tilfældigvis står tæt på et felt, er ikke nødvendigvis tilstrækkeligt knyttet til det i sidens kode.

I en tidlig skitse kan du begynde med det sproglige: Hvad vil brugeren kalde oplysningen? Navn er måske nok i én sammenhæng. I en anden skal du forklare, om det er deltagerens navn eller navnet på den, der foretager tilmeldingen.

Et tænkt eksempel med to personer

Forestil dig en tilmelding, hvor en voksen bestiller en plads til et barn. To felter med teksten navn skaber unødig tvivl. Skriv eksempelvis deltagerens navn og kontaktpersonens navn, hvis det er de oplysninger, systemet faktisk har brug for.

Tilføj derefter en kort forklaring ved kontaktoplysningerne: Vi bruger adressen til beskeder om denne tilmelding. Formuleringen skal svare til den reelle brug af oplysningerne. En hjælpetekst må ikke love en begrænsning, som den færdige tjeneste ikke overholder.

Hjælp før fejlen

Hvis et felt kræver et særligt format, kan en forklaring før indtastningen spare en omvej. Et datoeksempel skal vise det format, systemet accepterer. Undgå at kræve, at brugeren gætter en teknisk konvention, som kun udvikleren kender.

Behold den korte label og den længere forklaring som to forskellige elementer. Labelen identificerer feltet; hjælpen forklarer det, der ikke er oplagt. Et helt afsnit som feltnavn kan være lige så svært at overskue som et felt uden navn.

Gør en fejl mulig at rette

Forestil dig, at tilmeldingen mangler en e-mailadresse. Fejlbeskeden skal forklare netop det og pege på det relevante felt. En generel besked øverst på siden kan supplere, men bør ikke efterlade brugeren med opgaven at undersøge alle felter på ny.

Brug heller ikke en farve som eneste forklaring. Det princip gennemgår vi i Farve er ikke en besked. De synlige ord og den tekniske kobling skal arbejde sammen, når formularen bygges.

Prøv den på lidt plads

Se skitsen i en smal bredde. Er label, forklaring og felt stadig samlet, eller er de drevet fra hinanden? W3C nævner labels over felter som en placering, der ofte kan hjælpe på små skærme, men understreger, at den konkrete sammenhæng skal vurderes.

Afprøv en realistisk tilmeldingsopgave, før du polerer detaljerne. En papirprototype kan vise, hvor ordene skal være mere præcise.

Faglig kilde

W3C WAI: Labeling Controls. Tilmeldingen er et konstrueret eksempel.