De officiella riktlinjerna för hur man bör arbeta med webbplatser i offentlig sektor
Webbriktlinjer.se genomgår justeringar
Webbriktlinjer.se genomgår justeringar under 2023 och därför kan innehållet på webbplatsen vara inaktuellt. De tillgänglighetskrav som finns för digital offentlig service finns i standarden EN 301 549 V3.2.1, som hänvisar till Web Content Web Accessibility Guidelines 2.1 (WCAG 2.1).
Kontrollera att era mallar för funktioner, tjänster och stilmallar validerar i enlighet med er valda standard.
Kräv att leverantören vid leverans bifogar valideringsprotokoll för samtliga mallar. Mallar som inte validerar bör inte godkännas för leverans, om inte leverantören har acceptabla argument för alla valideringsfel.
Försök att automatisera en regelbunden kodvalidering, eller gör validering till en rutinåtgärd vid all förändring av webbplatsens kod. Det är lätt hänt att tidigare korrekt kod går sönder. Det kan till exempel hända när ni uppdaterar ett tilläggsprogram, när ni infogar en videospelare i ett blogginlägg eller när någon gör ett inlägg i ett kommentarssystem.
Skapa genvägar för att hoppa över delar i strukturen till exempel menyn, för att komma direkt till sidans innehåll.
Skapa rubriker med h-element, eftersom skärmläsare låter användarna snabbnavigera med hjälp av sidans rubriker.
Använd WAI-ARIA landmark roles, till exempel main, search, navigation, banner, contentinfo och så vidare. Det gör att användare med exempelvis skärmläsare kan navigera mellan sidans olika delar på ett standardiserat sätt.
Om du använder HTML5, använd strukturelement som main, aside, header, footer och nav för att definiera vilken roll varje del av sidan har.
Testa läsordningen genom att granska en sida av varje sidtyp med några skärmar i olika storlek och genom att lyssna igenom innehållet med en skärmläsare.
Se till att webbplatsen kan användas även utan stilmallar. Vissa webbläsare och tilläggsprogram har funktioner för att avaktivera CSS.
Se till och testa även att läsordningen är logisk i dokument som inte är html (pdf, word med mera) .
Komplettera betydelsebärande färgskillnader med någon annan synlig skillnad:
Ikoner eller liknande grafiska element kan ibland passa som komplement till färgskillnader.
Färgskillnader mellan textelement kan kompletteras med understrykning, ram, fetstil, kursivering eller annat teckensnitt. Var särskilt noga med att framhäva länkar.
Färgskillnad mellan ytor i bland annat kartor och diagram kan kompletteras exempelvis med mönster, inramning, kontrastskillnad eller text.
Linjer kan exempelvis göras streckade, prickade, prickstreckade eller dubbeldragna.
Ibland behöver färgskillnader kompletteras med skriven text som ger motsvarande information.
Semantisk kodning är ofta ett bra men otillräckligt komplement: Skärmläsare presenterar ofta den semantiska informationen, men det är inte alla användare som har skärmläsare.
Var särskilt försiktig med färgerna grön, röd och brun. Många personer med färgblindhet har svårt att särskilja dessa.
Använd gärna sensoriska kännetecken (färg, form med mera) för instruktioner eftersom det kan vara en effektiv metod för att underlätta för användarna, inklusive personer med kognitiva begränsningar men kom ihåg att komplettera informationen så att alla kan förstå den.
Använd samma termer för återkommande funktioner såsom knappar och ikoner, eftersom vissa användare saknar till exempel layout och formgivning som annars kan användas för orientering.
Använd i första hand standardkomponenter som finns i html. Då uppfyller du automatiskt detta krav. Bara när det finns starka skäl och tillräckliga resurser för test och utveckling bör skräddarsydda komponenter utvecklas.
Vid val av tilläggsprogram eller kodplattformar (till exempel olika javascript-bibliotek) behöver ni undersöka om eventuella komponenter som bygger på dessa plattformar har ett bra stöd för tillgänglighet.
När bilder trots allt behöver innehålla text kan denna ofta göras tillgänglig för alla genom att:
Använda CSS för att placera text i bilden, istället för att ha texten avbildad.
Generera bilden dynamiskt med hänsyn till användarens preferenser för teckensnitt, storlek och förgrund- eller bakgrund. Observera att detta kan kräva en del programmering och att sidan kan behöva innehålla kontroller för att ställa in sådana preferenser. Komplettera med en alt-text.
Skriv alt-text till knappar, logotyper, skärmdumpar och diagram som förmedlar samma information som bilden.
En bild av ett handskrivet brev kan ha antingen en alt-text som återger innehållet eller en kompletterande text med samma funktion.
För vissa användare och i vissa sammanhang behövs gott om tid för att använda digitala tjänster. Ge därför användare möjlighet att stänga av, anpassa eller utöka eventuella tidsbegränsningar, om det inte är orimligt för att uppnå sajtens syfte.
Publicera dokument i standardformatet html. Då kan användarna komma åt er information utan att använda en viss datorplattform, eller ett program som kostar pengar, till exempel Word.
Om ni har dokument i andra format än html, sammanfatta dem i html, så att användarna kan bedöma innehållet utan att ladda ner det.
Utforma dokument så att de enkelt kan läsas på skärm. Då bidrar ni till att färre användare skriver ut på papper.
Om ni använder pdf:er, se till att de skapas så att de blir tillgängliga.