Webbtillgänglighet. En lathund för redaktörer

Webbtillgänglighet

En lathund för redaktörer

Innehåll

Vad innebär tillgänglighet för oss som arbetar med webbplatser? ... 3

Varför tillgänglighet? ... 3

Vad är webbdirektivet? ... 4

Vad händer om vi inte följer direktivet? ... 4

Hur gör vi webbplatserna tillgängliga? ... 5

1. Beskriv allt innehåll som inte är text med text ... 5

2. Texta inspelad rörlig media ... 6

3. Presentera innehållet i en meningsfull ordning ... 7

4. Använd rubriker på rätt sätt ... 7

Beskrivande rubriker ... 7

Ordna rubrikerna i logisk och hierarkisk ordning ... 8

5. Länkar ... 9

Länknamnet ... 9

Skriv det viktigaste i länken först. ... 10

Länkar som leder till samma eller olika sidor ... 10

Använd gärna den länkade sidans titel ... 10

6. Klarspråk ... 11

Tänk på mottagaren ... 11

Enkelt ... 11

Begripligt ... 11

Konkret ... 12

Personligt tilltal ... 12

Tänk utifrån och in ... 12

Luftigt och lätt att överskåda ... 12

Konsekvent ... 13

Informativa rubriker ... 13

Länkar ... 13

7. Tillgängliga dokument ... 13

Vad innebär tillgänglighet för oss som arbetar med

webbplatser?

Att göra information tillgänglig innebär att alla kan ta del av den på ett enkelt sätt. En synskadad person eller en person med kognitiv

funktionsnedsättning kan exempelvis använda ett program som låter datorn läsa upp texten. Detta gör att personen kan ta till sig information på samma villkor som alla andra. För att programmet ska kunna utföra sitt uppdrag krävs att våra webbplatsen samarbetar med verktyget. Och därför måste vi skapa förutsättningar för detta.

Varför tillgänglighet?

Socialstyrelsen definierar funktionshinder som en ”begränsning som en funktionsnedsättning innebär för en person i relation till omgivningen”.

Funktionshindret ligger alltså inte hos personen, utan i omgivningen.

Funktionshinder kan vara permanenta eller tillfälliga. Exempel på tillfälliga funktionshinder kan vara en bruten arm, småbarnsföräldrar som bär barn på ena armen under dagarna eller helt enkelt att du behöver stänga av ljudet på en video för att inte störa omgivningen.

Vi alla stöter alltså på funktionshinder i olika delar av våra liv och genom att göra våra hemsidor tillgängliga så motverkar vi att de utgör ett.

Vad är webbdirektivet?

Alla EU-länder har fått lagar som ska öka den digitala tillgängligheten för alla användare.

För att förenkla det ytterligare så är det dessa tre delar som avgör ifall webbplatsen är tillgänglig:

 Innehåll – är innehållet begripligt?

 Teknik – Är det tekniskt tillgängligt?

 Pedagogik – Går det att förstå hur man ska använda funktioner?

Vad händer om vi inte följer direktivet?

För det första så skapar vi funktionshinder. Ifall vi inte gör våra webbplatser tillgänglighetsanpassade så utesluter vi grupper av människor från att ta del av informationen vi publicerar.

Och för det andra, om tillsynsmyndigheten upptäcker brister vid en kontroll får den ansvarige en varning och möjlighet att åtgärda problemet.

Åtgärdas inte problemet får du ytterligare en varning, och denna är offentlig.

Den ska diarieföras och blir synlig för allmänheten.

Vid den tredje varningen tillkommer ett bötesbelopp. Viteslagen avgör hur stort belopp, det ska vara kännbart för den som inte följt direktivet. Är det till exempel en stor kommun så blir det ett stort belopp.

Webbdirektivet

 Våra webbplatser ska ha tillgängliga gränssnitt.

 Vi ska erbjuda alternativa format

 Vi ska ha en självdeklaration för tillgängligheten på varje webbplats.

 Vi ska ha en länk till klagomålshantering.

Användarna ska alltid kunna höra av sig med synpunkter till oss.

 Vi ska ge återkoppling på alla synpunkter som

kommer in.

Hur gör vi webbplatserna tillgängliga?

Det krävs stora insatser för att göra webbplatserna helt tillgängliga, men det är de sju områden nedan som är viktigast dig som redaktör.

1. Beskriv allt innehåll som inte är text med text

För allt innehåll som inte är text behövs det beskrivningar i text för att till exempel skärmläsare ska kunna läsa av det.

I redaktörsarbetet berörs du främst av detta då du publicerar bilder och diagram.

När du publicerar en bild så ska du alltid ange en alternativtext till bilden.

Denna kommer inte synas på sidan utan ligga i bakgrunden så att skärmläsaren kan läsa upp bilden.

Såhär gör du:

1. Välj bild i bildarkivet.

2. Klicka på fliken texter högst upp

3. Ange bildbeskrivning under Alternativtext. Välj Ange egen.

4. Om du vill ha en bildbeskrivning som syns på sidan, skriv in den under Bildtext.

Att tänka på vid beskrivning av innehåll som inte är text

 Beskriv sakligt

 Ibland är det känslan i bilden som behöver förmedlas

 Utgå från användarens behov och innehållets syfte

 Undvik text i bilden

2. Texta inspelad rörlig media

Inspelad digital video ska ha undertexter (textbeskrivningar/textremsa) och ljudinspelningar ska en textversion.

Förutom att göra video eller ljudinspelningar tillgängliga för till exempel personer med hörselskada:

 Erbjud stängda undertexter för digital video

 Informera användaren om att det finns text

 Beskriv alla ljud av betydelse

 Erbjud gärna en separat textversion

När det gäller hjälp med textning av rörlig media, ta kontakt med din kommunikatör.

3. Presentera innehållet i en meningsfull ordning

När du utformar ditt innehåll är det viktigt att du tänker på vilken ordning det presenteras i så att betydelsen bevaras. Alla webbplatser ska ha responsiv design, det vill säga att presentationen anpassas efter hur stor skärmstorlek den visas i. Därför kan ditt innehåll kastas om när det ska visas i responsivt läge.

Försök även tänka på i vilken ordning du placerar innehållet. Hur kommer en skärmläsare läsa upp sidan? Ska diagrammet placeras före eller efter den beskrivande texten av den? Om du placerar en dekorativ bild på sidan, kommer uppläsningen av den kännas logisk i förhållande till texten?

4. Använd rubriker på rätt sätt

Att göra tillgängliga rubriker hänger till viss del ihop med kapitel tre.

Rubriker är nämligen som sidans innehållsförteckning och därför är det viktigt att de är beskrivande och följer en logisk och hierarkisk ordning.

Beskrivande rubriker

Det är vanligt att läsaren skannar av sidan med hjälp av rubrikerna. Om du till exempel söker information om delledighet under föräldraledigheten så vill du inte läsa allt om föräldraledighet, utan skannar av sidan efter den rubrik med den information du söker.

Tips!

Kontrollera hur din sida kommer visas i olika skärmstorlekar.

1. Klicka på ögat i verktygsfältet.

2. Välj Resposivt läge

3. Välj vilken skärmstorlek du vill se innehållet i

Därför är det viktigt att rubriken beskriver just det texten handlar om.

Detta är även viktigt för att sökfunktionen på webbplatsen ska hitta rätt sidor när användaren söker efter information.

Samma sak gäller även sidtitlar. Sidans titel ska beskriva övergripande vilken information du hittar

på sidan.

Rubriker och sidtitlar ska i den mån det är möjligt vara unika.

Ett vanligt exempel på sidor som i stor utsträckning får samma namn är kontakt-sidor.

Så när du namnger sidor eller rubriker, försök hitta balansen mellan att vara specifik/tydlig och enkel.

Ordna rubrikerna i logisk och hierarkisk ordning

Eftersom rubrikerna blir som sidans innehållsförteckning är det viktigt att de är tydliga och följer en logisk ordning. När en skärmläsare läser upp

rubrikerna på en sida så ska användaren få en tydlig blick över innehållet och sidans struktur.

Rubrikerna på våra webbplatser ska tilldelas olika teckensnitt med hierarkier för att de ska läsas upp eller för att tangentbordet ska navigera mellan dem i rätt ordning.

Rubriken överst på sidan och som

oftast är sidtiteln ska vara en Rubrik 1. Den ska alltid

efterföljas av en rubrik 2. Om rubrik 2 har en underrubrik så ska den vara rubrik 3.

underrubrik till sidrubriken så går du tillbaka till rubrik 2.

 Som i exemplet till höger.

Mobiltelefoni och TjänsteID- kort är underrubriker till Produkter och tjänster.

 Mobil anknytning är en underrubrik till

Mobiltelefoni.

 Beställning är en underrubrik till TjänsteID-kort.

Följer du denna struktur när du skapar innehåll så blir sidan lättnavigerad, både för personer som navigerar sig fram med tangentbord och för personer som använder skärmläsare.

Du ska alltså till exempel aldrig sätta en rubrik 3 efter en rubrik 1. Då kommer skärmläsaren inte kunna hitta rubriken på nivå 3, utan gå direkt till nästa rubrik med nivå 2.

5. Länkar

Det finns ett antal regler att förhålla sig till när du skapar länkar.

Länknamnet

Länken ska kunna stå för sig själv men ändå vara tydlig med vart den leder.

När en skärmläsare skannar av en sida så plockar den ut alla länkar och lägger dem i en lista. Om länken heter ”klicka här”, ”läs mer om…” eller

”gå till…” så säger den ingenting om var vart den leder. Vi ser hellre längre, beskrivande länkar än korta länkar som inte säger något om var de leder.

Skriv det viktigaste i länken först.

Klarspråk gäller även för länkar. Vi tenderar nämligen att skanna av sidor och texter snabbt. Så genom att placera det som är av störst värde i texten först ökar vi chanserna att läsaren uppfattar det.

Ovan har vi ett bra exempel. ”Här kan du läsa riktlinjen för kommunikation i Norrköpings kommun”. Det är en bra länk som beskriver vad för

information den leder till.

För att göra den ytterligare effektiv så skulle den kunna döpas till

”Riktlinjen för kommunikation i Norrköpings kommun, läs den här”. Då placeras den text som är av störst värde först. Men egentligen skulle vi kunna ta bort de 3 sista orden helt så att länken heter ”Riktlinjen för kommunikation i Norrköpings kommun”. Läsaren vet vad som kommer hända när hen klickar på länken, vi behöver inte skriva ut det.

Länkar som leder till samma eller olika sidor

- Länkar som leder till samma sida ska alltid ha samma namn - Länkar som leder till olika sidor ska alltid ha olika namn.

Detta är ett vanligt problem som nästan alltid ger utslag på

tillgänglighetskontroller. Att länkar som leder till olika mål har samma namn. ”Skicka e-post”-länken är ett sådant exempel. Länkarna heter likadant men leder till olika e-postadresser.

Använd gärna den länkade sidans titel

Här återkommer vi till att ha bra och informativa titlar. För att användaren ska känna sig säker på att hen kommit rätt så är det bra om länken och sidans titel har samma namn.

6. Klarspråk

Du kan arbeta hårt med att göra din sida tillgänglig enligt alla tekniska regler, men det gör ingen skillnad ifall inte sidan är läsbar för alla.

För oss som arbetar med webbplatser är klarspråk en stor och viktig del av vårt dagliga jobb.

Tänk på mottagaren

 Vem kommer att läsa texten, hur ser målgruppen ut?

 Vilken/vilka tjänster ska besökaren kunna uträtta här?

 Utgå från det besökaren ska kunna göra med hjälp av texten, och lyft upp det viktiga.

 Ta bort det som inte är nödvändigt för att texten ska vara användbar.

Vårdat

 Undvik slang och alltför talspråksmässiga uttryck.

Enkelt

 Använd ett enkelt språk, relativt nära talspråket.

 Använd en enkel meningsbyggnad.

 Skriv aktivt – inte passivt.

 En aktiv mening innehåller någon som gör något.

Begripligt

 Anpassa texten så att läsaren kan förstå.

 Undvik förkortningar.

 Om du måste använda en förkortning, skriv ut förkortningen första gången den förekommer på varje sida.

 Undvik svåra ord och facktermer. Ge ordförklaringar om de måste användas.

Konkret

 Var konkret, undvik abstraktioner och bildspråk.

 Skriv objektivt och sakligt, undvik klyschiga förstärkningsord. Kortfattat  Välj relevant innehåll.

 Stryk sådant som inte behövs.

 Undvik långa och invecklade meningar.

Personligt tilltal

 Läsaren - du. Skriv med du-tilltal i största möjliga mån. Skapar en relation till läsaren. Skriv inte Du, skriv du.

 Avsändaren - vi. Så långt det är rimligt, det är relationsskapande. Skriv inte Vi, skriv vi.

 Tala till läsaren – inte om läsaren.

Tänk utifrån och in

 Var aldrig intern i en text.

 Vem som helst som besöker sajten ska kunna förstå.

 Tänk utifrån och in.

Luftigt och lätt att överskåda

 Den viktigaste informationen ska komma först.

 Inled gärna med en sammanfattning av innehållet på sidan.

 Inled varje stycke med den viktigaste informationen.

 Skapa luftiga texter som är lätta att överskåda.

 Använd gärna mellanrubriker och punktlistor för att göra texten luftigare.

 Skriv informationstäta uppräkningar som en punktlista. Placera de viktigaste listpunkterna först.

 I längre texter kan nyckelord i fetstil underlätta läsningen.

 Använd ord och termer konsekvent.

 Skriv datum och andra sifferuppgifter konsekvent.

Informativa rubriker

 Låt rubrikerna innehålla nyckelord ur texten.

 Skriv de viktigaste orden först i en rubrik.

 Använd gärna verb i rubriken.

 Rubriken ska se bra ut även i mobil.

 Se om rubriken går att förstå utanför sitt sammanhang.

 Varje sida ska ha en rubrik som är unik på sajten.

Länkar

 Det ska gå att förstå vart länken leder även utanför sitt sammanhang.

 Lägg länken som en egen rad under ett stycke.

 Fördjupande och breddande länkar ska användas sparsamt.

 Hjälper länken besökaren att lösa sitt problem ska den finnas, annars inte.

 En och samma länktext för alla länkar som leder till samma sida.

 Var sparsam med länkar i brödtext.

Be någon läsa igenom texten innan den publiceras!

7. Tillgängliga dokument

Alla dokument som ligger på vår webbplats omfattas av

tillgänglighetsdirektivet och behöver vara tillgänglighetsanpassade. Detta är ett stort område och behandlas en egen lathund som finns här:

https://intranat.norrkoping.se/service-och-stod/information-och- kommunikation/publicering-pa-norrkoping.se-och-intranatet