Lag løsninger for alle
Alle snakker om hvor viktig det er å lage løsninger som er universelt utformet. Men har du egentlig kontroll på hva det betyr? Vi hjelper deg med denne introduksjonen til universell utforming.
Kort fortalt er universell utforming å lage produkter, programmer, tjenester og omgivelser på en slik måte at de kan brukes av alle mennesker. Hos oss i Netlife tenker vi ikke på tilgjengelighet og universell utforming (UU) som et sett med regler, men mer som en designmetodikk som fokuserer på brukervennlighet, tilgjengelighet, enkelhet og funksjonalitet.
I alle år har vi jobbet med å lage prioriterte og slanke nettsteder med fokus på brukervennlighet, funksjonelt design og godt innhold. Da har vi i prinsippet laget universelt utformede løsninger som funker for alle.
Hele Norge skal bli universelt utformet
Det er et politisk mål at hele Norge skal bli universelt utformet. Både private og offentlige virksomheter, lag og organisasjoner må følge regelverket.
Universelt design utvikler seg med samfunnet. Mens universell utforming kan brukes til å designe og utvikle en digital løsning, finnes det andre regelverk for andre områder. For eksempel finnes beskrivelser i plan- og bygningslovens bygningstekniske standard (TEK17) for inkludering generelt i samfunnet.
Tilgjengelighet og inkludering i design er bredere temaer som handler om mer enn å følge et sett med regler for å sikre samsvar. Disse UU-reglene er med på å sikre at alle grunnleggende tilgjengelighetshensyn blir brukt på løsninger, som igjen bidrar til å sikre at flest mulig har tilgang til hele samfunnet.
Definisjonen av universell utforming er:
«Med 'universell utforming' menes utforming av produkter, omgivelser, programmer og tjenester på en slik måte at de kan brukes av alle mennesker, i så stor utstrekning som mulig, uten behov for tilpassing og en spesiell utforming. 'Universell utforming' skal ikke utelukke hjelpemidler for bestemte grupper av mennesker med nedsatt funksjonsevne når det er behov for det.»
- FNs konvensjon om rettigheter for personer med nedsatt funksjonsevne.
Hva bør du vite om universell utforming?
Uansett om du jobber med ledelse, innhold, design, utvikling eller noe helt annet så har du et ansvar innen universell utforming. Jeg har delt opp noen råd per fagretning:
Ledelse
Det viktigste du kan gjøre som leder, beslutningstaker, prosjektleder eller produktleder er å skaffe deg god oversikt over hva som ligger i reglementet om universell utforming. Da er det lettere å vite hva dere burde gjøre for å være innenfor lovverket og lage løsninger for alle brukerne deres.
- Se hva som dekkes av forskriften om universell utforming av IKT.
- Nettsider må oppfylle 35 av 61 suksesskriteriene i standarden Retningslinjer for tilgjengelig webinnhold (WCAG) 2.0. Du bør derfor vite hva som ligger i denne.
- Oppdaterte WCAG 2.1-regler som etterhvert tar over fra WCAG 2.0 og har med seg noen nye krav.
Interaksjonsdesignere
Dårlig navigasjon og en lite prioritert digital tjeneste er irriterende for de fleste brukere, men for en som for eksempel er blind og som får alt innhold lest opp av et hjelpemiddel, kan det ende med å gi opp før de finner frem til det de leter etter.
- Gjør harde prioriteringer av innholdet og alltid lag løsninger med ekte innhold (såkalt innhold først).
- Lag en god overskrift-struktur med hovedoverskrift (H1), mellomoverskrifter (H2) og uthevede overskrifter (H3).
- Lag løsninger med responsivt design som fungerer på alle skjermer uansett størrelse.
- Gjør det mulig å kunne zoome inn til 400% uten at du mister noe innhold eller funksjonalitet.
Både kvalitative og kvantitative undersøkelser med brukere hjelper oss med å lage gode løsninger og brukeropplevelser for alle, men er enda viktigere for brukergrupper med spesielle behov. Derfor bør du teste hyppig og med ekte brukere når du lager nye eller forbedrer tjenester.
Grafiske designere
Designet skal bidra til å gjøre innhold og funksjoner klare og tydelige. Dette gir en bedre brukeropplevelse for de fleste, men vil kunne være enda viktigere for de brukergruppene med større behov.
- Sørg for god nok kontrast på tekst og farger.
- Fokuser på klar og forståelig typografi, hierarki og lesbarhet når du designer visuelle løsninger.
- Lag store nok klikkflater.
- Lag løsninger med responsivt design. Svaksynte zoomer inn på store skjermer også. Hvis de zoomer i sin nettleser for å få teksten stor nok, vil de på en responsiv nettside få samme visning som et nettbrett eller mobil, som gjør at innholdet blir stort nok uten at de må navigere seg rundt horisontalt.
Noen krav i regelverket som går på design:
Utviklere
Helt siden vi startet med HTML-prototyper har vi hatt fokus på å skrive god kode fundert på åpne web-standarder. Benytter du HTML/CSS/JS slik det var ment å brukes blir nettsidene tilnærmet tilgjengelige ut av boksen.
- Mobile-first, semantics, progressive enhancements, performance as design - de fleste moteordene vi er opptatt av når det gjelder frontend bidrar også til god tilgjengelighet.
- Dagens nettløsninger krever innimellom skreddersydde komponenter. Da må vi gi litt ekstra tid for å være sikre på at innholdet kan nås og brukes av alle.
- Sørge for at HTML-strukturen er hierarkisk og semantisk korrekt.
- Skriv kode med riktige UU-elementer som alt-tekst og ARIA-tags.
- Sørg for at brukere kan bruke tab-tasten gjennom løsningen på en intuitiv måte.
Innholdsansvarlig / webredaktør
Sørger vi for innhold som er godt skrevet, prioritert etter de viktigste oppgavene til brukerne og er enkelt å forstå, så har vi allerede jobbet med å gjøre innholdet universelt utformet. I tillegg bør vi se på:
- Regler for ikke-tekstlig innhold
- Bare lyd og video (forhåndsinnspilt)
- Teksting (forhåndsinnspilt)
- Sidetitler
- Formål med lenke (i kontekst)
- Overskrifter og ledetekster
Oversikt over nyttige verktøy
Her er en liste over hvilke verktøy du kan brukes for å hjelpe deg med universelle utforming.
Chrome-plugins
- SiteImprove-plugin for Google Chrome (Sjekk kontraster, html-struktur og kode)
- Whatfont plugin for Google Chrome (Sjekk font-type og størrelse på et nettsted)
- WAVE evaluation tool for Google Chrome (Sjekker diverse UU-krav)
- Headingsmap plugin for Google Chrome (Se kart over overskrift-strukturen på siden)
- Funkify plugin for Google Chrome (Simulér ulike typer funksjonsnedsettelser på nettstedet)
- Contrast-checker fra WCAG (sjekker kontrastfeil og anbefaler WCAG-godkjente verdier)
- Colour-picker plugin for Google Chrome (Trekk ut en fargekode direkte fra nettsiden)
Figma-plugins
- Contrast (Sjekk kontraster direkte i Figma)
- Stark (Sjekker kontrast og enkle fargeblindhet-simuleringer)
Andre kontrastsjekkere
NPM-pakker (for utviklere)
Vil du lære mer?
Her er en liste over nyttige ressurser for å lære mer om universell utforming.
