Bruk av farger

Farger kan være en god meningsbærer, og bruk gjerne farger for å gi bedre oversikt og skape assosiasjoner hos den som leser. Samtidig kan farge aldri brukes som den eneste informasjonsbæreren, fordi vi har ulik evne til å oppfatte farge.

Kvinne i grønn genser holder opp laptop med fargepalett

Innhold

    Introduksjon

    Alle brukere vil ha stor glede av visuell markering i menyen av aktiv side, og dette blir gjerne løst med fargeendring. Videre surfer brukerne stadig mer med mobil og nettbrett, i alle mulige situasjoner og omgivelser. Det resulterer ofte i krevende lysforhold som stiller store krav til fargebruk for at det skal ha effekt for alle brukere. Aller viktigst er dette for fargeblinde, svaksynte, dyslektikere og personer med kognitive funksjonsnedsettinger.

    Løsninger som møter kravene i forskriften

    Fargebruk i tekst

    Hvis du bruker farge til å formidle funksjonalitet eller viktighet, må du supplere med andre metoder for å sikre at alle brukere skjønner hva du formidler. For seende brukere må du supplere med tekst, ikon eller lignende. For brukere med skjermleser må du supplere med kode eller tekst.

    Eksempel på supplerende markering er fet stil for visuell utheving eller understreking av lenker. Hvis publiseringsverktøyet koder markeringen korrekt, kan hjelpemidler også lese dette. I andre tilfeller er det nødvendig å supplere med tekst.

    Sammenligning av fargemarkering alene og farge med understreking, samt hvordan disse fremstår i gråtoneskala som simulerer sollys på skjermen.
    Foto av mobil med illustrasjon av fargemarkering og understreking på skjermen

    Kodeeksempel for korrekt markering av uthevet tekst:

    Hvordan ikke markere <a href=”eks.html” style=”color: #6e1873;”>lenke i brødtekst</a>.
    Hvordan markere <a href=”eks.html” style=”color: #6e1873; text-decoration: underline;”>lenke i brødtekst</a>.

    Husk at layout skal defineres i CSS, eksempelet skal bare vise merverdien av supplerende markering.

    Lenker skal naturligvis også markeres med mer enn farge, men det er også en del andre faktorer som er viktig.

    Diagram

    I diagram brukes gjerne ulike farger for å formidle forskjellig informasjon. For at alle seende brukere skal skjønne koblingen mellom farge og informasjon, må det også være andre meningsbærere. Det kan for eksempel være at ledeteksten kobles direkte på kakestykket eller grafen, eller at ulike skraveringer benyttes i tillegg til farge. For at også sterkt svaksynte som bruker skjermleser skal kunne ta del i informasjonen, må du også presentere informasjonen i tekst eller tabell.

    Kakediagram, eksempel på hvordan ledetekstene kan kobles direkte til de enkelte stykkene.

    Test av farger

    Test opp mot lovkravene

    For å vite om en løsning oppfyller lovkravene, er det viktig med kunnskap om kravene og at du tester innholdet.

    Tilsynets testprosedyrer er utviklet for å sjekke om en løsning er i samsvar med de 35 suksesskriteriene i WCAG 2.0, som utgjør minimumskravene etter forskriften. Testprosedyrene gir gyldige og pålitelige målinger opp mot minimumskravene.

    For hvert krav, kalt suksesskriterium, finner du kort informasjon om formålet, brukssituasjoner og tilhørende testregler for det aktuelle kravet. For farger gjelder:

    Anbefalinger utover kravene i forskriften

    Mange farger oppleves annerledes for brukere med fargeblindhet, men hvor stor denne forskjellen er vil variere avhengig av fargen og typen fargeblindhet. Eksempler på ugunstige fargekombinasjoner er oransje mot grønn, oransje mot rosa og blå mot lilla, men det er mange nyanser av disse. Derfor er det gunstig å vurdere hvordan fargene oppleves for fargeblinde. Det finnes gratisverktøy som kan simulere fargeblindhet.

    Grafer som illustrerer effekten av henholdsvis rødgrønn og blågul fargeblindhet. I begge tilfellene blir fire ulike farger oppfattet som to og to praktisk talt like farger.

    Farge kan bety ulike ting for ulike personer. Rødt kan eksempelvis symbolisere kjærlighet, fare eller stopp. Forskjellen i hvordan farger brukes er også stor mellom ulike kulturer og miljø. For eksempel viser forskning at personer fra Sør-Amerika, Afrika og deler av Europa har viss kobling mellom gult og advarsel, blant annet grunnet fargebruk på veiskilt, mens personer fra Kina ikke gjør denne koblingen i det hele tatt. I land hvor det normalt ikke er snø er det ikke vanlig med kobling mellom hvitt og kaldt. Derfor er det viktig ikke å forvente at hele din målgruppe gjør samme assosiasjon til farge som du selv gjør.