axessia.eu

Den mest almindelige fejl ved farvekontrast: hvad går galt, og hvordan undgår du det?

Utilstrækkelig kontrast mellem tekst og baggrund er et af de mest fundne problemer i tilgængelighedsscans. Denne artikel forklarer, hvor det går galt, hvad WCAG foreskriver, og hvordan du strukturelt undgår det.

Utilstrækkelig kontrast mellem tekst og baggrund er et af de problemer, der oftest dukker op i tilgængelighedsscanninger, og samtidig en af de fejl, der er lettest at undgå. Det går galt, når lysegrå tekst står på en hvid baggrund, når knapper kun er synlige gennem en subtil farveændring, eller når pladsholdertekst i et formularfelt fungerer som den eneste vejledning for, hvad der skal udfyldes. For mennesker med en synsnedsættelse, men også for alle, der bruger en skærm i stærkt sollys, bliver teksten da bogstaveligt talt ulæselig.

WCAG 2.1, den norm, som EN 301 549 henviser til, foreskriver for niveau AA et minimumskontrastverholdsmål mellem tekst og den baggrund, den står på: typisk 4,5 til 1 for almindelig tekst og 3 til 1 for stor tekst og for kontrolelementer som knapper og formulargrænser. Det lyder teknisk, men tanken bag det er simpel: kontrast er ikke et æstetisk valg, det er en betingelse for at kunne formidle information.

Hvor det går galt i praksis

Kontrastproblemer opstår sjældent med vilje. De sniger sig ind via virksomhedsidentitetsbeslutninger, der ser perfekte ud på en stor, skarp skærm i et designstudio, men på en gennemsnitlig skærm hos en gennemsnitlig bruger falder lige under normen. En lysegrå knapptekst på en pastellfarvet baggrund er et klassisk eksempel. Det samme gælder hyperlinks, der kun kan genkendes gennem en farveændring, uden understregning eller andet visuelt signal, hvilket betyder, at mennesker med farveblindhed simpelthen ikke ser dem som klikbare.

Et andet tilbagevendende mønster er hover-statussen: en knap, der i hvile opfylder kravene fint, men når musen bevæges, skifter til en farvekombination, der ikke er testet. Fejlmeddelelser i formularer er også en hyppig fejl: rød tekst på en lys rød baggrund ser konsistent ud med virksomhedsidentiteten, men opfylder ofte ikke det krævede forhold. Hvis du er nysgerrig på, hvordan denne slags problemer ser ud i dit eget miljø, kan du se det i et par spørgsmål, hvor din websted står uden at skulle oprette en konto først.

Hvorfor en automatiseret scanning løser dette delvis, men ikke fuldstændigt

Kontrastverholdsmål er nemme at måle automatisk: en scanner aflæser farveværdierne for tekst og baggrund og beregner forholdet. Dermed er det et af de få WCAG-kriterier, som et værktøj pålideligt kan teste. Det, som en scanning ikke ser, er kontrast, der først opstår efter en interaktion, som f.eks. en rullemenu, et tooltip, der vises ved fokus, eller en status, der først bliver synlig efter en brugerhandling. Det er præcis hvorfor hver rapport angiver, hvilken del der er testet automatisk, og hvilken del der kræver manuel vurdering; kontrast er et stærkt punkt ved automatiseret testing, men ikke hele billedet.

Hvordan du strukturelt undgår det

Den mest almindelige måde at undgå dette problem varigt på er at fastlægge kontrast på niveau for designsystemet i stedet for pr. side. Når virksomhedsidentitetens basisfarver allerede testes mod normen ved fastlæggelsen, behøver en redaktør eller udvikler ikke at kontrollere det gang på gang. Det forhindrer også, at en ny side, et midlertidigt actionbanner eller en eksternt indkøbt widget underminerer kontrasten uden at blive bemærket.

Det er derudover klogt at tage kontrast eksplicit med i hver visuel ændring af webstedet, ikke kun ved den første levering. En opdatering af virksomhedens visuelle identitet, et nyt sæsonalt tema eller en ændret knapstil kan introducere et problem, som ikke var der i den tidligere version. Tilgængelighed er i den forstand ikke et flueben, som du sætter én gang, men et fokusområde, der følger med ved vedligeholdelse. Læs mere om, hvordan sådan en løbende kontrol fungerer i praksis, en forklaring af hvor vurderingen kommer fra.

Endelig er det værd at se ikke kun på minimumsstandarden, men på hensigten bag den: kan alle, også under mindre ideelle lysforhold eller på en ældre skærm, faktisk skelne mellem teksten og knapperne. Ofte stillede tvivlsspørgsmål, såsom om et logo eller et dekorativt billede også skal opfylde kontrastkravet, er uddybet på siden med svar på spørgsmål, som kommer hyppigt op.

Vil du vide, om kontrast og de andre tilbagevendende problemer også spiller en rolle i dit eget miljø? Den gratis quick-scan giver en første indikation af det, og videnbase med emner udvalgt til hver situation viser, hvordan dette spørgsmål hænger sammen med resten af kravene i European Accessibility Act.

Denne artikel er generel information og ikke juridisk rådgivning.