Tillgänglighet på webben

Senast ändrad: 18 juni 2021

Lagen om tillgänglighet till digital offentlig service (DOS-lagen) ställer krav på att myndigheters webbplatser ska vara tillgängliga för alla.

Det är viktigt att våra webbplatser är tillgängliga och användbara för så många som möjligt. Ungefär 15-20 procent av Sveriges befolkning har någon form av permanent funktionsnedsättning. Ännu fler upplever tillfälliga eller situationsberoende funktionsnedsättningar. 

Följ checklistan nedan när du arbetar med dina webbsidor. Kom ihåg att kolla både svenska och engelska versioner.

Använd korrekta rubrikformat

Det är viktigt att rubriker är formaterade med korrekt rubriknivå för att webbplatsen ska fungera bra för den som navigerar med någon form av hjälpmedel, till exempel talsyntes.

  • Korrekta rubriknivåer väljer du i Episervers editor, det vill säga Rubrik 2, Rubrik 3, Rubrik 4 och så vidare. 
  • Rubrikerna ska alltid användas i storleksordning. Rubrik 1 är alltid sidans titel, och det ska bara finnas en titel på sidan. Den första mellanrubriken ska därmed vara Rubrik 2, och först därefter kan du använda 3:an, och efter det 4:an. Efter en mindre rubrik går det förstås att gå tillbaka till en större grad.
  • Alla block har rubriknivå 2 som huvudrubrik, så första valbara nivå i själva blocket är rubriknivå 3.

Det är också viktigt att du formulerar bra rubriker som stämmer överens med innehållet. På så sätt ökar du sidans hittbarhet.

Läs om hur du skriver bra rubriker på sidan sökmotorotimering.

Ge sidan en tydlig och enkel struktur

Det viktigaste ska ligga överst på sidan, minst viktigt ska hamna längst ner. Besökaren ska snabbt få klart för sig vad sidan handlar om.

Några tips för att få en överskådlig sida:

  • Skapa en luftig struktur med många mellanrubriker och korta stycken.
  • Skriv enkelt, använd gärna punktlistor och tänk på att använda klarspråk. Det finns en checklista för klarspråk på medarbetarwebben.
  • Använd alltid ingress, som ska vara max 300 tecken och innehålla det viktigast i din text. Den ska svara på frågan "Vad innehåller den här sidan?".
  • Det blir svårt och tungläst för besökaren med många långa meningar. Använd gärna varierande längd på meningarna, och var frikostig med kommatecken för att underlätta läsningen.

Ge bilden en alternativtext (alt-text)

En så kallad alt-texten blir uppläst för den som lyssnar på en webbsida, och syftet med den är att beskriva bilden för den som inte kan se den. Alt-texten visas också för den som surfar utan att visa bilder.

Alt-texten är numera obligatorisk i Episerver, för att möta den nya lagen om tillgänglighet. Det går inte att publicera en ny bild om den inte har fått en alt-text. Om du ändå publicerar sidan kommer bilden att markeras med ett rött kryss.

Bilder som publicerades tidigare (före januari 2020) visas fortfarande, men även dessa bilder behöver ges en alt-text för att följa lagen om tillgänglighet. Det du behöver göra är att gå in i bildens redigeringsläge och ge den en svensk och engelsk alt-text och publicera om den.

Vissa bilder är av dekorativ karaktär och behöver därmed ingen alt-text. Det gäller till exempel för stämningsskapande toppbilder som ofta också har text ovanpå bilden. I de fallen går du in i bildens redigeringsläge och kryssar i rutan för dekorativ bild.

Så här lägger du till din alt-text

Lägg till din alt-text på bildens baksida via resursfönstret. Du når bildens baksida genom att dubbelklicka på den eller genom att välja redigera till höger i hamburgermenyn.

 Alttext. Skärmbild.

Om du har svårt att hitta en redan uppladdad bild brukar det fungera bra att söka på bildens id-nummer i resursfönstret. Id-numret ser du om du håller muspekaren över bildfilen på webbsidan.

 bild-id, skärmklipp

Tips för hur du skriver en bra alt-text

  • Beskriv motivet (till exempel "Man i grön keps äter banan på gångväg. Foto.").
  • Avsluta med punkt så att skärmläsande program vet att alt-texten är slut.
  • Utelämna onödiga ord som "Porträtt av ...", "Bild av..." etc. det blir tjatigt i de listor som alstras och läses upp av besökarens skärmläsarprogram.
  • Ange vad det är för typ av bild sist i alt-texten, till exempel foto, illustration, diagram eller liknande.
  • Ta inte med fotografens namn i alt-texten, skriv det i stället i fältet ägare/owner. Skriv också fotografens namn i bildtexten så att det visas på webbplatsen.
  • För dekorbilder som inte tillför något kommunikativt värde (till exempel bakgrundsbilder) kan du lämna alt-texten tom och istället kryssa i rutan för dekorativ bild.
  • Observera att du antingen måste skriva en alt-text eller kryssa i rutan för dekorativ bild för att bilden ska publiceras och visas på webbsidan.

Lär dig mer om alt-texter och digital tillgänglighet

Skriv tydliga och beskrivande länkar

Tydliga länkar underlättar för alla, men är särskilt viktiga för personer som använder vissa hjälpmedel. 

För användare med nedsatt motorisk förmåga kan varje interaktion kräva mycket tid eller energi. Låt därför syftet med varje länk vara så tydligt att användaren enkelt kan avgöra om hen ska följa länken eller inte. 

Skärmläsaranvändare kan välja att navigera genom att enbart läsa upp alla länkar på en sida. Sträva därför efter att länktexten ska gå att förstå även om den är tagen ur sitt sammanhang och undvik upprepningar.

Checklista för bra länktexter

  • Länka ord som säger något om vart länken leder och undvik onödiga ord i själva länken. 
  • Använd gärna den länkade sidans rubriktext som länktext.
  • Ange om länken går till en annan webbplats.
  • Undvik formuleringen ”läs mer”, dels som egen länk och dels i början av en längre länk. Undvik också otydliga formuleringar som "klicka här" eller "hitta hit".
  • Använd gärna punktlistor om du har flera länkar.
  • Skriv ut e-postadresser i klartext.

Några goda exempel

  • Skicka e-post till anders.andersson@organisation.se för att anmäla dig
  • Regler för kontroll av livsmedel på Livsmedelsverkets webbplats
  • Läs om hantering av farligt avfall (i löptext)
  • Resultat från övervakning av granbarkborre
  • Bibliotekets söktjänst Primo

Skapa tillgängliga pdf-filer från Word och andra program

Pdf-dokument är inte automatiskt tillgängliga för alla. Därför är rekommendationen att så långt som möjligt undvika pdf:er och att istället publicera ditt innehåll som html (alltså som vanlig text på en webbsida). Om du trots allt måste publicera en pdf kan du kort beskriva dess innehåll i anslutning till länken, för att hjälpa besökaren att avgöra om hen har nytta av att ladda ner dokumentet.

Lagen om tillgänglighet till digital offentlig service omfattar alla dokument skapade efter 23 september 2018. Har du en äldre men viktig eller flitigt läst pdf-fil behöver du se till att också den är tillgänglig för alla.

Skapa tillgängliga pdf:er via Word

För att en pdf-fil ska bli tillgänglig är det viktigt att den är skapad utifrån ett korrekt ursprungsdokument, som regel i Word. Det gör du genom att

  • använda formatmallar med korrekt formatterad text och korrekta rubriknivåer
  • ange alt-texter för bilder och allt annat innehåll som inte är text
  • formatera tabeller med rubrikrad och alt-text.

Bilder:

  1. Markera  bilden
  2. Högerklicka och välj formatera bild för att lägga till alt-texten.
  3. Välj "layout och egenskaper" och sedan Alternativ text. Alt-texten är den text som en skärmläsare läser upp för den som inte kan se bilden.

Tabeller:

  1. Markera tabellen
  2. Högerklicka och välj Tabellegenskaper.
  3. Välj fliken Alternativtext och ange alt-texten i fältet beskrivning.
  4. Välj fliken Design och bocka i kryssrutan för rubrikrad.

Testa dokumentets tillgänglighet i Word

Du kan testa ditt dokument i Microsofts inbyggda tillgänglighetskoll innan du sparar det som pdf. Skriv in "Tillgänglighetskontroll" i hjälpfunktionen och följ anvisningarna. Eventuella fel hittar du i ett separat fönster på skärmen, tillsammans med anvisningar för hur du åtgärdar dem. 

Du kan också lyssna på den färdiga filen för att säkerställa att den läses upp på ett bra sätt. Det kan du göra genom att:

  1. Öppna filen i webbläsaren Edge.
  2. Högerklicka och väj Läs upp. 

SLU:s dokumentmallar

SLU:s dokumentmallar i Word är tillgänglighetsanpassade så långt det går med den design de har i dagsläget. Om du tillgänglighetskontrolllerar ett dokument som skapats med en SLU-mall kommer du att få vissa varningar som inte går att undvika.

Det gäller främst följande:

  • Logotypens placering i dokumenthuvudet (ej i linje).
  • Tomma tabellceller i dokument där tabeller används för att strukturera innehållet (till exempel underskrifter i beslut).

Rätta en pdf-fil

Behöver du rätta en pdf-fil går det att göra med hjälp av programet Arobat pro. Men det är mycket enklare att göra rätt i källsystemet än att rätta i efterhand.

Pdf:er skapade från andra program än Word

Tillgänglighetskraven gäller också för pdf:er skapade från andra program än Word, som till exempel Powerpoint eller InDesign. Microsofts tillgänglighetskontroll finns inbyggd i alla Microsoftprodukter. För InDesign finns också inbyggd funktionalitet och en checklista. Rekommendationen är dock att om möjligt undvika pdf:er på webbplatsen och istället presentera informationen direkt på webbsidorna.

Texta och syntolka nya filmer

Textning

Cirka en halv miljon svenskar använder sig av hörapparat och så många som 1,5 miljoner har svårt att höra. Det innebär att rörlig bild behöver ha både ljud och text. Förutom att texta tal i dina filmer behöver du också i text beskriva andra ljud som förkommer i filmen och som har betydelse för sammanhanget. Undertexter gör det också möjligt för alla de som har ljudet avstängt att ta till sig innehållet i en film.

Om filmen inte textas måste den tas bort från webbsidan efter två veckor.

Lagen om tillgänglighet till offentlig digital service omfattar alla filmer publicerade efter 23 september 2020. 

Mer info på medarbetarwebben om textning

Automatisk textning

Nedan listas några tjänster för automatisk textning som kan vara till hjälp om du ska texta längre filmer. Observera dock att kvaliteten på autotextning varierar. Titta därför alltid igenom filmen när textningen är gjord och korrigera eventuella felaktigheter.

Screencast-O-Matic

Ett annat verktyg som SLU har tillgång till är Screencast-O-Matic. Du kan importera redan inspelade filmer, eller så kan du spela in i Screencast-O-Matic och få automatisk textning i efterhand.

Syntolkning

För att de cirka 100 000 synskadade i Sverige ska kunna ta till sig videomaterialet behövs också det som syns men inte hörs beskrivas. så kallad syntolkning. Syntolkningen beskriver det som inte framgår av dialogen eller ljudläggningen. Det gäller att välja ut rätt saker att beskriva, för att ge den synskadade tittaren en bra bild av vad som händer. Handlingen är förstås viktigast, här ingår också saker som ansiktsuttryck och gester som har betydelse för historien. Men i mån av plats ska också scenografi, utseende och kostym beskrivas. En syntolkning får inte krocka med dialogen, och det finns ofta begränsat med tid för syntolken att prata.

De flesta lagringsplatser för video, inklusive Youtube, stöder inte flera ljudspår till en video. Därför får den syntolkade videon läggas som en separat videoversion. I denna version kan extra pauser i videoinnehållet möjliggöra att syntolkningen får plats. 

Fakta:

Lag om tillgänglighet till digital offentlig service (DOS)

DOS-lagen är svensk lag sedan 1 januari 2019. Den bygger på EU-direktiven om webb och tillgänglighet och omfattar myndigheters webbplatser, e-tjänster, appar och så långt som möjligt också innehåll hos tredje part (såsom sociala medier). 

Målet är att alla ska kunna ta del av den digitala offentliga servicen. Du ska kunna uppfatta, hantera och förstå tjänster, oavsett vilken situation du befinner dig i, vilken funktionsnedsättning du eventuellt har och oberoende av vilka hjälpmedel du använder. 

Myndigheten för digital förvaltning (DIGG) är tillsynsmyndighet.

WCAG 2.1

DOS-lagen omfattar Webb Content Accessibility Guidelines (WCAG) 2.1, nivå AA. Checklistan beskrivs i något förenklad form på svenska på webbriktlinjer.se, som är de officiella riktlinjerna för hur myndigheter bör arbeta med webbplatser.

Sidansvarig: webbredaktionen@slu.se