Rundt én av fem har en funksjonsnedsettelse som påvirker hvordan de bruker nettet. Noen er blinde og navigerer med skjermleser. Mange flere ser dårlig, har nedsatt motorikk, er fargeblinde, eller har lese- og konsentrasjonsvansker. Legger du til alle som midlertidig er i samme situasjon, fordi de har brukket armen, sitter i sollys eller prøver å lese på en telefon med sprukket skjerm, snakker vi om en betydelig del av dem som besøker nettsiden din.
Universell utforming handler om at disse menneskene skal kunne bruke løsningen din. I Norge er det ikke valgfritt.
Hva loven faktisk krever
Forskrift om universell utforming av IKT stiller krav til nettsider og apper rettet mot allmennheten. Kravet er WCAG 2.1 på nivå AA. Det gjelder private virksomheter, ikke bare det offentlige, og Digitaliseringsdirektoratet fører tilsyn og kan ilegge tvangsmulkt.
Offentlige virksomheter må i tillegg publisere en tilgjengelighetserklæring som beskriver hvor løsningen oppfyller kravene og hvor den ikke gjør det. For private er erklæringen ikke pålagt på samme måte, men den er en god øvelse uansett, fordi den tvinger fram en gjennomgang.
Mange oppdager kravene først når de skal levere tilbud i en offentlig anskaffelse. Da er universell utforming som regel et absolutt krav, og en løsning som ikke oppfyller det blir avvist uansett hvor god den ellers er.
De fire prinsippene, forklart med det de betyr
WCAG er bygget på fire prinsipper. Navnene er abstrakte, men innholdet er konkret.
At innholdet skal være mulig å oppfatte betyr at informasjon ikke kan være låst til én sans. Bilder som betyr noe trenger en tekstbeskrivelse, slik at en skjermleser kan lese den opp. Video trenger teksting. Og tekst må ha nok kontrast mot bakgrunnen, konkret et forhold på 4,5 til 1 for vanlig tekst. Lysegrå tekst på hvit bakgrunn ser elegant ut i en designskisse og er uleselig for mange i praksis.
At nettstedet skal være mulig å betjene betyr at ingenting kan forutsette mus. Alt du kan klikke på, må kunne nås med tabulatortasten og aktiveres med enter, og det må være synlig hvor tastaturfokus befinner seg. Dette er den enkleste testen du kan gjøre selv: legg bort musa og prøv å fullføre en bestilling. Kommer du ikke gjennom, gjør heller ikke en del av brukerne dine det.
At innholdet skal være forståelig handler like mye om språk som om kode. Skjemaer trenger tydelige ledetekster som blir stående, ikke bare en grå tekst inni feltet som forsvinner idet du begynner å skrive. Feilmeldinger må si hva som er galt og hvordan det rettes, ikke bare at noe feilet.
At løsningen skal være robust betyr at den må fungere sammen med hjelpemidler den ikke er testet mot. I praksis oppnås dette ved å bruke HTML slik det er ment. En knapp skal være en knapp i koden, ikke en div som ser ut som en knapp. Skjermlesere forstår det første og famler med det andre.
Det som oftest er galt
Når vi gjennomgår eksisterende nettsider, går de samme feilene igjen.
Bilder mangler alternativ tekst, eller har en tekst som ikke hjelper. Et produktbilde med alt-teksten "bilde" er like ubrukelig som ingen tekst. Samtidig skal dekorative bilder ha tom alt-tekst, slik at skjermleseren hopper over dem framfor å lese opp filnavnet.
Kontrasten er for svak. Dette er den vanligste enkeltfeilen, og som regel et resultat av at designet ble godkjent på en god skjerm i et godt opplyst rom.
Skjemaer mangler kobling mellom ledetekst og felt. Visuelt ser det riktig ut, men skjermleseren klarer ikke fortelle brukeren hvilket felt hen står i.
Og så er det tastaturfeller. Du kommer inn i en meny eller et popup-vindu, men ikke ut igjen uten mus. Dette skjer ofte i egenutviklede komponenter som skal se moderne ut.
Hvordan du kommer i gang
Start med en automatisk test. Verktøy som Lighthouse, som allerede ligger i Chrome, eller axe DevTools finner en god del på få minutter. Vær samtidig klar over at automatiske verktøy fanger opp anslagsvis en tredel av problemene. De kan se at et bilde mangler alt-tekst, men ikke om teksten er meningsfull.
Gjør deretter de to manuelle testene som gir mest igjen for tida. Naviger hele siden med kun tastatur, og les gjennom overskriftene alene for å se om de fortsatt gir mening som en disposisjon. Begge tar under en halvtime og avdekker mer enn folk tror.
Det viktigste rådet er likevel å ta det tidlig. Kontrastkrav og tastaturnavigasjon er nesten gratis å ta hensyn til når designet lages, og dyrt å rette i en ferdig løsning. Skal du uansett lage ny nettside, er det nå det koster minst.
Det er også god forretning
Argumentet trenger ikke bare være juridisk. En side som fungerer med tastatur fungerer bedre for alle som er raske på fingrene. Tydelig struktur og god kontrast gjør siden lettere å lese på mobil i sollys. Skikkelig HTML gjør den også lettere for søkemotorer å forstå, noe som henger tett sammen med arbeidet med SEO.
Hos oss ligger brukervennlighet til grunn for alt vi utvikler, og universell utforming er en del av det. Vi tester også eksisterende nettsider mot kravene og gir en konkret liste over hva som må rettes. Ønsker du en gjennomgang av din? Ta kontakt.