Snart träder EU:s tillgänglighetsdirektiv och den svenska tillgänglighetslagen i kraft. Här berättar vi vad du behöver göra innan.

För att uppfylla direktivet ska du:

  • Publicera tillgänglighetsutlåtande
  • Gör det möjligt för användare att påtala brister
  • Följ WCAG 2.1 nivå AA

De två första punkterna tog jag upp i Har du koll på EU:s tillgänglighetsdirektiv så här tänker jag lyfta upp några av de saker du bör göra för att uppfylla WCAG 2.1 nivå AA.

Tillgänglighet enligt EU – WCAG 2.1 nivå AA

WCAG, eller Web content accessability guidelines, är de internationella riktlinjer för tillgänglighet EU vill att vi ska följa. Just nu är version 2.0 ute, men de kommer med 2.1 i vår. Riktlinjerna finns i tre nivåer, där A är lägst och AAA är högst. För EU räcker det med att man uppnår nivå AA.

Förenklat kan man säga att WCAG kräver tre saker:

  • Tillgänglig design
  • Tillgängligt innehåll
  • Tillgänglig kod

Det här är tre stora puckar, och skulle jag gå igenom alla skulle du fortfarande läsa om en vecka. Därför lyfter jag upp några extra relevanta punkter här.

Tillgänglig design

Design är ett väldigt brett begrepp och här ingår mycket. Vissa saker måste utvecklare, designer och ux:are göra, andra saker kan ni göra redaktionellt.

Exempel på vad er leverantör kan se över

  • Kontrast
  • Tillräckligt med tid
  • Möjlighet att se var man är på sidan

Kontrast, så att färgblinda och personer med dålig skärm eller ljusreflexer kan se. WCAG anger vilka förhållanden det ska vara mellan förgrund (oftast texten) och bakgrunden. Det finns också gratistjänster på nätet, till exempel www.contrastchecker.com

Exempel på dålig kontrast med ljusgrått på ljusblått och rött på rosa.

Har man lässvårigheter, begränsad rörelseförmåga eller är datorovan kan det ta tid att uppfatta information och hinna agera i rutor när man hoovrar, i bildspel eller liknande funktioner. Ingenting ska försvinna automatiskt efter en viss tid.

Användare ska kunna navigera enbart via tangentbordet, och då behöver de se var på sidan de är. Nedan visas skillnaden på omarkerat och markerat element.

Konsekvens för förutsägbara sidor

Konsekvens skapar förutsägbara sidor och är viktigt för att användarna ska förstå hur webbplatsen fungerar. Liknande uppgifter ska utföras på samma sätt oavsett var på webbplatsen man befinner sig. Här kan både utvecklare och redaktörer bidra.

Gränssnittselement som menyer, sidhuvud, sidfot och knappar ska se likadana ut och finnas på samma plats på alla sidor. På samma sätt ska man försöka följa det som är standard på webben i övrigt, till exempel med plus och minus eller pilar för att fälla ut och in text.

Redaktörer kan bidra genom att se till att liknande uppgifter finns på samma plats på olika sidor, till exempel kontaktuppgifter och länkar. De kan också se till att formulär skapas så lika varandra som möjligt, oavsett var på sajten de är.  Det kan till exempel handla om att knappar för att ta sig vidare eller skicka alltid heter samma sak, eller att namn och personnummer alltid ska lämnas enligt samma format.

Tillgänglig navigation

Användare ska kunna navigera på olika sätt, och alla sätt ska fungera lika bra. De fyra vanligaste sätten är meny, sök, sajtkarta eller tangentbord. Det är upp till utvecklarna att se till att sajtkarta och länkstigar finns och att det går att navigera via tangentbord, men det är upp till redaktörerna att skapa en bra struktur på webbplatsen och sökmotoroptimera texterna.

Förutom att sökmotorptimera texterna kan ni behöva ge internsöket lite hjälp på traven genom att lägga in synonymer, träfförslag och en hjälptext för användaren hur den söker.

Tillgängligt innehåll

Tillgängligt innehåll är till stor del redaktörens ansvar. Det handlar om texter som går att förstå, formulär som går att använda och rätt formatering så att koden blir rätt.

Ett enkelt sätt att försäkra sig om att texter är tillgängliga är att skriva klarspråk. Klarspråk underlättar förståelsen för alla, oavsett om läsaren har koncentrationssvårigheter, dyslexi, svenska som andraspråk eller är expert på att läsa.

Texten ska sedan formateras på rätt sätt, så att även skärmläsare och sökmotorer kan förstå texten. Det innebär att

  • alltid använda rubriksformaten istället för att feta
  • alltid använda punktlistorna istället för att göra egna bindestreck
  • aldrig använda tabeller för att göra layout, utan bara använda det för tabelluppställningar av data
  • skriva förklarande länktexter istället för ”klicka här” eller ”läs mer”

Dessutom ska redaktören alltid lägga in en alt-text för bilder. Alt-texten blir läst av skärmläsaren och ska beskriva bilden.

Förutom att texten ska vara tillgänglig behöver du se över dina formulär. Se till att det är lätt att begripa vad man ska fylla i och hur man ska fylla i dem. Om man gör fel ska man få begripliga felmeddelanden så att man förstår vad det är man ska ändra. Dessutom ska det inte krävas att man gör formuläret på en viss tid.

Exempel på dålig hjälptext. Trots att det står en taxiresa kommer det upp ett meddelande om att det inte finns någon taxiresa. Vad innebär det att användaren ska göra?

Och du, en sista sak. Undvik pdf:er. Pdf:er är hemska ur tillgänglighetssynpunkt. De är hemska på mobilen, de är hemska om man behöver skärmläsare och Google gillar dem inte. Måste du ändå använda dem, se till att tillgänglihgetsanpassa dem i Word eller Adobe innan du publicerar dem.

Tillgänglig kod

Tillgänglig kod innebär att webbplatsen är kodad så att det går att navigera och förstå sidan med hjälp av olika verktyg. Alla ska ha samma förutsättningar att uppleva webbplatsen på samma sätt, oavsett om man navigerar med mus, tangentbord eller switchknapp och oavsett om man ser sidan eller får den uppläst.

Jag är inte utvecklare, och jag tror inte att du som läser detta är utvecklare heller, så jag kommer inte grotta ner mig i detaljer. Istället rekommenderar jag dig att gå till din leverantör och prata med dem om WCAG. Be dem säkerställa att er webbplats uppfyller de tekniska kriterierna av WCAG. Men var en bra beställare, se till att själv lära dig om WCAG också. På så sätt är du inte utelämnad till vad din leverantör säger unan kan själv avgöra om de förslag de kommer med är rimliga och om de är värda investeringen i tid och pengar.

Vad gör jag nu?

Känner du paniken stiga över ännu en lag att ha koll på och se till att ni följer? Lugn, det finns massor av hjälp att få.

Besök Post- och telestyrelsens webbplats Webbriktlinjer, och WCAG:s egen webbplats och lär dig mer om tillgängliga webbplatser.

Gör ett självskattningstest på Webbriktlinjer.se

Testa även din sajt med gratistjänster (ex  W3Cs validator) eller betaltjänster (ex Siteimprove) för att få en uppfattning om vad det är som saknas.

Påbörja arbetet genom att gå igenom Webbriktlinjers checklistor

Lär dig hur EU:direktivet påverkar webbarbetet

Med vår kurs i tillgänglighet för webben lär du dig vad EU:s direktiv innebär, hur det påverkar ditt arbete med webben och vad du behöver göra för att uppfylla det. Du får konkreta tips och verktyg och kommer igång med ditt arbete redan under kursen.