UUKontroll
Kunnskapsbase
Alt du trenger å vite om universell utforming og WCAG. Praktiske guider, krav og tips for utviklere, designere og innholdsprodusenter.
Artikler merket med «niva-a»
Vis alleIkke stol kun på form, farge eller plassering (WCAG 1.3.3)
Instruksjoner på nettsiden må ikke kun basere seg på form, farge, størrelse eller plassering for å bli forstått.
Bilder mangler alternativ tekst
Alle meningsfulle bilder må ha alt-tekst som beskriver innholdet. Lær hvordan du skriver god alt-tekst for ulike bildetyper etter WCAG 1.1.1.
Interaktive elementer
Slik sikrer du at alle interaktive elementer fungerer med tastatur – forstå WCAG 2.1.1, tabindex og tilgjengelige klikkhandlere.
Kontroll over innhold
Lær hvorfor autoavspilling, karuseller og animasjoner må kunne pauses eller stoppes, og hvordan du oppfyller WCAG 2.2.2 Pause, stopp, skjul.
Snarveier til innhold
En «hopp til innhold»-lenke lar tastaturbrukere slippe å tabbe gjennom menyen på hver side. Lær hvordan du implementerer skip links riktig.
Språk er ikke angitt i koden
Nettsiden må angi språk med lang-attributtet. Lær om WCAG 3.1.1 og hvorfor feil språkkode gjør innhold vanskelig å forstå for skjermlesere.
Vis tydelig hvor og hva feilen er (WCAG 3.3.1)
Når en feil oppdages automatisk i et skjema, skal feilen identifiseres og beskrives tydelig i tekst.
Ingen overraskelser ved endring i skjemafelt (WCAG 3.2.2)
Endring av verdien i et skjemafelt skal ikke automatisk utløse store endringer på siden.
Tilby alternativer til bevegelsesstyring (WCAG 2.5.4)
Funksjonalitet styrt av enhetsbevegelse eller brukerbevegelse må også kunne brukes via vanlige kontroller.
Ingen overraskelser når noe får fokus (WCAG 3.2.1)
Når et element får fokus via tastatur skal det ikke utløse uventede endringer på siden.
Tilby alternativer til komplekse bevegelser (WCAG 2.5.1)
Funksjonalitet som krever komplekse bevegelser som sveip eller flerfinger-gester må ha et enklere alternativ.
La brukeren angre trykk og klikk (WCAG 2.5.2)
Handlinger skal ikke utføres ved bare å trykke ned museknappen, slik at brukeren kan avbryte ved å flytte pekeren bort.
Synlig tekst må matche det tilgjengelige navnet (WCAG 2.5.3)
Den synlige teksten i et interaktivt element må finnes igjen i elementets tilgjengelige navn for stemmestyring.
Unngå blinkende og flimrende innhold (WCAG 2.3.1)
Innhold skal ikke blinke eller flashe mer enn tre ganger per sekund for å unngå anfall hos brukere.
Unngå tastaturfeller (WCAG 2.1.2)
Brukere som navigerer med tastatur skal aldri bli fanget i et element uten mulighet til å komme seg ut.
Enkle hurtigtaster må kunne slås av (WCAG 2.1.4)
Hurtigtaster som aktiveres med et enkelt tegn må kunne slås av, endres eller bare virke ved fokus.
Gi brukeren nok tid (WCAG 2.2.1)
Tidsbegrensninger på nettsiden må kunne justeres, forlenges eller slås av av brukeren.
Formidle informasjon med mer enn bare farge (WCAG 1.4.1)
Farge alene skal ikke være den eneste måten å formidle informasjon, indikere en handling eller skille elementer.
Gi brukeren kontroll over automatisk lyd (WCAG 1.4.2)
Lyd som starter automatisk må kunne stoppes, pauses eller dempes av brukeren innen tre sekunder.
Riktig leserekkefølge i koden (WCAG 1.3.2)
Innholdet på nettsiden må presenteres i en logisk og meningsfull rekkefølge, også for hjelpemidler.
Skjult innhold og fokus
Når innhold er skjult for skjermlesere men fortsatt kan få tastaturfokus, oppstår en forvirrende og frustrerende opplevelse. Lær hvordan du unngår denne vanlige feilen.
ARIA-feil
Feil bruk av ARIA-attributter er en av de vanligste tilgjengelighetsfeilene på norske nettsider. Lær den første regelen for ARIA og hvordan du unngår fallgruvene.
Unike ID-attributter
Dupliserte ID-er i HTML kan ødelegge skjema, ARIA-koblinger og navigasjon. Lær hvorfor unike ID-er er et krav i WCAG og hvordan du finner og fikser problemet.
Multimedia og alternativer
Forstå kravene til teksting av video og tekstalternativer for lyd – og hvorfor det er avgjørende for tilgjengelighet og god brukeropplevelse.
Skjemaelementer mangler merkelapp (label)
Alle skjemafelt må ha en tilknyttet ledetekst (label) slik at skjermlesere kan fortelle brukeren hva feltet er til for. Lær om WCAG 3.3.2 og hvordan du kobler labels riktig med for/id.
Overskrifter og struktur
Overskrifter må følge et logisk hierarki uten å hoppe over nivåer. Lær om WCAG 1.3.1 Informasjon og relasjoner, semantisk HTML, og hvordan riktig overskriftsstruktur hjelper alle brukere.
Lenker må ha forståelig tekst
Lenketekster som «klikk her» eller «les mer» gir ingen mening for skjermleserbrukere. Lær om WCAG 2.4.4 og hvordan du skriver gode, selvforklarende lenker som fungerer for alle.
Knapper mangler navn
Knapper som kun viser et ikon må ha et tilgjengelig navn slik at skjermlesere kan forklare funksjonen. Lær om WCAG 4.1.2 Navn, rolle, verdi og hvordan du fikser ikonknapper med aria-label.
Siden mangler tittel
Alle nettsider må ha en unik og beskrivende tittel i title-elementet. Lær om WCAG 2.4.2, hvorfor sidetitler er avgjørende for skjermlesere og navigasjon, og hvordan du skriver gode titler.