Bloggen  /  Universell utforming Universell utforming

Universell utforming: 5 ting på nettsiden din som oftest svikter

Tilgjengelighet høres ut som en pliktøvelse for jurister. Men de fem feilene som går igjen, er de samme som får helt vanlige kunder til å gi opp og forlate siden. Å fikse dem er like mye salg som regelverk.

Rolig naturlandskap, et bilde på en nettside som er åpen for alle

Universell utforming betyr at nettsiden er laget slik at flest mulig kan bruke den, også de som ikke ser så godt, ikke hører, eller navigerer med tastatur eller skjermleser i stedet for mus. I Norge er dette ikke valgfritt: nettsider rettet mot allmennheten må følge kravene, som bygger på den internasjonale standarden WCAG, og det føres tilsyn med at de overholdes.

Det gode er at den samme innsatsen som gjør siden lovlig, gjør den bedre for alle. Her er de fem tingene som oftest svikter, og som er verdt å gå løs på først.

Kort om hva loven krever

Norske private nettsteder mot publikum må oppfylle et sett krav på nivå A og AA i WCAG. Du trenger ikke kunne standarden utenat. Det praktiske er at siden skal kunne oppfattes, brukes, forstås og fungere robust på tvers av hjelpemidler. De fem punktene under dekker det som oftest går galt i praksis.

1. Skjemaer som ikke virker

Dette er den hyppigste klagen, og den dyreste feilen. Et kontaktskjema, en kasse eller en booking som ikke lar seg fylle ut med tastatur eller skjermleser, stenger ute både personer med funksjonsnedsettelse og, ofte, helt vanlige mobilbrukere.

De vanligste tabbene: felt uten en tydelig ledetekst (label) knyttet til seg, feilmeldinger som bare vises med farge, og felt der det ikke går an å se hvor du er. Løsningen er enkel: hvert felt skal ha en synlig ledetekst, feil skal forklares med tekst, og det skal alltid være tydelig hvilket felt som er aktivt.

2. For svak kontrast

Lysegrå tekst på hvit bakgrunn ser elegant ut i en designskisse, men blir uleselig for mange i sollys eller med svekket syn. WCAG setter en konkret grense: vanlig tekst bør ha et kontrastforhold på minst 4,5 mot bakgrunnen. Mye «pen, dempet» tekst på nettet ligger under dette.

Dette er en av de letteste feilene å rette, og en av de mest oversette. Et gratis kontrastverktøy forteller deg på sekunder om teksten din holder mål.

3. Umulig å bruke uten mus

Mange navigerer nettet kun med tastatur. Da må du kunne nå alt, menyer, lenker, knapper og skjemafelt, ved å trykke deg gjennom, og du må kunne se hvor du er underveis. Sider som skjuler denne markeringen, eller der noe bare virker når du holder musepekeren over, faller fort gjennom.

Test det selv: legg vekk musa og prøv å bruke din egen side med Tab-tasten. Kommer du gjennom hele kjøpet eller kontaktskjemaet? Hvis ikke, gjør ikke kundene dine det heller.

4. Bilder uten alt-tekst

Alt-tekst er en kort beskrivelse av et bilde som leses opp av skjermlesere og vises hvis bildet ikke laster. Bilder som bærer informasjon, et produktbilde, et kart, en grafikk, trenger en beskrivende alt-tekst. Rent dekorative bilder skal derimot ha tom alt-tekst, slik at skjermleseren hopper over dem i stedet for å lese opp et filnavn.

Regelen er enkel: formidler bildet noe, beskriv det. Er det bare pynt, merk det som pynt.

5. Rotete struktur

Overskrifter er ikke bare visuell pynt, de er kartet over siden. Skjermlesere bruker dem til å hoppe rundt, akkurat som du skummer en avis etter mellomtitler. Når en side har overskrifter i tilfeldig rekkefølge, eller bruker store bokstaver bare for å se fete ut, forsvinner kartet.

En ryddig side har én hovedoverskrift, deretter underoverskrifter i logisk rekkefølge, og et tydelig hovedinnhold. Det hjelper skjermlesere, søkemotorer og, ikke minst, vanlige lesere.

Kort oppsummert
  • Norske nettsider mot publikum må følge krav om universell utforming (WCAG, nivå A og AA).
  • Skjemaer som ikke virker er den vanligste, og dyreste, feilen.
  • Kontrast, tastaturbruk, alt-tekst og ryddig struktur dekker det meste.
  • Det som gjør siden tilgjengelig, gjør den bedre for alle besøkende.

Slik tester du selv

  • Legg vekk musa og prøv å bruke siden kun med Tab- og piltastene.
  • Sjekk fargekontrasten på tekst med et gratis kontrastverktøy.
  • Slå på skjermleseren som allerede ligger i telefonen eller datamaskinen, og hør hvordan siden leses opp.
  • Se om hvert skjemafelt har en synlig ledetekst, ikke bare en grå plassholdertekst som forsvinner når du skriver.
  • Kontroller at bilder enten har en beskrivende alt-tekst eller er merket som dekorative.

Når vi bygger nettsider i Ailo, er dette en del av kvalitetssikringen, ikke et tillegg på toppen. Det henger også tett sammen med regelverket: vil du forstå når de nye EU-kravene faktisk gjelder en norsk bedrift, har vi skrevet om tilgjengelighetsloven og det norske paradokset i en egen artikkel.

Ofte stilte spørsmål

At nettsiden er laget slik at flest mulig kan bruke den, også personer med nedsatt syn, hørsel, eller som bruker tastatur eller skjermleser. I Norge følger kravene den internasjonale standarden WCAG.

Ja. I Norge må nettsider rettet mot allmennheten følge krav om universell utforming etter WCAG, og dette gjelder også private virksomheter. Tilsynet for universell utforming av ikt fører tilsyn.

Skjemaer man ikke får fylt ut med tastatur eller skjermleser, og felt uten tydelige ledetekster. Det er blant de hyppigste klagene, og rammer ofte kasse, kontakt og booking.

Ja. God kontrast, klar struktur og skjemaer som virker, gjør siden bedre for alle besøkende, ikke bare dem med nedsatt funksjonsevne. Det bedrer ofte både brukervennlighet og søkemotoroptimalisering.

Prøv å navigere siden kun med tastatur, sjekk fargekontrast med et gratis verktøy, og test med en skjermleser. Det avdekker de fleste vanlige problemene raskt.

Det er rimeligere å bygge tilgjengelig fra start enn å rette opp i etterkant. Mye handler om gode grunnvalg: kontrast, struktur og skjemaer som fungerer.

VB
Vegard Bikset

Utvikler av Ailo. Skriver om nettsider, synlighet og hvordan norske bedrifter får mer ut av tiden sin på nett.

En nettside som virker for alle.

Ailo bygger nettsider med god kontrast, ryddig struktur og skjemaer som fungerer med tastatur og skjermleser.

Bygg nettsiden min