Teknik

Så testar du webbplatsens tillgänglighet: Komplett guide

Sarah Dev

Lead Frontend

Lästid

4 min

Publicerad

10 nov. 2025

Att testa tillgänglighet kan kännas överväldigande. WCAG har 78 kriterier. Var börjar man? Vilka verktyg behövs? Hur vet man om man hittat allt?

Sanningen är att du aldrig hittar allt – men med rätt process hittar du det viktigaste. Nyckeln är att kombinera automatiska verktyg (snabba, konsistenta) med manuell testning (intelligent, kontextmedveten).

Denna guide tar dig genom en komplett testprocess från automatiska skanningar till djupgående skärmläsartester.

Teststrategi: Pyramiden

Tänk på tillgänglighetstestning som en pyramid:

Bas: Automatiska tester (bredd)

Skannar hela sajten, hittar uppenbara problem snabbt. Fångar ~30-40% av issues.

Mitt: Manuella kontroller (djup)

Tangentbordsnavigering, fokusordning, läsbara alternativtexter. Fångar kontextberoende problem.

Topp: Skärmläsartester (upplevelse)

Den verkliga användarupplevelsen för hjälpmedelsberoende användare. Hittar vad automatisering missar.

Balansen:

Kör automatiska tester ofta (varje deploy). Gör manuella kontroller regelbundet (månatligen). Gör skärmläsartester periodiskt (kvartalsvis).

Automatisering är din bas – inte din enda linje. De mest allvarliga problemen kräver ofta mänsklig bedömning.

Steg 1: Automatisk testning

Börja med automatiska verktyg för att få en baslinje.

Verktyg att använda:

•Xrayd – Skannar hela sajten, schemalagda rapporter

•Lighthouse – Gratis, inbyggt i Chrome DevTools

•axe DevTools – Webbläsartillägg för utvecklare

•WAVE – Visuell overlay av problem

Vad automatiska verktyg hittar:

•Saknade alt-texter

•Kontrastproblem

•Formulär utan labels

•Felaktiga ARIA-attribut

•Rubrikordning

Vad de missar:

•Om alt-texten är meningsfull (inte bara att den finns)

•Om fokusordningen är logisk

•Om innehållet är begripligt

•Skärmläsarspecifika problem

Steg 2: Tangentbordstest

Koppla ur musen och navigera sajten med enbart tangentbord.

Grundläggande kommandon:

•Tab – Flytta fokus framåt

•Shift + Tab – Flytta fokus bakåt

•Enter – Aktivera länk/knapp

•Space – Aktivera knapp, checka checkbox

•Escape – Stäng modal/popup

•Piltangenter – Navigera i menyer, sliders, tabs

Vad du ska kontrollera:

1.Kan du nå alla interaktiva element?

2.Syns fokusmarkeringen tydligt?

3.Är fokusordningen logisk (vänster-höger, topp-botten)?

4.Fastnar du någonstans (tangentbordsfälla)?

5.Kan du stänga modaler med Escape?

6.Kan du använda dropdowns, tabs och karuseller?

Tips:

Testa den viktigaste användarresan: Hitta produkt → Lägg i kundvagn → Checkout → Betala.

Steg 3: Skärmläsartest

Skärmläsartester är ovärderliga men kräver övning. Börja enkelt.

Välj en skärmläsare:

•VoiceOver (Mac/iOS) – Gratis, aktivera med Cmd+F5

•NVDA (Windows) – Gratis, ladda ner från nvaccess.org

•JAWS (Windows) – Dyrt, men industristandard

Grundläggande kommandon (NVDA):

•Ctrl – Stoppa uppläsning

•H – Hoppa till nästa rubrik

•F – Hoppa till nästa formulärfält

•B – Hoppa till nästa knapp

•D – Hoppa till nästa landmarke

Vad du ska kontrollera:

1.Läses sidtiteln upp korrekt?

2.Ger rubrikerna en meningsfull struktur?

3.Beskriver alt-texter bilderna bra?

4.Har formulärfält begripliga etiketter?

5.Annonseras statusändringar (felmeddelanden, confirmations)?

6.Är länktexter meningsfulla ur kontexten?

Steg 4: Manuell granskning

Vissa saker kräver mänsklig bedömning.

Innehållsgranskning:

•Är språket begripligt? (Särskilt för kognitiv tillgänglighet)

•Förmedlas information enbart via färg?

•Är instruktioner tydliga?

Visuell granskning:

•Fungerar sajten vid 200% zoom?

•Funkar den i olika färglägen (mörkt, hög kontrast)?

•Finns det rörligt innehåll som inte kan pausas?

Semantisk granskning:

•Är HTML semantiskt korrekt? (inte bara visuellt rätt)

•Används landmarker (

•Matchar visuell ordning DOM-ordningen?

Kognitiv tillgänglighet:

•Behöver användaren komma ihåg information mellan steg?

•Finns det tidsbegränsningar?

•Är felmeddelanden hjälpsamma?

Dokumentera resultaten

En tillgänglighetsrapport bör innehålla:

Per problem:

•Beskrivning av problemet

•Vilken sida/komponent som påverkas

•Vilket WCAG-kriterium som bryts

•Allvarlighetsgrad (Kritisk/Hög/Medium/Låg)

•Förslag på åtgärd

•Skärmbild om relevant

Övergripande:

•Sammanfattning av nuläge

•Antal problem per kategori

•Prioriterade åtgärder

•Rekommenderad tidsplan

Tips:

Använd ett verktyg som Xrayd för att generera rapporter automatiskt. Komplettera med dina manuella fynd.

Testa din webbplats tillgänglighet

Gratis skanning, ingen registrering

Vanliga frågor

Hur lång tid tar ett tillgänglighetstest?+

En automatisk skanning tar minuter. En grundlig manuell granskning av en medelstor sajt tar 1-2 dagar. En fullständig expert-audit kan ta en vecka eller mer beroende på komplexitet.

Hur ofta bör jag testa?+

Automatiskt: Vid varje release eller åtminstone veckovis. Manuellt med tangentbord: Månatligen eller vid nya funktioner. Skärmläsare: Kvartalsvis. Full expert-audit: Årligen.