Testa tillgängligheten på din webbplats själv i 7 steg
Du behöver ingen särskild programvara för att hitta hindren som stoppar kunder när de vill boka, köpa eller höra av sig. Med ett tangentbord, webbläsarens zoom och ett kontrastverktyg på nätet hittar du de vanligaste. Vi visar varje steg på vår egen webbplats.
Den här texten har tagits fram med hjälp av artificiell intelligens (AI). MEZA P.S.A. har det redaktionella ansvaret för publiceringen. Texten är aktuell per den 13 oktober 2026.
Texten är aktuell den 13 oktober 2026. Skärmbilderna tog vi i Chrome på den engelska versionen av vår webbplats, därför är texterna i dem på engelska. Kontrasten mätte vi med Contrast Checker från WebAIM. Kraven nedan utgår från WCAG 2.2 på nivå AA, den aktuella versionen av W3C:s riktlinjer och det vanliga riktmärket för företagswebbplatser.
De flesta tillgänglighetsproblem märks inte så länge du använder webbplatsen som vanligt. De syns först när du lägger undan musen, zoomar in eller mäter färgerna med ett kontrastverktyg. Välj de tre sidor som är viktigast för ditt företag. Oftast är det startsidan, sidan om din viktigaste tjänst eller produkt och sidan där kunderna bokar, betalar eller kontaktar dig. Gå sedan igenom stegen nedan.
Det här behöver du
- en bärbar eller stationär dator med tangentbord;
- en aktuell webbläsare (Chrome, Edge, Firefox eller Safari);
- WebAIM Contrast Checker på webaim.org/resources/contrastchecker;
- någonstans att anteckna det du hittar.
Steg 1: Lägg undan musen och tryck på Tabb
Klicka i adressfältet och tryck på tabbtangenten, Tabb. Varje tryck flyttar tangentbordsfokus till nästa länk, knapp eller fält. Med Skift + Tabb går du bakåt.
På en välbyggd webbplats visas en länk som ”Hoppa till innehållet” redan vid första tabbtrycket. Med den kan den som använder tangentbord eller skärmläsare hoppa förbi menyn som upprepas på varje sida. WCAG kräver ett sätt att hoppa över sådana återkommande block (framgångskriterium 2.4.1, nivå A). På vår engelska webbplats heter länken ”Skip to content”.
Steg 2: Ser du alltid var du är?
Fortsätt att trycka på Tabb. Varje länk och knapp ska få en tydlig ram, understrykning eller färgändring. Det kallas synligt fokus (2.4.7, AA).
Håll koll på tre saker medan du tabbar:
- Markeringen försvinner aldrig. Tappar du bort var du är har sidan inte klarat testet.
- Ordningen är logisk. Fokus följer läsordningen, uppifrån och ned och från vänster till höger.
- Inget täcker den. Ett fast sidhuvud, en cookiebanner eller en chattbubbla får inte dölja den markerade delen helt. Det kriteriet är nytt i WCAG 2.2 (2.4.11, AA).
Steg 3: Använd menyer och knappar bara med tangentbordet
Allt du kan göra med musen ska också gå att göra med tangentbordet (2.1.1, nivå A). Prova:
- rullgardinsmenyer: Enter eller mellanslag öppnar dem, Esc stänger dem;
- knappar och länkar: Enter gör samma sak som ett klick;
- datumväljare, reglage och listrutor: piltangenterna ändrar värdet;
- popup-fönster och dialogrutor: Esc eller en stängknapp som du når med tangentbordet stänger dem.
Det värsta du kan hitta är en tangentbordsfälla: du tabbar in i en widget, ofta en inbäddad bokningskalender eller en chatt, och kommer inte ut igen. WCAG förbjuder det uttryckligen (2.1.2, nivå A). För den som inte kan använda mus tar bokningen slut där.
Steg 4: Zooma till 200 %
Tryck på Ctrl och + (på Mac Cmd och +) tills webbläsaren visar 200 %. Texten ska gå att förstora till 200 % utan att innehåll eller funktioner går förlorade (1.4.4, AA).
Kontrollera att:
- texten bryts till nästa rad i stället för att fortsätta utanför högerkanten;
- du aldrig behöver skrolla i sidled för att läsa en mening;
- menyn fortfarande går att öppna;
- knappar och fält inte hamnar ovanpå varandra.
Vill du testa mer noggrant kan du zooma till 400 %. Enligt kriteriet om omflöde (1.4.10, AA) ska innehållet fungera utan skrollning i två riktningar vid en bredd på 320 CSS-pixlar. Det motsvarar 400 % zoom i ett fönster som är 1 280 CSS-pixlar brett, ungefär som skärmen på en vanlig bärbar dator.
Steg 5: Kontrollera att varje formulärfält har en etikett
Tabba in i ditt kontakt-, boknings- eller kassaformulär. Varje fält behöver en synlig etikett, till exempel ”Namn”, ”E-post” eller ”Meddelande” (3.3.2, nivå A).
Grå platshållartext inne i fältet är ingen etikett. Den försvinner så fort någon börjar skriva, och skärmläsare läser inte alltid upp den. Ett snabbt test: klicka på etikettens text. Hamnar markören i fältet är etiketten rätt kopplad.
Steg 6: Mät färgkontrasten
WCAG kräver minst det här på nivå AA:
| Element | Minsta kontrast |
|---|---|
| vanlig text | 4,5:1 |
| stor text (från 18 punkter, eller 14 punkter i fetstil) | 3:1 |
| ramar runt inmatningsfält, ikoner, knapplägen | 3:1 |
Färgerna hittar du i din grafiska profil eller med färgväljaren i webbläsarens utvecklarverktyg (F12). Skriv in textfärgen under ”Foreground” och bakgrundsfärgen under ”Background” i WebAIM Contrast Checker.
Vår brödtext får 16,77:1, långt över minimikravet. Ljusgrå text är ett vanligt problem. Så här ser #9A9A9A på vitt ut:
Med 2,81:1 klarar den grå texten inte ens gränsen för stor text. Se upp med ljusgrått i finstilt text, bildtexter, platshållartext i formulär och text ovanpå foton.
Steg 7: Granska bildbeskrivningar och länktexter
Bilder som förmedlar information behöver ett textalternativ som en skärmläsare kan läsa upp (1.1.1, nivå A). Rent dekorativa bilder ska ha en tom beskrivning, så att skärmläsare hoppar över dem.
För att kontrollera en bild högerklickar du på den, väljer Inspektera (så heter det i Chrome) och letar efter alt="…" i den markerade koden. Fråga dig sedan om beskrivningen gör samma jobb som bilden:
- ”bild” eller ”IMG_2041.jpg” säger ingenting;
- ”Logotyp” på en logotyp som länkar till startsidan skrivs hellre som ”[Företagets namn], startsida”;
- ”Dubbelrum med balkong mot havet” i bildgalleriet för ett pensionat är en bra beskrivning;
- saknas alt-attributet helt är det ett fel, och skärmläsaren kan läsa upp filnamnet i stället.
På sidor med många bilder hjälper WAVE från WebAIM (wave.webaim.org). Verktyget markerar bilder utan alternativtext som fel. Om en beskrivning är vettig kan WAVE inte bedöma. Det får du göra själv.
Läs samtidigt dina länk- och knapptexter var för sig. Den som använder skärmläsare går ofta igenom en lista med alla länkar på sidan. Fem länkar som heter ”Läs mer” säger då ingenting. WCAG kräver att syftet med en länk framgår av texten eller sammanhanget (2.4.4, nivå A). Knappar med bara en ikon, som ett förstoringsglas eller en varukorg, behöver också ett tillgängligt namn.
Anteckna det du hittar
Det räcker med en enkel tabell:
| Sida | Steg | Problem | Följd |
|---|---|---|---|
| Kassan | 2. Fokus | ingen synlig ram på knappen ”Betala” | den som använder tangentbord kan inte betala |
| Kontakt | 5. Etiketter | telefonfältet har bara platshållartext | svårare att fylla i formuläret |
| Startsida | 6. Kontrast | grå bildtext med 2,8:1 | svårläst |
Åtgärda först det som stoppar ett köp, en bokning eller en förfrågan: tangentbordsfällor, saknade etiketter och osynligt fokus.
Det här testet lämnar mycket utanför, till exempel tester med skärmläsare, undertexter, felmeddelanden och tidsgränser. Vill du gå ett steg längre kan du slå på VoiceOver på en Mac (Cmd + F5) eller starta skärmläsaren som finns inbyggd i Windows (Windows-tangenten + Ctrl + Enter). Försök sedan skicka ditt kontaktformulär.
Lagen i korthet
Sedan 28 juni 2025 gäller lag (2023:254) om vissa produkters och tjänsters tillgänglighet för e-handelstjänster till konsumenter, och Post- och telestyrelsen (PTS) har tillsyn. E-handelstjänster är webbplatser och appar där en konsument ingår ett avtal på distans, till exempel köper i en webbutik eller bokar och betalar en tid.
Mikroföretag som tillhandahåller tjänster är undantagna från kraven. Som mikroföretag räknas företag med färre än 10 anställda och en årsomsättning eller balansomslutning på högst 2 miljoner euro. Omfattas din tjänst ska du ta fram information om hur tjänsten uppfyller tillgänglighetskraven.
Den europeiska standarden EN 301 549 utgår från WCAG 2.1. WCAG 2.2 bygger vidare på 2.1 och lägger till nya kriterier, som 2.4.11 i steg 2. Vad lagen betyder för en webbutik läser du på sidan om tillgänglighetsdirektivet för webbutiker. Den här guiden är en teknisk vägledning, ingen juridisk rådgivning.
Så kan vi hjälpa dig
I vår tillgänglighetsgranskning går vi igenom kundernas viktigaste flöden med tangentbord, skärmläsare, förstoring och högkontrastläge. Du får en prioriterad rapport enligt WCAG. Det som stoppar kunderna rättar vi, och sedan testar vi igen. Vi tar fram de tekniska uppgifterna till din information om hur tjänsten uppfyller tillgänglighetskraven, utifrån vår granskning. Det är ingen juridisk rådgivning: om och hur lagen gäller för dig avgör du med din juridiska rådgivare. Vi arbetar på distans med företag i Sverige.
Du får en kostnadsfri offert inom 24 timmar från din förfrågan, även helger och helgdagar. Sedan gäller fast pris enligt offert. Beloppet i offerten höjs inte så länge du inte ändrar uppdraget.
Vi talar polska, engelska, ukrainska och ryska. På svenska svarar vi skriftligt.
- W3C: Web Content Accessibility Guidelines (WCAG) 2.2, rekommendation 12 december 2024 (på engelska) · hämtad 13 oktober 2026
- Digg: det här är EN 301 549 och WCAG, nivå A, AA och AAA (Webbriktlinjer) · hämtad 13 oktober 2026
- Europeiska kommissionen: EN 301 549 och WCAG 2.1, standarder och harmonisering (på engelska) · hämtad 13 oktober 2026
- WebAIM: Contrast Checker (på engelska) · hämtad 13 oktober 2026
- WebAIM: WAVE Help, WAVE visar alternativtexten men bedömer den inte (på engelska) · hämtad 13 oktober 2026
- WebAIM: WAVE API-dokumentation, saknad alternativtext är ett fel (alt_missing, på engelska) · hämtad 13 oktober 2026
- Lag (2023:254) om vissa produkters och tjänsters tillgänglighet (2, 4, 10 och 25 §§) · hämtad 13 oktober 2026
- Förordning (2023:676) om vissa produkters och tjänsters tillgänglighet (24 och 28 §§) · hämtad 13 oktober 2026
Den här texten har tagits fram med hjälp av artificiell intelligens (AI). MEZA P.S.A. har det redaktionella ansvaret för publiceringen. Texten är aktuell per den 13 oktober 2026.
Frågor vi ofta får
Hittar du inte din fråga? Skriv eller ring, så får du raka besked utan förpliktelser. På svenska svarar vi skriftligt. Ringer du, pratar vi engelska eller polska.
[email protected]+48 889 009 55001Räcker det här testet för att uppfylla lagen?
Nej. Testet hittar tydliga hinder snabbt, men det täcker inte alla framgångskriterier i WCAG, till exempel hur sidan fungerar med skärmläsare, felmeddelanden eller tidsgränser. Om tillgänglighetslagen gäller för dig och vad den kräver beror på ditt företag. Det här är en teknisk vägledning, ingen juridisk rådgivning.
02Vilken färgkontrast behöver jag?
Enligt WCAG 2.2 på nivå AA behöver vanlig text ett kontrastförhållande på minst 4,5:1. Stor text (minst 18 punkter, eller 14 punkter i fetstil) och delar av gränssnittet, som ramar runt inmatningsfält och ikoner, behöver minst 3:1.
03Vilken webbläsare ska jag använda?
Alla aktuella webbläsare fungerar. I Safari på Mac hoppar tabbtangenten som standard över länkar. Slå därför på alternativet som låter Tabb markera varje objekt på en webbsida. Du hittar det under Safari > Inställningar > Avancerat.
04Hur ofta ska jag göra om testet?
Varje gång något ändras: ett nytt tema, nya färger eller typsnitt, en chattwidget eller cookiebanner, ett nytt formulär eller en ny bokningsmodul. Om ingenting ändras räcker det att gå igenom sidorna med några månaders mellanrum.
Relaterade tjänster
Tjänster1
Berätta om ditt projekt. Kostnadsfri offert inom 24 timmar.
Det räcker med några meningar. Inom 24 timmar från din förfrågan, även helger och helgdagar, får du en kostnadsfri offert med omfattning och fast pris.
- E-post
- [email protected]
- Telefon
- +48 889 009 550
- Offert
- inom 24 timmarfrån din förfrågan, även helger och helgdagar
- Språk
- polska, engelska, ukrainska, ryskapå svenska skriftligt
Tack, vi har tagit emot din förfrågan.
Du får din offert inom 24 timmar från din förfrågan, även helger och helgdagar. På svenska svarar vi skriftligt.