Komponenter
Select
Select lar brukeren velge ett alternativ fra en liste.
Dette må du sjekke selv
Feltet skal ha en synlig label.
Skjermlesere skal presentere ledetekst, beskrivelse og feilmeldinger når feltet får fokus.
Du kan bruke Field for å koble sammen label, beskrivelse og feilmeldinger.
Feltet skal ha et tydelig tilgjengelig navn som samsvarer med den synlige label.
Det tilgjengelige navnet skal inneholde den synlige teksten som beskriver feltet. Dette gjør at brukere av talegjenkjenning og skjermlesere kan referere til feltet med samme navn som vises på skjermen.
Obligatoriske felt skal være tydelig merket.
Brukeren skal enkelt kunne forstå hvilke felt som må fylles ut. Følg mønsteret for obligatoriske og valgfrie skjemafelt.
Feilmeldinger skal være tydelig knyttet til riktig felt og forklare hvordan feilen kan rettes.
Feilmeldingen skal gjøre det klart hvilket felt som inneholder en feil, hva som er galt og hvordan brukeren kan rette den. Unngå generelle meldinger som «Feil» eller «Ugyldig verdi». Bruk heller konkrete meldinger, for eksempel «E-postadressen må inneholde @».
Se mønsteret for brukerutløste feilmeldinger for anbefalinger om når og hvordan feilmeldinger bør vises.
WCAG: 3.3.1 Identifikasjon av feil (uutilsynet) og 3.3.3 Forslag ved feil (uutilsynet)
Førstevalget skal ikke brukes som alternativ til ledetekst eller for å vise viktig informasjon.
Når brukerne har gjort et valg, skal de fremdeles kunne forstå konteksten valget hører til. Gi feltet en tydelig label, for eksempel «Velg land», og bruk eventuelt beskrivelse til ekstra veiledning.
Bruk riktig autocomplete-verdi når feltet gjelder brukeren selv.
Riktig autocomplete gjør det enklere å fylle ut skjema, og er påkrevd for felt som gjelder brukerens egne personopplysninger. Se Formål med inndata for når og hvordan du bruker det.
Ikke bruk deaktivert tilstand
Ikke bruk deaktivert (disabled) tilstand. Tenk heller over om du trenger å vise feltet i det hele tatt, eller om du heller kan skrive informasjonen ut i ren tekst eller bruke readOnly.
Test med tastatur
Sjekk at du kan
- nå select med tab
- åpne listen med Mellomrom på mac
- åpne listen med Enter på windows
- navigere mellom og merke alternativene med ↓ (piltast ned) og ↑ (piltast opp)
- velge et alternativ med både Enter og Mellomrom
- velge første alternativet i listen med Home
- velge siste alternativet i listen med End
- nå første alternativ i listen som starter med bokstavet eller tegnet fra et tastaturtrykk
- lukke listen med escape