BoostlyVad vi görVad vi har gjortVilka vi är
Jobba hos ossKunskapsbank
Logga in till Sidekick Portal
Vad är...7

Vad är WCAG? En enkel guide till webbtillgänglighet

Vad är WCAG? Lär dig de fyra principerna (POUR), nivåerna A, AA och AAA och vad WCAG 2.2 AA innebär för din webbplats. Börja här.

WCAG står för Web Content Accessibility Guidelines och är den internationella standarden för webbtillgänglighet. Den beskriver hur webbplatser, appar och digitalt innehåll ska utformas så att så många människor som möjligt kan använda dem, oavsett om de har en synnedsättning, en hörselnedsättning, en motorisk begränsning eller en kognitiv funktionsnedsättning. Den som söker efter WCAG på svenska hittar ofta översättningen "Riktlinjer för tillgängligt webbinnehåll".

Standarden tas fram av W3C, samma organisation som ligger bakom HTML och CSS. Den aktuella W3C-rekommendationen är WCAG 2.2 (publicerad i oktober 2023) och den finns även som ISO/IEC 40500. WCAG 3.0 är under utveckling som arbetsutkast (Working Draft), är ännu inte färdig och är inte ett lagkrav. W3C har heller inte för avsikt att låta den ersätta WCAG 2. Det är oftast nivån WCAG 2.2 AA som avses när man talar om tillgänglighetskrav för webb.

Info: WCAG är inte en lag i sig. Men lagar och regelverk i Sverige och EU hänvisar till den, vilket gör den till den standard som i praktiken gäller för digital tillgänglighet.

Hur fungerar WCAG? De fyra principerna och tre nivåerna

WCAG bygger på fyra grundprinciper som ofta förkortas POUR. Varje princip delas upp i riktlinjer, och varje riktlinje i konkreta, testbara kriterier. Kriterierna är graderade i tre nivåer: A, AA och AAA.

Så är WCAG uppbyggt

4 principer (POUR)
Riktlinjer
Testbara kriterier
Nivå A, AA eller AAA

De fyra principerna

    1. Möjlig att uppfatta: Informationen måste kunna tas emot med flera sinnen. Bilder behöver textalternativ, videor behöver undertexter och text behöver tillräcklig kontrast mot bakgrunden.
    2. Hanterbar: Allt ska gå att använda, även utan mus. Det betyder att hela sidan ska kunna styras med tangentbord, att fokus syns tydligt och att användaren får tillräckligt med tid.
    3. Begriplig: Innehåll och gränssnitt ska vara förutsägbara och tydliga. Felmeddelanden ska förklara vad som gick fel och hur man rättar det.
    4. Robust: Koden ska fungera med olika webbläsare och hjälpmedel, till exempel skärmläsare. Här spelar korrekt semantisk HTML en stor roll.

Nivåerna A, AA och AAA

NivåVad den innebärTypiskt användningsområde
AGrundläggande tillgänglighet, absoluta minimikravUtgångsläge som alla bör klara
AARimlig och praktiskt genomförbar tillgänglighetDen nivå som lag och upphandling oftast utgår från
AAAHögsta nivån, svår att uppnå för allt innehållEnskilda sidor eller specifika målgrupper

Det är alltså nivå AA som blir målet för de flesta verksamheter, och WCAG 2.2 AA är en bra och framtidssäker målnivå. AAA är sällan realistiskt för en hel webbplats.

Vad är nytt i WCAG 2.2?

WCAG 2.2 lägger till nio nya kriterier och tar bort ett: 4.1.1 Parsing, som ansågs obsolet. Sex av de nio nya kriterierna ligger på nivå A eller AA. Fokus ligger på mobilanvändning, personer med kognitiva svårigheter och användare med motoriska begränsningar. Några exempel:

    1. 2.4.11 Focus Not Obscured (Minimum): Det element som har fokus får inte döljas helt av annat innehåll, till exempel en fast sidhuvudlist.
    2. 2.5.7 Dragging Movements: Dra-och-släpp-funktioner ska ha ett enklare alternativ.
    3. 2.5.8 Target Size (Minimum): Klickytor ska vara minst 24×24 CSS-pixlar.
    4. 3.2.6 Consistent Help: Hjälp och kontaktvägar ska placeras konsekvent.
    5. 3.3.7 Redundant Entry: Användaren ska inte behöva skriva in samma uppgifter flera gånger.
    6. 3.3.8 Accessible Authentication (Minimum): Inloggning ska inte kräva att användaren memorerar eller skriver av komplicerade koder.

WCAG 2.2 är bakåtkompatibelt med 2.1 och 2.0.

Varför är WCAG viktigt?

Det finns tre skäl som brukar väga tungt: människor, lagkrav och affär.

Människor. Enligt WHO har cirka var sjätte person i världen en betydande funktionsnedsättning, och i Sverige uppger omkring var femte person en nedsättning som påverkar vardagen (källa: Myndigheten för delaktighet). Dessutom kan vem som helst hamna i en situation där tillgänglig design gör skillnaden, till exempel med en bruten arm, i starkt solljus på mobilskärmen eller i en bullrig tågvagn där ljudet inte hörs.

Lagkrav. EU:s tillgänglighetsdirektiv (European Accessibility Act) ställer krav på många privata aktörer, bland annat inom e-handel, bank, transport och elektroniska kommunikationstjänster. I Sverige genomförs direktivet genom lag (2023:254) om vissa produkters och tjänsters tillgänglighet, som började gälla den 28 juni 2025. Kraven bygger på den harmoniserade standarden EN 301 549, som i version 3.2.1 hänvisar till WCAG 2.1 nivå AA. Eftersom WCAG 2.2 är bakåtkompatibelt är WCAG 2.2 AA ett framtidssäkert mål. Offentlig sektor omfattas sedan en tid av lagen (2018:1937) om tillgänglighet till digital offentlig service (DOS-lagen), som bygger på webbtillgänglighetsdirektivet. Tillsynen sköts av Myndigheten för digital förvaltning (DIGG), och organisationer ska publicera en tillgänglighetsredogörelse.

OBS: Om ditt företag säljer varor eller tjänster till konsumenter online bör du ta reda på om du omfattas av reglerna. Brister kan leda till föreläggande och sanktionsavgifter från tillsynsmyndigheten. Kontrollera alltid vilken version av standarden som gäller för just din verksamhet.

Affär och sökbarhet. Tillgängliga webbplatser konverterar ofta bättre, eftersom fler kan genomföra ett köp eller fylla i ett formulär. Många tillgänglighetsåtgärder gynnar dessutom SEO: tydlig rubrikstruktur, beskrivande länktexter, alternativtexter på bilder och snabb, ren kod gör det enklare både för användare och för sökmotorer att förstå innehållet.

Tips: Om du är SEO-ansvarig, se tillgänglighet som en genväg till bättre teknisk kvalitet. Mycket av arbetet överlappar med det du redan gör.

Praktiska exempel

WCAG blir lättare att förstå när man ser vad kriterierna betyder i vardagen.

Exempel 1: Kontrast. En ljusgrå text på vit bakgrund ser snygg ut i en designskiss, men är svår att läsa för många. WCAG AA kräver ett kontrastförhållande på minst 4,5:1 för vanlig text. Det går att kontrollera snabbt med gratis verktyg.

Exempel 2: Formulär. Ett kontaktformulär utan synliga etiketter, där fältets förklaring försvinner när man börjar skriva, är ett klassiskt problem. Lösningen är permanenta etiketter, tydliga felmeddelanden och en logisk tabbordning. I kod kan det se ut så här, med en permanent etikett och stöd för autofyll (WCAG 1.3.5 och 3.3.2):

html
<label for="epost">E-post</label>
<input id="epost" type="email" autocomplete="email">

Exempel 3: Bilder. En produktbild utan alternativtext är osynlig för en skärmläsaranvändare. En kort, beskrivande text som "Svart löparsko med vit sula, sedd från sidan" gör skillnad. Rent dekorativa bilder markeras i stället med ett tomt alt-attribut, så att skärmläsaren hoppar över dem:

html
<img src="dekor.svg" alt="">

Exempel 4: Tangentbordsnavigering. Testa att ta dig igenom din startsida enbart med Tab-tangenten. Om menyn inte går att nå, om fokusmarkeringen saknas eller om du fastnar i en popup har du hittat typiska tillgänglighetsbrister.

Vad innebär WCAG för din roll?

Tillgänglighet är ett lagarbete, och alla roller har sin del:

    1. Beslutsfattare: Du sätter ramarna. Se till att kravet ställs redan i upphandlingen, att det finns budget och att leverantörerna får en tydlig kravspecifikation.
    2. Designers: Kontraster, klickytor, typografi och tydliga komponenter ska finnas med från första skissen.
    3. Utvecklare: Semantisk HTML, tangentbordsstöd och korrekt användning av ARIA där det behövs. Ett vanligt misstag är att lägga på ARIA för att laga HTML som från början var fel uppbyggd.
    4. SEO-ansvariga och redaktörer: Rubrikstruktur, alternativtexter, länktexter och begripligt språk.

Vanliga frågor om WCAG

Vad är skillnaden mellan WCAG och webbtillgänglighet?

Webbtillgänglighet är målet: att alla ska kunna använda webben. WCAG är den standard som beskriver hur man uppnår det i praktiken, med konkreta och testbara kriterier.

Vilken WCAG-version gäller?

Den aktuella W3C-rekommendationen är WCAG 2.2. Den bygger på tidigare versioner, så om du redan följer WCAG 2.1 är du långt på väg. WCAG 3.0 är fortfarande ett arbetsutkast och inget att följa idag. Regelverk hänvisar ofta till en specifik version, och EN 301 549 hänvisar i dagsläget till WCAG 2.1 AA, så kontrollera alltid vad som gäller för just din verksamhet.

Måste privata företag följa WCAG?

Det beror på vilken typ av verksamhet du driver. Företag som erbjuder vissa konsumenttjänster online, till exempel e-handel, banktjänster och elektroniska kommunikationstjänster, omfattas via lag (2023:254). Kraven bygger på EN 301 549, som i nuvarande version hänvisar till WCAG 2.1 AA, men WCAG 2.2 AA är en bra målnivå. Mikroföretag (färre än 10 anställda och högst 2 miljoner euro i omsättning) är undantagna från kraven på tjänster.

Räcker det med ett tillgänglighetsverktyg eller en overlay?

Nej. Automatiska verktyg hittar bara en del av problemen, enligt flera studier ungefär 30–50 procent. Overlays som utlovar snabb lösning löser sällan de underliggande bristerna. Riktig tillgänglighet kräver korrekt design, kod och innehåll, samt manuell testning med tangentbord och skärmläsare, till exempel NVDA, JAWS eller VoiceOver.

Hur testar man om en webbplats följer WCAG 2.2 AA?

Kombinera automatiska verktyg som axe eller Lighthouse (som bland annat använder axe-core) med manuell granskning: tangentbordstest, skärmläsartest och kontroll av kontrast och zoom. Ibland är det bra att anlita en expert eller låta personer med funktionsnedsättningar testa.

Hur påverkar WCAG SEO?

Positivt. Tydlig rubrikstruktur, alternativtexter, beskrivande länkar, transkriptioner och ren semantisk kod hjälper både användare och sökmotorer att förstå sidan.

Så kommer du igång med WCAG 2.2 AA steg för steg

Du behöver inte åtgärda allt på en gång. En pragmatisk start ser ofta ut så här:

  1. Kartlägg nuläget. Gör en tillgänglighetsgranskning av de mest använda delarna av webbplatsen: startsida, formulär, köpflöde och kontaktsidor.
  2. Prioritera. Börja med brister som blockerar användare helt, till exempel formulär som inte går att fylla i med tangentbord.
  3. Bygg in det i processen. Lägg in tillgänglighetskrav i designsystemet, i teamets kriterier för när något är färdigt och i upphandlingar, så att nya brister inte uppstår. Samma tänk gäller när du bygger en digital arbetsplats i Microsoft 365 eller ett SharePoint-intranät.
  4. Utbilda teamet. Designers, utvecklare och redaktörer behöver samma grundförståelse. Det sparar mycket tid i längden.
  5. Följ upp regelbundet. Tillgänglighet är inte ett engångsprojekt. Testa vid varje större förändring.

Sammanfattning: WCAG är den internationella standarden för digital tillgänglighet. Den bygger på fyra principer (POUR), har tre nivåer och är i praktiken det som lagar och upphandlingar refererar till. För de flesta verksamheter är WCAG 2.2 AA ett bra mål. Börja med nuläget, prioritera de största hindren och bygg in tillgänglighet i arbetssättet. Då uppfyller du kraven och ger samtidigt alla dina användare en bättre upplevelse.

I våra uppdrag inom digital verksamhetsutveckling ser vi ofta att tillgänglighet glöms bort i intranät, SharePoint-lösningar och interna system, trots att samma krav på användbarhet gäller där. Vill du ha hjälp att kartlägga nuläget och bygga in tillgänglighet i era arbetssätt? Kontakta oss så berättar vi mer.

Skapad med AI

Om artikeln

Denna artikel är framtagen delvis med hjälp av AI (Anthropic Claude) och kan därför innehålla felaktigheter eller generaliseringar. Innehållet är granskat av en människa innan publicering, men vi rekommenderar att du verifierar viktig information innan du fattar beslut baserat på den.