Tilgjengelige skjemaer: Slik fjerner dere hindrene mellom bruker og innsending

Kategori: Universell utforming

Kontaktskjemaet er ofte stedet der nettsiden skal omsette interesse til handling. Brukeren vil bestille, søke, registrere seg eller be om hjelp. Hvis skjemaet er vanskelig å forstå eller betjene, stopper ikke problemet ved dårlig brukeropplevelse. Virksomheten mister også henvendelser, søknader og salg.

Tilgjengelige skjemaer handler derfor om mer enn farger og teknisk validering. Hele skjemareisen må fungere: fra brukeren forstår hva som skal fylles ut, til feil blir rettet og en tydelig bekreftelse vises. WCAG gir krav og prinsipper, men det praktiske arbeidet må ta utgangspunkt i oppgaven brukeren prøver å løse.

Start med oppgaven, ikke med skjemafeltene

Før dere vurderer kode, kontrast og skjermlesere, bør dere stille et enklere spørsmål: Hva trenger virksomheten faktisk å vite akkurat nå?

Mange skjemaer blir utilgjengelige fordi de er unødvendig omfattende. Hvert ekstra felt krever lesing, forståelse, navigasjon og en beslutning. Det rammer særlig brukere med nedsatt syn, motoriske utfordringer, lesevansker, konsentrasjonsvansker eller liten digital erfaring.

Skill mellom opplysninger dere må ha for å behandle henvendelsen, og opplysninger som bare kan være nyttige. Informasjon som kan innhentes senere, trenger ikke nødvendigvis stå i første skjema.

En nyttig gjennomgang av hvert felt

• Hvorfor trenger vi denne opplysningen? Et uklart svar tyder på at feltet kan fjernes.
• Må brukeren svare nå? Noe kan avklares i neste steg eller i en samtale.
• Kan feltet misforstås? Interne begreper og faguttrykk bør erstattes med brukerens språk.
• Kan vi godta flere formater? Telefonnummer, organisasjonsnummer og datoer bør ikke avvises på grunn av ufarlige variasjoner.

Et kortere skjema er ikke automatisk tilgjengelig, men det reduserer antallet mulige barrierer og gjør testingen mer håndterlig.

Gi hvert felt en tydelig og varig etikett

Et felt må ha en synlig etikett som forteller hva brukeren skal skrive inn. Et eksempel inne i feltet er ikke en fullgod erstatning. Eksempelteksten forsvinner gjerne når brukeren begynner å skrive, kan ha svak kontrast og blir ikke alltid presentert på en god måte av hjelpemidler.

Etiketten bør være kort og konkret, for eksempel «E-postadresse» eller «Beskriv hva du trenger hjelp med». Hvis feltet krever et bestemt format, bør instruksjonen stå synlig i nærheten før brukeren fyller det ut.

Den tekniske koblingen mellom etikett og felt er avgjørende for skjermlesere. Når koblingen er riktig, kan hjelpemiddelet presentere feltets navn, type, status og eventuelle instruksjoner. Visuell nærhet alene er ikke nok.

Vis tydelig hva som er obligatorisk

Ikke baser skillet mellom obligatoriske og valgfrie felt bare på farge eller et symbol uten forklaring. Skriv «obligatorisk» eller «valgfritt» på en konsekvent måte. Ofte er det ryddigst å merke de få valgfrie feltene dersom de fleste svarene er påkrevd.

Brukeren bør få vite om krav til passord, filtype eller tekstlengde før innsending. Det er frustrerende å bli informert om reglene først etter at svaret er avvist.

Bygg en forutsigbar tastaturflyt

Et tilgjengelig skjema skal kunne brukes uten mus. Brukeren må kunne bevege seg gjennom felter, avkrysningsbokser, valg og knapper i en logisk rekkefølge. Fokus skal være synlig hele tiden.

Rekkefølgen bør følge den visuelle og språklige strukturen. Hvis tastaturfokus hopper fra navn til sendeknapp og deretter tilbake til adresse, blir skjemaet vanskelig å forstå. Unngå å konstruere en kunstig fokusrekkefølge som forsøker å reparere en ulogisk sidestruktur.

Vær spesielt oppmerksom på egendesignede nedtrekkslister, datovelgere, filopplasting og valgknapper. Slike komponenter kan se fine ut, men mangle forventet tastaturbetjening. Standard skjemakontroller er ofte det tryggeste utgangspunktet når de dekker behovet.

En enkel tastaturtest

1. Last siden på nytt og legg bort musen.
2. Flytt gjennom hele skjemaet med tastaturet.
3. Kontroller at fokusmarkeringen er lett å se.
4. Prøv alle valg, knapper og eventuelle hjelpetekster.
5. Send inn skjemaet med tomme eller ugyldige felt.
6. Kontroller at dere kommer effektivt til feilene og kan rette dem.
7. Send inn på nytt og sjekk at bekreftelsen blir oppfattet.

Test også baklengs navigasjon. Det avdekker ofte fokusfeller og komponenter som ikke oppfører seg som forventet.

Kontrast gjelder mer enn tekst

God kontrast må omfatte teksten, men også informasjonen som gjør skjemaet mulig å bruke. Feltkanter, fokusmarkering, feilikoner, avkrysningsbokser og valgte tilstander må være synlige mot bakgrunnen.

Et vanlig problem er lysegrå feltkanter på hvit bakgrunn. Brukeren ser teksten, men ikke hvor feltet begynner og slutter. Et annet problem er en fokusmarkering som forsvinner mot knappen eller feltet den ligger rundt.

Farge skal heller ikke være eneste måte å kommunisere status på. En rød feltkant forteller lite til en bruker som ikke oppfatter fargen, og ingenting til en skjermleser. Kombiner farge med tydelig tekst, og gjerne et visuelt symbol når det bidrar til raskere forståelse.

Lag feilmeldinger som hjelper brukeren videre

«Ugyldig verdi» beskriver systemets reaksjon, ikke hva brukeren skal gjøre. En god feilmelding sier hvilket felt som har et problem, hva problemet er, og hvordan det kan løses.

Eksempel: «Skriv inn e-postadressen med både @ og domenenavn.» Dette er mer nyttig enn «E-post er ugyldig». Ved datofelt kan meldingen vise forventet rekkefølge uten å kreve et unødvendig strengt skrivemønster.

Når innsendingen feiler, bør feilene vises både samlet og ved de aktuelle feltene. En feiloversikt øverst gir overblikk, mens meldingen ved feltet gir nødvendig kontekst. Feiloversikten bør gjøre det enkelt å gå direkte til feltet som må rettes.

Ikke slett riktige opplysninger fordi ett felt inneholder en feil. Å måtte fylle ut hele skjemaet på nytt er særlig krevende i lange søknader og bestillingsløp.

Sørg for at skjermleseren får med seg endringer

Skjermleserbrukere oppfatter ikke nødvendigvis at nytt innhold dukker opp et annet sted på siden. Dette gjelder blant annet feilmeldinger, prisendringer, nye felt og bekreftelser etter innsending.

Dynamiske endringer må derfor håndteres slik at hjelpemidler kan oppfatte dem uten at brukeren må lete gjennom hele siden på nytt. Samtidig bør dere unngå at alle små endringer blir lest opp umiddelbart. For mange avbrytelser kan gjøre skjemaet mer krevende.

Test de viktigste stegene med skjermleser, ikke bare den første opplesningen av feltene. Kontroller særlig at:

• feltnavn og feltets type blir presentert riktig
• obligatorisk status og instruksjoner blir lest opp
• grupper med valg har et forståelig felles spørsmål
• feilmeldinger knyttes til riktig felt
• nye felt og statusmeldinger blir oppdaget
• bekreftelsen etter innsending er tydelig

Unngå at tidsfrister og sikkerhetstiltak stenger brukere ute

Tidsbegrensninger kan være problematiske for personer som leser sakte, bruker hjelpemidler eller trenger pauser. Hvis en økt må utløpe, bør brukeren varsles og få en reell mulighet til å forlenge den. Vurder også om utfylte opplysninger kan bevares på en trygg måte.

Sikkerhetskontroller må vurderes med samme omtanke. Oppgaver som krever tolkning av utydelige bilder, rask reaksjon eller presis motorikk kan hindre reelle brukere. Velg løsninger som beskytter skjemaet uten å gjøre menneskelig bevisføring til brukerens hovedoppgave.

Test hele skjemareisen med realistiske feil

En teknisk kontroll kan avdekke manglende etiketter og enkelte kontrastproblemer, men den forteller ikke om skjemaet er forståelig. Kombiner derfor automatiske kontroller med manuell testing og oppgaveløsning.

Lag noen faste testscenarier. En bruker skriver telefonnummer med mellomrom. En annen hopper over et obligatorisk felt. En tredje laster opp feil filtype. Test også hva som skjer ved treg respons, dobbeltklikk på sendeknappen og bruk av tilbakeknappen.

Ta med personer med ulike forutsetninger når skjemaet er viktig for virksomheten. Det kan avdekke problemer teamet ikke ser selv, som uklare spørsmål, uventede begreper eller en bekreftelse som ikke forklarer hva som skjer videre.

Gjør tilgjengelighet til en del av skjemaforvaltningen

Et skjema er sjelden ferdig for alltid. Nye felter, integrasjoner, kampanjer og spamtiltak kan endre hvordan det fungerer. Derfor bør virksomheten ha et tydelig ansvar for både innhold, teknikk og oppfølging.

Definer et minimumskrav for alle skjemaer: synlige etiketter, forståelige instruksjoner, logisk tastaturrekkefølge, tydelig fokus, tilstrekkelig kontrast, konkrete feilmeldinger og en bekreftelse som fungerer med skjermleser. Test på nytt når skjemaet eller den underliggende komponenten endres.

Det viktigste målet er ikke at skjemaet ser riktig ut i en sjekkliste. Målet er at flere mennesker skal kunne forstå oppgaven, fullføre den og vite at innsendingen kom frem.