Manual för tillgänglighet på webben

Använd standardtypsnitt i passande storlek

Varför är det här viktigt?

Typsnitt och storlek på text är viktigt för personer med synnedsättningar, dyslexi och andra lässvårigheter. En tydlig visuell layout förbättrar också läsupplevelsen för personer med koncentrationssvårigheter.

Det händer då och då att ett typsnitt presenteras som extra tillgängligt eller speciellt bra för personer med till exempel dyslexi. Den typen av påstående har svagt stöd i forskningen. Personer som av olika skäl har svårt att läsa kan föredra olika typsnitt, men de allra flesta föredrar ett typsnitt som de känner igen. Därför är rekommendationen att använda ett standardtypsnitt. Det är också praktiskt, eftersom standardtypsnitt presenteras på samma sätt oavsett plattform eller webbläsare och funkar att skriva ut.

Det är bra att hålla sig till samma typsnitt inom organisationen, det gör att läsaren känner igen sig.

Gör så här:

• Parasport Sverige använder Calibri.
• Parasport Sverige använder 12 pt för brödtext i Word
• För Powerpoint är rekommendationen 24 pt, men absolut minimum är 18 pt
• På Parasport Sveriges webbplatser är 16 px förinställt när du väljer brödtext.

Tips:

Undvik att skriva hela meningar i versaler eller kursivt eftersom det är svårt att läsa. Om du vill framhäva något visuellt är det bättre att använda fetstil och citattecken. Understruken text bör endast användas för länkar.

Vänsterjustera text

Varför är det här viktigt?

En rak vänsterkant hjälper läsaren att följa texten med blicken. Det är extra viktigt för personer med synnedsättning, dyslexi eller andra lässvårigheter. Marginaljusterad text skapar ojämna mellanrum mellan ord, vilket stör läsarens rytm och flöde. Centrerad text har en ojämn vänstermarginal vilket gör att ögat hela tiden måste leta efter var nästa rad startar. Det tar längre tid även för personer som betraktar sig som goda läsare.

Gör så här:

• Justera texten till vänster.

Använd ett bra radavstånd

Varför är det här viktigt?

Luften i en text, som mellanrum mellan rader och stycken, gör det enklare att läsa och minskar risken för att läsaren tappar bort sig. För personer som har svårt att läsa är det ofta ännu viktigare att inte mötas av ”en vägg av text”, vilket kan bli intrycket om texten är väldigt kompakt.

Gör så här:

• Använd 1,5 radavstånd i dokument och tillräckligt med utrymme mellan stycken.
• Dela upp textmassor med mellanrubriker och punktlistor.

Använd listor och rubriker för att strukturera information

Varför är det här viktigt?

Struktur hjälper läsaren att navigera i texten och förstå innehållets hierarki. Rubriker och punktlistor gör information överskådlig vilket hjälper läsaren att hitta rätt och snabbt förstå innehållet. Tydlig strukturerad text med rubrik och listor underlättar för alla användare men är speciellt viktigt för personer med synnedsättning eller lässvårigheter. Genom att använda de inbyggda funktionerna för exempelvis listor och rubriker blir strukturen tydlig även för personer som använder olika typer av hjälpmedel.

Gör så här:

• Använd rubriknivåer konsekvent och logiskt (Rubrik 1, Rubrik 2, Rubrik 3 osv).
• Dela in texten i stycken.
• Använd mellanrubriker som tydligt speglar innehållet.
• Använd punktlistor eller numrerade listor.

Så här ser det ut i Word när du väljer rubriknivå och listor. Det finns motsvarande funktion i andra typer av ordbehandlingsprogram och på webbplatserna.

Håll radlängden kort, max 80 tecken per rad

Varför är det här viktigt?

För långa rader gör det svårt att hålla fokus och hitta rätt rad när man flyttar blicken. Långa rader minskar läshastigheten för alla användare men korta rader är speciellt viktigt för personer med synnedsättning, dyslexi och andra lässvårigheter.

Gör så här:

Begränsa radlängden till 80 tecken, inklusive mellanslag.

80 tecken är den gängse rekommendationen från World Wide Web Consortium (W3C). Det finns UX-rekommendationer på 50–75 tecken per rad, vilket kan öka läsbarheten ytterligare, men i många situationer kan det vara svårt att hålla sig till så korta rader.

Säkerställ tillräckliga kontraster mellan text och bakgrund

Varför är det här viktigt?

Dålig kontrast mellan text och bakgrund gör texten svår att läsa, särskilt för personer med nedsatt syn och äldre läsare. Många äldre får svårare att urskilja kontraster, vilket gör det ännu viktigare att ha god kontrast.

Gör så här:

Använd ett kontrastförhållande på minst 4.5:1 för vanlig text och 3:1 för stor text. Testa kontrasten med verktyg som WebAIM Contrast Checker.

Verktyg:

Använd mer än bara färg för att förmedla information

Varför är det här viktigt?

Alla människor upplever inte färg på samma sätt. För personer med färgblindhet eller synnedsättning kan det vara mycket svårt eller omöjligt att skilja vissa färger åt. För många användare kan det vara svårt att uppfatta att en skillnad i färg har en särskild betydelse. Att kombinera användningen av färg med exempelvis text eller en ikon gör det lättare för alla att förstå innebörden.

Gör så här:

Kombinera färg med text eller symboler.

Exempel:

• Se till att länkar inte enbart urskiljer sig med färg utan också är understrukna eller är markerade med till exempel en pil.
• Om du använder färg för att indikera status (grönt för godkänt, rött för ogiltigt), lägg även till text som "Godkänt" eller "Ogiltigt".

Skriv begripliga länkar

Varför är det här viktigt?

Begripliga och beskrivande länkar gör det lättare för alla användare att förstå navigeringen. Det är extra viktigt för försiktiga eller ovana användare samt personer med intellektuella eller neuropsykiatriska funktionsnedsättningar. För personer som använder skärmläsare är det vanligt att navigera genom att ta upp en lista på alla länkar på sidan. Om alla länkar heter ”Läs mer” är det omöjligt att veta vad som är vad.

Gör så här:

Skriv länkar som är begripliga även uttagna ur sitt sammanhang, så att användaren förstår målet utan att behöva läsa omgivande text.

Exempel: Skriv "Parasportens historia" i stället för "Klicka här".

Tips:

Samla gärna länkar i separata listor eller stycken. Länkar i löpande text kan vara svårare att hitta och klicka på, särskilt för användare med lässvårigheter, användare med synnedsättning och användare med motoriska nedsättningar.

Placera text utanför bilder, inte i dem

Varför är det här viktigt?

Text i bilder är svåra att läsa för många användare. Om bakgrunden är rörig eller har dålig kontrast blir det ännu värre. Men även om bildbakgrunden är lugn är texten inte läsbar för skärmläsare, den kan inte kopieras till hjälpmedel som ger stöd med förståelse eller förklaringar och den riskerar att bli pixlig och svårläst för personer som använder förstorande hjälpmedel. Det kan alltså innebära svårigheter för personer med synnedsättningar, läs- och skrivsvårigheter, motoriska funktionsnedsättningar, intellektuella eller neuropsykiatriska funktionsnedsättningar.

Gör så här:

• Placera texten utan för bilden, eller
• Placera texten på en färgad platta ovanpå bilden, eller
• Repetera texten i intilliggande text