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 alleMerk 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.
Interaktive elementer
Slik sikrer du at alle interaktive elementer fungerer med tastatur – forstå WCAG 2.1.1, tabindex og tilgjengelige klikkhandlere.
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.
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.
Formidle endringer uten å flytte fokus (WCAG 4.1.3)
Viktige statusmeldinger må formidles til hjelpemidler uten å flytte fokus, ved hjelp av ARIA live regions.
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.
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.
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.
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.
Sørg for at tekstavstand kan justeres (WCAG 1.4.12)
Brukere må kunne overstyre tekstavstand uten at innhold eller funksjonalitet går tapt.
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.
Riktig leserekkefølge i koden (WCAG 1.3.2)
Innholdet på nettsiden må presenteres i en logisk og meningsfull rekkefølge, også for hjelpemidler.
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.
Lister
Lær hvorfor semantiske lister med ul, ol og dl er avgjørende for tilgjengelighet, og hvordan du bruker dem riktig i HTML.
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.
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.
Rammer og iframes
Lær hvorfor iframes trenger beskrivende titler for å være tilgjengelige, og hvordan du unngår vanlige feil med innebygde rammer.
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.
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.
UUKontroll