Hopp til hovedinnhold

Kunnskapsbase

Alt du trenger å vite om universell utforming og WCAG. Praktiske guider, krav og tips for utviklere, designere og innholdsprodusenter.

Artikler merket med «koding»

Vis alle

Merk fremmedspråk i koden (WCAG 3.1.2)

Innhold på et annet språk enn resten av siden må markeres med riktig lang-attributt i koden.

wcag niva-aa koding

Interaktive elementer

Slik sikrer du at alle interaktive elementer fungerer med tastatur – forstå WCAG 2.1.1, tabindex og tilgjengelige klikkhandlere.

wcag niva-a navigasjon +1

Autofullfør i skjema

Lær hvordan autocomplete-attributtet i HTML hjelper brukerne å fylle ut skjemaer raskere og med færre feil, og hvordan du bruker det riktig i WCAG-arbeidet.

wcag niva-aa skjema +1

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.

wcag niva-a koding

Formidle endringer uten å flytte fokus (WCAG 4.1.3)

Viktige statusmeldinger må formidles til hjelpemidler uten å flytte fokus, ved hjelp av ARIA live regions.

wcag niva-aa koding

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.

wcag niva-a skjema +1

Bruk like navn for like funksjoner (WCAG 3.2.4)

Elementer med samme funksjon skal se like ut og ha samme navn på tvers av alle sider.

wcag niva-aa design +1

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.

wcag niva-a navigasjon +1

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.

wcag niva-a koding

Sørg for at tekstavstand kan justeres (WCAG 1.4.12)

Brukere må kunne overstyre tekstavstand uten at innhold eller funksjonalitet går tapt.

wcag niva-aa design +1

Kontroller innhold som dukker opp ved hover og fokus (WCAG 1.4.13)

Innhold som dukker opp ved hover eller fokus må kunne lukkes, holdes synlig og ikke forsvinne uventet.

wcag niva-aa navigasjon +1

Riktig leserekkefølge i koden (WCAG 1.3.2)

Innholdet på nettsiden må presenteres i en logisk og meningsfull rekkefølge, også for hjelpemidler.

wcag niva-a koding

Tabeller

Lær hvordan du lager tilgjengelige HTML-tabeller med riktige overskrifter, caption og scope, og når du bør bruke CSS grid i stedet.

wcag koding

Lister

Lær hvorfor semantiske lister med ul, ol og dl er avgjørende for tilgjengelighet, og hvordan du bruker dem riktig i HTML.

wcag koding

Mangler hovedinnhold (main)

Uten et tydelig hovedinnholdsområde må skjermleserbrukere lete seg gjennom hele siden. Lær hvordan HTML-landemerker gjør navigasjon raskere og enklere.

wcag koding navigasjon

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.

wcag niva-a navigasjon +1

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.

wcag niva-a koding

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.

wcag niva-a koding

Rammer og iframes

Lær hvorfor iframes trenger beskrivende titler for å være tilgjengelige, og hvordan du unngår vanlige feil med innebygde rammer.

wcag koding

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.

wcag niva-a koding

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.

wcag niva-a koding +1

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.

wcag niva-a koding