2. TEMA: Hur gör man olika typer av information tillgängliga

I den här delen behandlas det hur olika typer av information kan bearbetas, såsom material producerade i formaten text-, bild-, video- och ljud, för att de ska bli mest tillgängliga.

Anvisningarna i denna del har i huvudsak sammanställts från olika tillgänglighetsheuristiker, WCAG 2.1, ICT4IAL och riktlinjer för lättläst språk. Några tillägg har gjorts baserat på erfarenheter från Dateros verksamhet. Riktlinjerna för textbaserat innehåll har hämtats från Mäkipää & Isohellas (2019) undersökning: Tekstimuotoisen verkkosisällön saavutettavuus (Översatt: Tillgänglighet i textbaserat webbinnehåll). Dessa riktlinjer, det vill säga heuristikerna, sammanställer faktorer som gör textinnehåll lättare att överskåda, läsa och förstå.

Tema 2 behandlar följande områden:

• tillgängligt innehåll och tillgängliga texter,
• textformatering (överskådlighet),
• textens tekniska struktur (läsbarhet),
• textens innehåll (begriplighet),
• tillgänglighetsheuristiker för textbaserat webbinnehåll,
• tillgängliga bilder,
• alternativ text för bilder,
• bildernas och texternas färgsättning,
• tillgängliga diagram,
• tillgängliga tabeller, produktion av tillgängliga videor,
• skapande och användning av ljudfiler, pdf-dokument och utskrifter

---

Tillgängligt innehåll och texter

I digitala tjänster har texter och språkliga element stort ansvar för att förmedla betydelser. Trots den ökande mängden audiovisuellt innehåll är en betydande del av webbinnehåll fortfarande textbaserat. De följande heuristiker som presenteras är avsedda att användas manuellt: 1. Som ett verktyg för att utvärdera textbaserat innehåll, 2. När befintligt textinnehåll ska redigeras och 3. Vid produktion av nytt textbaserat innehåll.

Heuristikpunkterna 1.–7. handlar om textformatering, punkterna 8.–10. om textens struktur, och punkterna 11.–15. om textens innehåll.

Textformatering (Överskådlighet)

Att formatera text underlättar för läsaren att överskåda en text. God överskådlighet gör att läsaren lättare kan identifiera olika element och sektioner, vilket även underlättar förståelsen av texten.

Riktlinjer och saker att ta i beaktande:

1. Betona viktiga delar verbalt. Du kan även använda fetstil eller färger, men använd inte fetstil enbart för att markera rubriker.

• Läsaren kan även endast lyssna på texten, och då märks varken fetstil eller färg.

• Detta gynnar personer med begränsat färgseende, personer som använder skärmläsare och personer som har svårt att tolka textfärgers signaler eller budskap.

2. Använd teckenstorlek 18pt i text och 22pt–26pt i rubriker, beroende på rubriknivå.

• Större teckenstorlek förbättrar läsbarheten på skärm

• Detta gynnar särskilt personer med dyslexi.

3. Föredra typsnitt utan ändelser såsom Verdana och Arial.

• Ett typsnitt utan ändelser är enkel och jämn, vilket gör den tydlig och lättläst på skärm. Verdana är mycket använd på webben och allmänt uppskattad. Arial är något snabbare att läsa.

• Detta gynnar särskilt personer med dyslexi.

4. När du listar saker, använd punktlistor eller nummer, försök att undvika flernivålistor.

• Genom att lista och numrera viktiga saker förenklas innehållsöversikten. Flernivålistor kan se röriga ut.

• Detta gynnar särskilt personer med dyslexi.

5. Gör texten luftig. Ange generösa radavstånd och mellanrum mellan stycken.

• Läsbarheten förbättras med ett radavstånd på 1,5 och dubbelt mellan stycken i förhållande till teckenstorleken

• Detta förbättrar läsbarheten generellt.

6. Vänsterjustera texten.

• Endast vänsterjusterad text har tydliga radslut, vilket gör det enklare att flytta från en rad till en annan

• Underlättar för läsaren att flytta från rad till rad i allmänhet

7. Tänk på kontrasten mellan text och bakgrund.

• För bättre läsbarhet kan ljusa nyanser av varma färger användas som bakgrund.

• Detta gynnar särskilt personer med dyslexi.

Textens tekniska struktur (Läsbarhet)

Använd ”stilar” (i Word) för att formatera texten. Separera rubriker och brödtext och ordna rubriker i logisk ordning (Rubrik 1, underrubrik 1.1 osv.). Användning av stilar hjälper åtskilja rubriker och brödtext från varandra och gör dem lättare att hitta, och underlättar innehållsförteckning samt skärmläsares funktion.

8. Använd rubriknivåer (H1, H2 osv.) konsekvent och undvik djupa underrubriknivåer, exempelvis 1.1.1.1 osv.

• Använd inte rubriknivåer bara för att göra texten större. Rubriknivåer ska visa rubrikstruktur. Detta är viktigt för användare av skärmläsare.

• Detta gynnar personer med kognitiva funktionsnedsättningar, begränsad minnesförmåga, synnedsättning, rörelsehinder samt de som navigerar texten med hjälp av ljud.

9. Om du lägger till en bild med information, beskriv budskapet i texten. Då får användare av skärmläsare samma information.

• Om du inte kan beskriva bilden i texten, kan du skriva en alt-text på cirka 100 tecken (i bildens egenskaper). Alt-text visas istället för bilden om bilden av någon anledning inte kan visas.

• Detta gynnar personer som har svårt att ta emot visuell information eller tolka bildens betydelse eller budskap, eller punktskriftsanvändare.

10. Åtskilj länkar med blå färg och understrykning och ge länken ett tydligt och beskrivande namn.

• Namnge länken efter dess funktion (t.ex. ”gå till kalendern”). På så sätt berättar namnet vart länken leder.

• Underlättar för alla att identifiera klickbara länkar.

Textens innehåll (Begriplighet)

När man producerar text är det en bra idé att använda ett så enkelt språk som möjligt, som är lämpligt för presentationen. För att förtydliga texten är det bra att stöda sig på principerna för lättläst språk. När man börjar en text är det en bra idé att ge läsaren en kort introduktion till vad texten kommer att innehålla. På så vis blir det lättare att betrakta större textvolymer och därmed enklare för läsaren att ta emot kommande information.

Det är bra att förklara de förkortningar som används i texten åtminstone första gången de används och att förklara nya termer. Satsstrukturen bör vara kort och koncis. Helst inte mer än 15–20 ord. Det är en bra idé att använda principerna för lättläst språk som ett hjälpmedel i presentationer.

Testa att lyssna på din text och instruktionerna, då märker du om den flyter eller innehåller fel.

11. Använd klart och enkelt språk

• Använd bekanta, vardagliga ord. Undvik facktermer om möjligt.

• Gynnar personer som har svårt att förstå och tolka skriven text.

12. Öppna eller förklara förkortningar första gången.

• Förkortningar och akronymer (t.ex. Kela) ska anges i sin helhet i texten. Undantag är etablerade förkortningar som kanske inte ens känns igen när de skrivs ut i sin helhet (t.ex. DVD).

• Gynnar personer som har svårt att tolka ord och samband (avkodning), personer med begränsad minnesförmåga samt skärmläsaranvändare.

13. Presentera den viktigaste informationen först. Om texten är lång, lägg till en kort sammanfattning i början av sidan.

• När det viktigaste kommer först eller det finns en sammanfattning i början av texten är det lättare att förstå sidans innehåll.

• Underlättar förståelsen av innehållet i allmänhet.

14. Föredra korta meningar och undvik komplexa satsstrukturer.

• Korta meningar hjälper läsaren att förstå innehållet. Uttryck en viktig poäng i en mening.

• Underlättar förståelsen av innehållet i allmänhet.

15. Om texten riktas till läsaren, använd du-form.

• På så sätt känner läsaren att texten är specifikt avsedd för dem.

• Ökar den övergripande begripligheten.

Till näst följer ett kort exempel på hur en text kan formges strukturellt och innehållsmässigt för att bli lättare att förstå och överblicka. I exempelbilden till höger (bild x) visas en ursprunglig text som har formaterats enligt heuristikerna. Vid formateringen har följande aspekter beaktats:

• Rubriker
• Introduktion
• Underrubriker
• Bakgrundsfärg

Utöver detta kan man även fundera på hur själva innehållet kan göras mer lättförståeligt eller hur information som listas kan presenteras på ett tydligare sätt osv.

---

Tillgängliga bilder

Det är också viktigt att text inte sparas som en bild eller att en bild inte används i stället för text. Se följande exempel (Obs! Gör inte så här!):

• Det vanligaste felet: Man tar en skärmbild (screenshot) av text och infogar den i ett presentationsdokument.
• Gör man så kan personer som använder skärmläsare inte lyssna på texten i bilden.
• Det näst vanligaste felet: En bild används i stället för text, till exempel pilar eller andra symboler i stället för text.
• Informationen blir då otillgänglig för personer som använder skärmläsare.

Om du använder hyperlänkar i bilder ska länkarna inte döljas enbart i bilden, utan visa dem tydligt åt läsaren även i textform. På så sätt kan man i princip använda länkarna även när dokumentet skrivs ut på papper.

Man bör också komma ihåg att tillgängliga bilder inte endast är till för personer med synskada eller personer med nedsatt syn. Det finns situationer där hela texten avlyssnas med uppläsningsprogram utan att användaren tittar på innehållet alls.

Alternativ text för bilder

När du skriver alt-text ska du sträva efter att förmedla den centrala informationen och vad bilden avser att visa. Undvik dock beskrivningar såsom ”image of…” eller ”bild av…” någonting. Om du använder bilden enbart som dekoration eller inte vill förmedla någon information med den, kan du markera bilden som dekorativ eller lämna alt-texten tom. Alt-text kan anges för alla element som inte är text, såsom bilder, diagram, ljud och videor.

Bildernas och texternas färgsättning

• Röd (#FF0000) – kontrast 4:1 
• Grön (#00B050) – kontrast 2.86:1
• Blå (#0070C0) – kontrast 5.14:1

Efter kontroll av kontrasten på föregående exempel uppfyller endast den blå färgen WCAG:s krav på tillräcklig kontrast i förhållande till bakgrunden.

Mer information om färger och deras användning på webbsidor hittas på w3schools.com på adressen https://www.w3schools.com/css/css_colors.asp

Färgernas kontrast kan du kontrollera med WebAIM:s Color Contrast Checker https://webaim.org/resources/contrastchecker/.

Om du inte känner till HEX-koden för en färg som du valt eller vill nappa åt dig färgen från en webbsida, kan du använda exempelvis Google Chromes Eye Dropper-tillägg. https://chrome.google.com/webstore/detail/eye-dropper/hmdcmlfkchdmnmnmheododdhjedfccka

Källa: WebAIM

Här finns ännu några grundregler vid färganvändning:

• Undvik att använda rött, grönt, gult och ljusa grå toner.
• Säkerställ tillräcklig kontrast mellan text och bakgrundsbild.
• Kontrollera att bildkontrasten är tillräcklig också för videokanonen. 
• Undvik hyperlänkar eller text som är dolda bakom bilder.
• Tillåt att bilder kan ändra storlek eller skalas.

---

Tillgängliga diagram

När man skapar tillgängliga diagram, till exempel stapel-, cirkel- och linjediagram eller histogram, är det viktigt att komma ihåg två saker. Ordna diagrammets texter och grafer så att diagrammet kan läsas även utan färger. Ge diagrammet en alternativ text eller beskriv tabellens information även i ord.

---

Tillgängliga tabeller

När man skapar tillgängliga tabeller är det viktigt att tänka på layouten. Ett skärmläsarprogram läser tabellen från vänster till höger och uppifrån ner.

Observera att tabeller som innehåller stora mängder information kan i vissa fall vara mycket utmanande att lyssna på, i dessa fall är det viktigt att beskriva tabellens mest centrala information även verbalt.  

Se även hur du lägger till alternativ text till en form, ett diagram eller ett annat objekt:

---

Att skapa tillgängliga videor

Huvudregeln vid skapande av tillgängliga videor är att lägga till textning i videon. På så sätt kan användaren antingen lyssna och titta på videon eller se videon genom att läsa textningen, vilket innebär att videon även kan ses utan ljud. Säkerställ att textningen och beskrivningen är synkroniserade med videon och innehåller exakt samma information som sägs i videon.

I planeringen är det viktigt att främja igenkänning snarare än minnesbelastning. Material, element eller texter bör delas upp och presenteras i mindre delar så att användarens minne inte belastas för mycket. En bra tumregel är att människans arbetsminne kan lagra 5–9 saker åt gången.

Försök fånga användarens första uppmärksamhet:

Användarens förmedvetna bearbetning (preattentive processing) involverar att uppfatta färger, former, lutningar, kurvaturer, kontrast med mera. Först därefter riktas uppmärksamheten mot att förstå bilden eller annat innehåll.

Säkerställ att ljudet i videon är så tydligt som möjligt. Om det är möjligt bör talspåret erbjudas separat från andra ljud. Om ljudspåren inte kan separeras, säkerställ att andra ljud inte stör talet. Då det förekommer tal i videon ska övriga bakgrundsljud hållas låga.

Säkerställ att den text som visas och dess bakgrundsfärg har tillräcklig kontrast. Tillräcklig kontrast kan exempelvis kontrolleras med WebAIM:s ”Contrast Checker” på adressen https://webaim.org/resources/contrastchecker/

Föredra program som är oberoende av en specifik plattform och använd hellre en webbaserad videotjänst, såsom Youtube. De vanligaste videotjänsterna lämpar sig för och fungerar på de flesta enheter.

Använd vanliga filformat för videon, såsom mp4. På så sätt säkerställs att videon kan spelas upp i de flesta program och även enkelt laddas ner till den egna datorn.

Ge videofilen en alternativ text. Alternativ text innebär en förklaring på 1–2 meningar om vad videon handlar om. Syftet är inte att beskriva hela innehållet. På så sätt kan personer som använder skärmläsare lättare uppfatta videon och få en uppfattning om dess innehåll.

Repetition: När du skapar en tillgänglig video, beakta åtminstone följande:

• Igenkänning
• Mängden presenterad information
• Ljudets tydlighet
• Färgkontrast
• Textning
• Språklig tydlighet
• Logisk uppsättning av ämnen
• Videoformat som fungerar på alla enheter

---

Tillgängliga ljudfiler

Celia är ett statligt specialbibliotek som lånar ut ljudböcker. Du kan lyssna på dem på din dator, surfplatta eller smarttelefon. Celia lånar ut skön- och facklitteratur i tillgängligt format åt alla som har svårt att läsa vanliga tryckta böcker. Sedan början av 2018 får användare av Celias material även läroböcker gratis på alla utbildningsnivåer (från grundskola till universitet).

Mer information om Celias ljudböcker: www.celianet.fi

---

Tillgängliga PDF-filer och utskrifter

För smidig uppläsning behöver man bland annat:

1. Kontrollera läsordningen (det vill säga ange i vilken ordning skärmläsaren läser dokumentet)
2. Säkerställa korrekta rubriker
3. Kontrollera att taggarna är korrekta (bilder är markerade som bilder osv.)
4. Lägga till alt-texter
5. Ange dokumentnamn och övriga metadata

Allmänna anvisningar för att skapa PDF-filer

Ange dokumentets språk. Använd tillgänglighetskontrollen som finns i programmet du använder (Word, Adobe Acrobat Reader osv.). Använd den senaste versionen av programmet när du skapar PDF-filen, eftersom den senaste versionen av programmet innehåller de mest uppdaterade tillgänglighetsfunktionerna. Försäkra dig ändå att dokumentet även kan läsas med äldre versioner. Fyll i dokumentets metadata så att användare lättare kan hitta det på internet. Ge dokumentet åtminstone ett namn och en titel. Kontrollera strukturens läsordning. Undvik horisontell rullning (hellre vertikal) och lägg till alternativa beskrivningar för olika element.

PDF är praktiskt när filer delas allmänt, men i slutna miljöer, såsom Microsoft 365 där dokumentlänken delas endast med en viss grupp, kan filen även delas som en Word-fil. Då har läsaren möjlighet att anpassa dokumentet efter egna behov eller använda läsvyn i Word Online.

Kontroll och korrigering av PDF-dokumentets tillgänglighet

Ett ofta använt verktyg är Adobe Acrobat Pro/DC, som är Adobes betalversion. Även om verktyget är avgiftsbelagt är det inte alltid lätt att använda eller helt problemfritt. Ett annat verktyg är det kostnadsfria webbläsarbaserade kontroll- och redigeringsprogrammet PAVE (PDF Accessibility Validation Engine), utvecklat av ICT-Accessibility Lab vid Zurich University of Applied Science.

Du kan alltså kontrollera och även korrigera ett PDF-dokument så att det blir tekniskt tillgängligt och lättare att läsa med skärmläsare med hjälp av PAVE-verktyget, som finns på adressen:

http://pave-pdf.org/index.en.html

Utskrifter

Några saker att beakta när filer skrivs ut på papper:

• Använd inte glansigt papper
• Erbjud alternativt dokumentet även i elektroniskt format
• Ge användaren möjlighet att förstora dokumentets teckenstorlek före utskrift
• Skriv ut hyperlänkarnas fullständiga adresser i texten, till exempel som en lista i slutet av dokumentet, du kan även använda QR-kod. https://www.skapaqrkod.se/

---

Källor

Benyon, D. 2018. Designing Interactive Systems: A Comprehensive Guide to HCI and Interaction Design, 2nd Edition | Pearson. Retrieved August 23, 2021 from https://www.pearson.com/uk/educators/higher-education-educators/program/Benyon-Designing-Interactive-Systems-A-Comprehensive-Guide-to-HCI-and-Interaction-Design-2nd-Edition/PGM843485.html

European Telecommunications Standards institute. 2015. Accessibility requirements suitable for public procurement of ICT products and services in Europe (EN 301 549 v.1.1.2). Retrieved August 15, 2020 from https://www.etsi.org/deliver/etsi_en/301500_301599/301549/01.01.02_60/en_301549v010102p.pdf

The Properties of Human Memory and Their Importance for Information Visualization. The Interaction Design Foundation. Retrieved August 23, 2021 from https://www.interaction-design.org/literature/article/the-properties-of-human-memory-and-their-importance-for-information-visualization

Suvi Isohella ja Anita Nuopponen. 2016. Terminologia kohtaa käytettävyyden. Terminologisen käytettävyyden ydintä rakentamassa. VAKKI-symposiumi XXXVI (2016), 12.

Murat Kalender, M. Tolga Eren, Zonghuan Wu, Ozgun Cirakman, Sezer Kutluk, Gunay Gultekin, and Emin Erkan Korkmaz. 2018. Videolization: knowledge graph based automated video generation from web content. Multimed Tools Appl 77, 1 (January 2018), 567–595. DOI:https://doi.org/10.1007/s11042-016-4275-4

Juho-Pekka Mäkipää ja Suvi Isohella. 2019. Tekstimuotoisen verkkosisällön saavutettavuus. VAKKI-symposium esitelmä (January 2019)

Aravind Jembu Rajkumar, Jonathan Lazar, J. Bern Jordan, Alireza Darvishy, and Hans-Peter Hutter. 2020. PDF Accessibility of Research Papers: What Tools are Needed for Assessment and Remediation? DOI:https://doi.org/10.24251/HICSS.2020.512

Kinnunen P. Ammatillisissa oppilaitoksissa vastuu kuuluu kaikille opettajille. Kirjassa: Strandén K, toim. Ei tyhmä vaan erilainen oppija. Jyväskylä: Gummerus 1998, s. 85-8.