En gruppe glade folk med ulike handikap.
Profile picture for user silje
Skrevet av
Silje L. Grundstad
Publisert
29. mai 2020

5 tips for universell utforming

Universal design of ICT is about designing websites, apps and self-service machines so that people can use it regardless of their disability. Those who use your website may be visually impaired or blind and therefore dependent on screen readers. You may have some users with disabilities who use keyboard only or other tools to navigate the website with, or users with cognitive disabilities.

Universell utforming av IKT handler om å utforme nettsider, apper og automater slik at flest mulig kan bruke det uavhengig av funksjonsevne. De som bruker nettsiden din kan være svaksynte eller blinde og avhengig av skjermlesere.  Du kan også ha brukere på nettsiden som har nedsatt motorikk og som bruker hjelpemidler for å navigere nettsiden, eller brukere med kognitiv svikt. 

Vi har samlet fem tips for hvordan du kan gjøre nettsiden tilgjengelig for flest mulig brukere.

01. Typografi - gjør nettsiden din lett å lese

Nettsiden din skal være lett å lese. De som bruker nettsiden kan være svaksynte, de kan ha kognitiv svikt, eller de kan rett og slett ønske å skumlese innholdet på siden. Enkle designgrep som å bruke riktig størrelse på teksten, lengde på linjene og underoverskrifter hjelper til her.

På papir er det vanlig å bruke 12 punkt på tekst, mens på skjerm blir dette svært smått. Det er anbefalt å heller bruke 14 eller 16 punkt. Teksten skal også komme godt fram over bakgrunnen. Unngå at lange tekster ligger oppå bilder, og bruk i stede gjerne ensfarget transparent bakgrunn om nødvendig. 

Lange linjer er tunge å lese, og den lange avstanden fra slutt til starten av neste linje kan også forstyrre flyten i lesingen. For en side med én kolonne er 45 til 75 tegn regnet som god lengde. Det hjelper også med leseflyten at starten på hver linje er lik. Brødtekst bør derfor være justert til venstre, ikke midtstilt. 

Del opp teksten i paragrafer og bruk overskrifter og underoverskrifter. Dette gjør det lettere å forstå strukturen i teksten. Pass på at overskriftene er større slik at de skiller seg fra brødteksten.

02. Kontrast for svaksynte og fargeblinde, men også de som er ute i sola

Mobiltelefon som holdes opp mot sola, med refleksjon på skjermen.

Det hjelper lite at teksten er stor nok hvis du har lys grå tekst på hvit bakgrunn. God kontrast på tekster, knapper og ikoner er svært viktig. Dette er ikke kun for svaksynte, men også for brukere som har lav lysstyrke og kontrast på skjermen sin, for eksempel når man er ute i sola. 

For at innholdet skal komme godt nok fram skal kontrasten være 7:1 på liten tekst (f.eks brødtekst) og 3:1 på overskrifter og større illustrasjoner, ikoner o.l. 

03. Riktig bruk av alt-tekst

Mann med en hvit Guy Fawkes maske står mot kamera foran en grafittivegg.

Alt-tekst er tekster som kan leses av skjermlesere slik at de som ikke kan se bildet får med seg all viktig informasjon på siden.

En typisk feil er å starte alt-teksten med “Bilde av ..”. eller "ikon for ...".  Skjermlesere vet hva innholdet er, men trenger en tekst for å beskrive det for brukeren. Start derfor heller med å beskrive bildet enn å forklare at det er et bilde.

Det er også viktig å være detaljert hvis det er viktig for konteksten. Alt-teksten skal ikke bestå av nøkkelord, men være en fullstendig setning. Eksempel på dårlig alt-tekst her hadde vært “Person med maske, grafittivegg”. En bedre alt-tekst er “Mann med en hvit Guy Fawkes maske står mot kamera foran en grafittivegg.”. Pass også på at teksten ikke blir for lang. Maks lengde på alt-tekster er 125 tegn.

04. La lenkene skille seg ut fra teksten

Lenker i brødteksten kan av og til være vanskelig å oppdage, særlig for svaksynte og fargeblinde. Lenkene bør derfor skille seg tydelig fra teksten rundt, både med en farge og understrek. Men det er ikke bare i designet at man kan gjøre en forskjell. Hvordan man formulerer tekstene er også viktig. Man ser ofte at lenkene heter “her”, og ligger i slutten av en setning. For eksempel “Les om våre tilbud her”.  I stedet vil du fortelle hva lenken gjør eller hvilket innhold som venter i selve lenketeksten. En bedre lenketekst ville vært "Les om våre tilbud".

05. Gjør tekstene lett forståelig

Dette punktet henger mye sammen med det første, men dette går mer på språk og innholdsproduksjon enn design og layout. 

  • Gjør tekstene dine korte og presise. Unngå å skrive lange paragrafer som går over flere temaer. Bruk også gjerne punktlister. 
  • Bruk et enkelt språk. Hvis du bruker forkortelser eller fagbegreper er det lurt å forklare disse første gang de brukes.
  • Del opp sider med bilder og illustrasjoner. Dette hjelper å få fram poenget i teksten.

Kort fortalt

Du vil at nettsiden din skal være tilgjengelig for alle. Jeg har foreslått noen grep man kan gjøre for å forbedre siden, men dette er bare noen tips man kan ha i bakhodet. Har du spørsmål eller trenger hjelp til å gjøre brukeropplevelsen bedre for alle dine brukere, ikke nøl med å ta kontakt med oss.