Toegankelijk ontwerpen en vormgeven

Voor slechtzienden en kleurenblinden moet er voldoende contrast zijn tussen tekst, iconen, interactieve elementen en de achtergrond. In de WCAG staan de eisen waaraan dit contrast moet voldoen. Houd hier rekening mee bij het kiezen van huisstijlkleuren, het ontwerpen van een website, app of het maken van een Word-template.

Iedereen gebruikt een computer, tablet of smartphone op hun eigen manier. Veel mensen passen de instellingen van hun apparaat of software aan, zodat de instellingen zijn afgestemd op wat zij fijn vinden. Zorg dat de inhoud en functionaliteiten hetzelfde blijven, los van het apparaat of de persoonlijke instelling van de bezoeker. Bijvoorbeeld bij ingezoomde of mobiele weergave.

Om sneller, effectiever en onderbouwd te ontwerpen en bouwen, kun je gebruik maken van het NL Design System.

Gebruik HTML-elementen op de juiste manier. Hiermee is de betekenis niet alleen zichtbaar, maar is de betekenis en de structuur van de inhoud ook duidelijk voor browsers, zoekmachines en hulptechnologieën.

We raden af om een contrastknop te gebruiken. Als de kleurencombinaties op een website onvoldoende contrast hebben, kan een contrastknop zorgen voor een versie van de website met toegankelijke kleurcombinaties. Maar deze knop lost het probleem niet altijd op of zorgt zelfs voor nieuwe problemen.

Volgens de WCAG-eisen mag je nooit alleen kleur gebruiken om informatie over te brengen. Dit is niet toegankelijk voor mensen die kleur of kleurnuances niet kunnen waarnemen. Gebruik naast kleur altijd andere elementen om iets duidelijk te maken.

Kleurgebruik is een essentieel onderdeel van een huisstijl. Hoe deze kleuren gebruikt worden, bepaalt mede de toegankelijkheid van je producten. Toegankelijk kleurgebruik gaat altijd om toegankelijke kleurcombinaties. Een kleur zelf is niet toegankelijk of ontoegankelijk.

Kies bij het ontwerpen van een huisstijl bewust voor toegankelijke kleurcombinaties.

De informatie uit complexe afbeeldingen, infographics, grafieken of afbeeldingen van kaarten is soms te uitgebreid om als alt-tekst toe te voegen. Voeg dan ook een uitgebreide beschrijving toe.

Diagrammen, grafieken en infographics tonen veel informatie op een mooie en duidelijke manier. Maar ze moeten wel digitaal toegankelijk zijn. Dan zijn ze ook goed te zien voor mensen die bijvoorbeeld slechtziend of kleurenblind zijn.

Teksten en informatieve afbeeldingen in video’s zijn niet toegankelijk voor mensen met een visuele beperking. Om de video toegankelijk te maken, moet deze informatie ook in geluid aanwezig zijn.

De automatische ondertiteling voldoet in de meeste gevallen niet aan de WCAG-eisen. De eis is dat er goede ondertiteling is voor doven en slechthorenden.

Een bezoeker kan fouten maken in een webformulier. Met een automatische controle kun je de bezoeker vertellen wat er fout gaat en hoe het opgelost kan worden.

Labels zijn de namen of instructies van invoervelden in een formulier. Labels moeten beschrijvend zijn en gekoppeld zijn aan het invoerveld. Als je blind bent en een screenreader gebruikt, weet je door het label welke informatie je per veld moet invullen of aangeven. Vul je een formulier met spraakbediening in? Dan kun je labels uitspreken om elk veld in te vullen.