development
Kan din chatbot rent faktisk bruges af alle?
Chatbots er nu en primær kundeservicekanal — men de fleste af dem er utilgængelige. Her er de mest almindelige fejl, hvorfor de betyder noget, og hvad tilgængelige chatbots kræver.
Chatbots har et tilgængelighedsproblem
Kundeservicechatbots er blevet den primære — og ofte eneste — kontaktmulighed for mange digitale produkter. Forventningen er klar: hvis du har brug for hjælp, så åbn chatten. Hvis chatten ikke virker for dig, er der ofte ikke andet.
For brugere med handicap er denne situation ofte uholdbar. De fleste kommercielle chatbots opfylder ikke grundlæggende tilgængelighedskrav. Skærmlæserbrugere kan ikke høre beskeder, efterhånden som de ankommer. Tastaturbrugere bliver fanget inde i chat-widgeten og kan ikke slippe ud. Brugere med motoriske handicap støder på berøringsmål, der er for små til at trykke pålideligt på. Brugere med kognitive handicap står over for mure af tekst og ingen klar måde at komme sig efter en misforstået forespørgsel.
Dette betyder noget både etisk og juridisk. European Accessibility Act, som har været i kraft siden juni 2025, dækker de digitale kundeservicekanaler hos virksomheder inden for anvendelsesområdet — hvilket inkluderer chatbot-grænseflader. ADA i USA er blevet anvendt på chatbots i retssager om webtilgængelighed. Hvis en chatbot er en primær servicekanal, er en utilgængelig chatbot en serviceudelukkelse.
De syv mest almindelige tilgængelighedsfejl i chatbots
1. Manglende ARIA live-regioner
Når en ny besked ankommer i et chatvindue, har en skærmlæserbruger brug for at høre den. Men skærmlæsere annoncerer kun indhold, som de har fået at vide er vigtigt og dynamisk. Uden en ARIA live-region, der omslutter beholderen med chatbeskeder, vises beskeder visuelt, men er fuldstændig lydløse for skærmlæserbrugere.
<!-- Uden live-region: nye beskeder annonceres ikke -->
<div class="chat-messages">
<!-- Beskeder tilføjes her dynamisk -->
</div>
<!-- Med live-region: nye beskeder annonceres, efterhånden som de ankommer -->
<div
class="chat-messages"
role="log"
aria-live="polite"
aria-label="Chatsamtale"
>
<!-- Beskeder tilføjes her dynamisk -->
</div>
role="log" er specifikt defineret i ARIA til chatsamtaler og beskedstrømme. aria-live="polite" annoncerer nyt indhold, efter at brugeren holder pause — mindre forstyrrende end assertive i en samtalekontekst.
2. Tastaturfælder
En tastaturfælde opstår, når en bruger tabber ind i en komponent og ikke længere kan tabbe ud — de sidder fast. Chatbot-widgets er blandt de mest almindelige steder, hvor tastaturfælder optræder.
Løsningen kræver implementering af korrekt fokushåndtering: Tab og Shift+Tab skal navigere gennem interaktive elementer inden i chatten, og Escape skal lukke chatten og returnere fokus til det element, der udløste den. WCAG 2.1.2 No Keyboard Trap (Niveau A) dækker dette krav.
At teste dette er enkelt: åbn din chatbot med kun tastaturet, tab gennem alle interaktive elementer inde i den, og bekræft, at du kan komme ud ved hjælp af Escape eller en tydeligt synlig lukkeknap.
3. Utilstrækkelig farvekontrast
Chatbots gengives ofte i brandfarver, og brandfarver er ofte ikke testet mod WCAG’s kontrastkrav. Almindelige fejl:
- Chatbobletekst, der ikke opfylder 4,5:1 kontrast mod boblens baggrund
- Pladsholdertekst i inputfelter under kontrasttærsklerne
- Tidsstempeltekst i meget lysegrå
Kontrastkravet gælder for chatbot-grænsefladen, ligesom det gælder for resten af dit website — der er ingen undtagelse for widgets.
4. Umærkede inputfelter og knapper
Chatinputfeltet — “Skriv din besked…” — skal have en programmatisk tilknyttet etiket, ikke kun pladsholdertekst. Pladsholdertekst forsvinder, så snart brugeren begynder at skrive, og er ikke en pålidelig erstatning for en etiket.
Send-knappen, minimeringsknappen, lukkeknappen og enhver anden interaktiv kontrol skal have tilgængelige navne. En send-knap med kun et ikon uden tekst og uden aria-label annonceres af skærmlæsere som “knap” uden nogen beskrivelse af dens formål.
<!-- Manglende etiket: fejler -->
<input type="text" placeholder="Skriv en besked...">
<button><svg><!-- send-ikon --></svg></button>
<!-- Med etiket og aria-label: består -->
<label for="chat-input" class="sr-only">Skriv din besked</label>
<input type="text" id="chat-input" placeholder="Skriv en besked...">
<button aria-label="Send besked">
<svg aria-hidden="true"><!-- send-ikon --></svg>
</button>
5. Berøringsmål for små til motorisk hæmmede brugere
WCAG 2.2 introducerede 2.5.8 Target Size (Minimum) på Niveau AA, som kræver, at interaktive elementer har en minimum målstørrelse på 24×24 CSS-pixels. Mange chatbot-grænseflader placerer luk-, minimerings- og emoji-knapper på 16-20 pixels — et godt stykke under denne tærskel.
For brugere med motoriske handicap, rysten eller nedsat finmotorik er små mål reelt ubrugelige. Chatbottens handlingsknapper er blandt de hyppigst berørte UI-elementer.
6. Ingen advarsel om timeout eller forlængelse af session
Mange chatbots afslutter en inaktiv session efter en fastsat periode. Når dette sker uden varsel, kan brugere, der bruger længere tid på at skrive eller læse beskeder — herunder mange brugere med kognitive eller motoriske handicap — miste deres samtale uden nogen mulighed for at forlænge sessionen.
WCAG 2.2.1 Timing Adjustable (Niveau A) kræver, at når en tidsgrænse er sat, kan brugere slå den fra, forlænge den, eller grænsen er mindst 20 timer. En chatbot, der afslutter sessioner efter 5 minutters inaktivitet uden varsel, er ikke compliant.
7. Komplekst sprog og ingen fejlretning
Chatbots er kun nyttige, hvis brugere kan kommunikere effektivt med dem. For brugere med kognitive handicap, indlæringsvanskeligheder eller lavere læsefærdigheder er en chatbot, der bruger jargon, giver lange mure af tekst uden struktur eller fejler lydløst, når den ikke forstår en forespørgsel, funktionelt utilgængelig.
Tilgængeligt chatbot-indhold:
- Bruger enkelt sprog (korte sætninger, almindelige ord)
- Opdeler svar i skimbare enheder i stedet for at præsentere afsnit
- Giver klar fejlretning: når botten ikke forstår, siger den det eksplicit og tilbyder specifikke alternativer
- Understøtter brugere i at omformulere forespørgsler i stedet for blot at sige “Det forstod jeg ikke”
Nye WCAG 2.2-kriterier, der er særligt relevante for chatbots
WCAG 2.2 tilføjede flere succeskriterier, der gælder med særlig kraft for chatgrænseflader:
2.4.11 Focus Not Obscured (Minimum) — Niveau AA. Når en chat-widget er åben, må den ikke fuldstændigt skjule det fokuserede element bag sig. Mange chat-widgets vises over sideindhold og skjuler det fokuserede element, når brugere tabber gennem den underliggende side.
2.4.12 Focus Not Obscured (Enhanced) — Niveau AAA. Det fokuserede element bør være fuldt synligt.
2.5.7 Dragging Movements — Niveau AA. Hvis din chat-widget kan flyttes ved at trække, skal der findes et alternativ med enkelt pegeenhed.
2.5.8 Target Size (Minimum) — Niveau AA, som dækket ovenfor.
Sådan tester du din chatbot
-
Kun tastatur: åbn chatten uden at bruge en mus. Tab gennem alle elementer. Bekræft, at du kan skrive, sende beskeder og lukke widgeten udelukkende med tastaturet. Bekræft, at du kan komme ud med Escape.
-
Skærmlæser: åbn NVDA (Windows, gratis) eller VoiceOver (Mac/iOS, indbygget) og interager med chatten. Bekræft, at beskeder annonceres, efterhånden som de ankommer. Bekræft, at input og knapper er mærket korrekt.
-
Zoom til 200%: bekræft, at chatgrænsefladen ikke flyder over eller skjuler sideindhold, når teksten forstørres.
-
Kontrastkontrol: brug en browserudvidelse som axe DevTools eller WAVE til at kontrollere kontrasten i chat-grænsefladen.
-
Mobil: test størrelsen på berøringsmål og bekræft, at chatten virker med iOS/Android-tilgængelighedsfunktioner (VoiceOver, TalkBack).
Hvis du integrerer en tredjeparts chatbot, så vurder leverandørens tilgængelighed, før du vælger. Bed om deres VPAT (Voluntary Product Accessibility Template) for at forstå deres påståede overensstemmelsesniveau. Test selv widgeten — leverandørpåstande er ikke en erstatning for direkte test.
At bygge chatbot-tilgængelighed ind fra starten er betydeligt billigere end at eftermontere det. Hvis du er ved at evaluere chatbot-platforme, så kør hver kandidat gennem denne tjekliste, før du forpligter dig.
For en omfattende gennemgang af din chatbot og resten af din digitale kundeserviceoplevelse, tal med vores team eller start med en gratis scanning af dine offentligt tilgængelige sider.
Test din chatbot og hele dit website for tilgængelighedsproblemer