Hopp til hovedinnhold

ARIA-feil

Feil bruk av ARIA kan gjøre siden verre enn ingen ARIA. Her er vanlige fallgruver.

Oppdatert
Kategori: teknisk

ARIA-feil

Hva er problemet?

WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications) er et sett med attributter som kan gi ekstra informasjon til skjermlesere. Men feil bruk er svært vanlig og kan føre til at innholdet blir helt uforståelig.

Vanlige feil inkluderer:

  • Bruk av attributter som ikke er tillatt på en gitt rolle.
  • Manglende påkrevde attributter (f.eks. aria-valuenow på en slider).
  • Bruk av roller som ikke finnes.

Hvorfor er dette viktig?

Skjermlesere stoler blindt på ARIA-informasjonen. Hvis du sier role="button", forventer skjermleseren at elementet oppfører seg som en knapp (kan fokuseres, aktiveres med Space/Enter). Hvis det ikke stemmer, blir brukeren lurt.

Første regel for ARIA: Ikke bruk ARIA hvis du kan bruke standard HTML. En <button> er alltid bedre enn <div role="button">.

Hvordan fikse det?

  1. Bruk HTML5-elementer: Bytt ut role="navigation" med <nav>, role="banner" med <header>, etc.
  2. Sjekk dokumentasjonen: Hvis du må bruke ARIA, sjekk MDN Web Docs for hvilke attributter som er tillatt og påkrevd.
  3. Valider koden: Verktøy som Axe (som UUKontroll bruker) oppdager de fleste ugyldige ARIA-kombinasjoner.