Tillgänglighetsanpassad design och innehåll.
Tillgänglig design handlar om att skapa lösningar som fungerar för så många som möjligt. Det betyder god läsbarhet, tydlig struktur och hög användbarhet även i varierande situationer som låg belysning, stress eller små skärmar.
För information och stödtjänster som omfattas av LPTT ska dessa vara tillgängliga enligt standarden EN 301 549, som inkluderar bland annat WCAG nivå A + AA.
Det handlar om att bygga gränssnitt som är förutsägbara, konsekventa och enkla att ta till sig, oavsett om användaren navigerar med mus, tangentbord eller skärmläsare. När designen stödjer olika behov - visuella, motoriska, kognitiva eller tekniska, blir upplevelsen både mer inkluderande och mer effektiv.
Grundprinciper som hjälper alla användare.
Vägledning med exempel för en mer tillgänglig och användbar e‑handelstjänst.
Struktur och navigering
Använd en logisk rubrikhierarki (<h1> till <h6>), endast en <h1> per sida.
Skapa konsekventa menyer och layouter.
Se till att alla interaktiva element är tydliga och nåbara med mus, tangentbord och skärmläsare.
Komplettera gärna med text och ikoner.
Gör felmeddelanden tydliga.
Använd informativa länktexter som beskriver var de leder (använd ej enbart "Klicka här", "Läs mer").
Länkar ska alltid leda någonstans (URL, ange om en länk öppnas i ett nytt fönster.
Innehåll
Meningsbärande bilder ska beskrivas med alt-texter.
Undvik text i bilder.
Skriv klarspråk - kort, tydligt och konkret.
Dela upp text i korta stycken med tydliga mellanrubriker.
Texta och syntolka video.
Ange filformat och filstorlek för dokument.
Undvik dokument som kan vara svåra att anpassa (enklare att presentera som html)
Undvik blinkande eller auto‑rörligt innehåll.
Färg, kontrast och typografi
Använd tillräckliga kontraster mellan text och bakgrund, som fungerar i varierande miljöer.
Offra aldrig kontrast för varumärkesfärg, om din primära färg har låg kontrast, använd en tillgänglig variant.
Undvik att enbart förmedla information med färg.
Välj tydliga och läsbara typsnitt.
Använd tillräcklig textstorlek, lagom radlängd (ca 60–80 tecken per rad) och ett tydligt radavstånd (ca 1.4–1.6 gånger).
Undvik långa versalrubriker.
Vanliga frågor och svar.
Vad är en bra alt-text?
Fokusera på bildens syfte eller funktion. Beskriv objektivt med ca 5-15 ord, vad användaren behöver veta för att förstå innehållet. Om bilden innehåller tex ska den alltid ingå i alt-texten.
Vad menas med förutsägbar design?
Att komponenter beter sig likadant överallt. Knappen ska se ut som en knapp, länken som en länk och modaler ska alltid stängas på samma sätt. Användaren ska aldrig behöva gissa.
Vad är en bra länktext?
En länktext som beskriver var du hamnar när du klickar på den. Tänk på att en skärmläsare kan lista alla länkar på en sida och då behövs kontext.
Vad är ett tillräckligt kontrastvärde enligt WCAG 2.1?
Varje färg har ett luminansvärde, hur ljus den uppfattas. Kontrastvärdet är skillnaden mellan två färgers luminans, i form av ett förhållande. För brödtext och mindre text ska kontrastvärdet minst vara 4,5:1. För UI-element, ikoner och stor text då räcker en kontrast på 3:1 (Stor text = minst 18px / 24pt eller 14pt / 19px fetstil).
Fördjupningsområden och paketerbjudanden.
Paketerbjudanden för tillgänglig e-handel.
Tillgänglighetsanpassad funktionalitet.
Mer om tillgänglighetslagen och riktlinjer.