Design to Improve Life

Gør forståeligt

Farve er ikke en besked: design til flere måder at se på

En rød prik forklarer ikke, hvad der er galt. Kombinér farve med ord, form og tydelige handlinger.

AI-genereret motiv til: Farve er ikke en besked: design til flere måder at se på
AI-genereret motiv — ikke et dokumentarisk foto.

En oversigt kan virke tydelig, når du selv ved, at grøn betyder klar og rød betyder fejl. For en ny besøgende er en farvet prik bare en prik. Betydningen bliver mere robust, når den også kan læses eller genkendes på en anden måde.

Eksempel A: status i en liste

Forestil dig en liste over tre opgaver. Hver opgave har en farvet cirkel i højre side, men ingen forklaring. Den første forbedring er at tilføje ord som afventer, under behandling og færdig. Farven kan stadig understøtte forskellen, men ordene bærer selve beskeden.

Det er et originalt designforslag, ikke et resultat fra en brugertest. W3C anbefaler generelt, at farve ikke står alene som middel til at formidle information. Princippet kan bruges på alt fra diagrammer til formularfejl.

Eksempel B: linket inde i en sætning

Et link, som kun adskiller sig fra teksten ved en svag farveforskel, kan være vanskeligt at opdage. En understregning kan hjælpe med at gøre funktionen synlig. Selve linkteksten skal samtidig fortælle, hvor man kommer hen.

Sammenlign de tænkte tekster læs mere og se tilmeldingsvilkår. Den sidste giver en mere konkret forventning i den situation, hvor linket netop fører til vilkårene. Det betyder ikke, at den længste tekst altid er bedst; præcisionen skal passe til destinationen.

Eksempel C: fejlen ved et felt

En rød ramme om et telefonfelt fortæller ikke, om nummeret mangler, er for kort eller indeholder et tegn, som formularen ikke accepterer. Tilføj en forklaring, som beskriver problemet og næste handling. Sørg også for, at sammenhængen mellem besked og felt er tydelig.

En fejltekst bør bygge på den faktiske validering. Skriv ikke indtast otte cifre, hvis systemet også accepterer udenlandske numre med en anden længde. Det er en god påmindelse om, at tydeligt design kræver sammenhæng mellem ord og funktion.

Kontrollér siden uden din vante genvej

Gå gennem en skitse og dæk farveforklaringen til. Kan du stadig forstå hver status? Se derefter på tekst og baggrund: er kontrasten undersøgt med et egnet værktøj? W3C fremhæver både tilstrækkelig kontrast og synligt fokus ved tastaturbetjening som relevante designhensyn.

Prøv også at følge siden med tastaturet. Det skal kunne ses, hvilket interaktivt element der har fokus. Den visuelle kontrol er nyttig, men udgør ikke alene en fuld tilgængelighedstest eller en garanti for overholdelse af en standard.

Hvis du arbejder med formularer, er næste skridt en synlig og tydeligt tilknyttet label. Du kan afprøve ordene i en papirprototype, før du vælger den endelige visuelle udformning.

Faglig kilde

W3C WAI: Designing for Web Accessibility. De tre eksempler er redaktionelle illustrationer.