Bruk av disabled

Deaktivering av elementer kan føre til forvirring. Her kan du lese om hvordan unngå det og ulike tilnærminger.

Hvorfor unngå disabled?

I skjemaer bør du unngå å bruke en "disabled"-status på knapper og felt. Selv om disabled medfører styling for visuelle bruker, fjerner det elementet fra tab-navigasjonen, og kan for screenreaders oppleves som ikke-eksisterende.

En bedre fremgangsmåte er å ha en tidlig retur i funksjonen og å formidle feilen.

aria-describedby

Det er viktig å formidle feil gjennom eksplisitte meldinger, så brukere kan forstå hva som er galt og hvordan det kan korrigeres. Til dette kan du bruke aria-describedby for å lenke inputfelter til spesifikke feilmeldinger. Dette gjøres ved å sette en unik ID på feilmeldingselementet og referere denne IDen i aria-describedby attributten i det tilknyttede inputfeltet. Dette sikrer at skjermlesere og annen assistiv teknologi kan formidle disse feilene effektivt til brukeren.

For å ytterligere forbedre brukeropplevelsen, kan du vurdere å bruke dynamisk validering som gir umiddelbar tilbakemelding når brukeren fyller ut skjemaet, før de prøver å sende det inn. Les mer på UU-tilsynet om å formidle feil i skjema.

aria-disabled

aria-disabled er en egenskap som varsler skjermlesere om at et element er disabled, uten å fjerne det fra tab-navigasjonen. Se video-eksempel for hvordan dette ser ut HER.

Vi har lagt til disabled-styling også for aria-disabled, så også visuelle brukere kan se tegn på at en knapp ikke lenger er interaktiv.