ACCESIBILIDAD ≠ OVERLAY · 30

Tillgänglighet ≠ Overlay: 10 kontroller som visar om din webbplats verkligen är tillgänglig

📅 29 oktober 2026   ·   ⏱ 4 min läsning

En flytande ikon bevisar inte tillgänglighet. Det viktiga är om människor kan navigera, förstå innehållet och slutföra sina uppgifter. Här är tio praktiska kontroller.

01. Börja med en uppgift, inte en widget

Välj ett viktigt mål: begära offert, boka tid, köpa något eller hitta kontaktuppgifter. Följ hela flödet i stället för att bara leta efter en tillgänglighetsknapp.

Anteckna steg som är förvirrande eller omöjliga. En snygg webbplats kan ändå hindra användaren från att nå sitt mål.

02. Testa hela flödet med tangentbord

Lägg undan musen och navigera med Tab och Skift+Tab. Aktivera kontroller med Enter eller mellanslag och prova menyer, formulär och bekräftelser.

Ologisk fokusordning, kontroller som inte kan nås och tangentbordsfällor är funktionella hinder. Att ändra kontrasten löser dem inte.

03. Kontrollera fokus och dialogrutor

Tangentbordsfokus måste vara tydligt och får inte döljas av fasta sidhuvuden. När en dialog öppnas ska fokus hanteras korrekt och återgå till rätt plats.

Om fokus stannar bakom en dialog i kassan måste själva komponenten rättas. En extra flytande panel hjälper inte.

04. Lyssna med en skärmläsare

Använd en skärmläsare för att kontrollera rubriker, länkar, knappar och fält. Lyssna efter begripliga namn, läsordning och alternativtexter.

Utseendet ersätter inte korrekt HTML-semantik. Hjälpmedel behöver etiketter och tillstånd som förmedlas tydligt.

05. Granska formulär och felmeddelanden

Skicka ett tomt formulär och skriv felaktiga uppgifter. Förklarar felmeddelandena vad som hände och hur det kan åtgärdas?

Ett ensamt ”Fel” eller en markering enbart med färg räcker inte. Instruktionerna ska vara begripliga och kopplade till rätt fält.

06. Testa zoom och mobila skärmar

Öka webbläsarens zoom till 200 procent och testa små skärmar. Viktiga funktioner måste förbli tillgängliga utan överlappande knappar.

Större text hjälper bara om layouten anpassar sig. En widget kan inte reparera en trasig responsiv design.

07. Granska innehåll och semantisk struktur

Använd logisk rubrikhierarki, beskrivande länkar och tydliga instruktioner. Informativa bilder behöver lämpliga textalternativ.

En bra struktur hjälper både skärmläsaranvändare och dem som snabbt söker information. Tillgänglighet är också redaktionellt arbete.

08. Förstå automatiska testers begränsningar

Automatiska verktyg hittar vissa problem med kontrast, kod och tillgängliga namn. De kan inte ensamma avgöra om hela upplevelsen fungerar.

Kombinera resultaten med manuella tester, tangentbord och hjälpmedel. En poäng är inte ett bevis på WCAG-överensstämmelse.

09. Prioritera hinder och utse ansvariga

Prioritera efter påverkan: ett hinder som stoppar betalning är viktigare än en liten visuell avvikelse. Dokumentera hur problemet återskapas.

Utse ansvariga och rätta delade komponenter i stället för att dölja symtom på enstaka sidor.

10. Testa igen efter varje ändring

WordPress-uppdateringar, Divi-moduler och nya formulär kan skapa nya hinder. Gör kontroller till en del av underhållet.

Använd WCAG 2.2 som teknisk vägledning och dokumentera testerna. Målet är självständig användning.