De Richtlijnen voor Toegankelijkheid van Webcontent (WCAG) in begrijpelijke taal
Lees de richtlijnen voor toegankelijke webcontent (WCAG 2.1) in begrijpelijke taal.
Overheidsorganisaties moeten voldoen aan niveau A en niveau AA. De richtlijnen voor niveau AAA staan daarom niet in dit overzicht.
1. Waarneembaar
Iedereen moet uw informatie en inhoud kunnen waarnemen, op meer dan één manier.
Geef alle inhoud die niet uit tekst bestaat, ook in de vorm van tekst weer.
Niet-tekstuele content is inhoud die niet uit tekst bestaat, zoals afbeeldingen, grafieken, pictogrammen en infographics.
Geef de informatie uit die inhoud ook weer als tekst. Een andere naam daarvoor is alt-tekst.
Dit is media met een bepaalde tijdsduur, zoals beelden, geluiden en video.
Er zijn gebruikers die geen beelden zien of geluiden horen. Zorg ervoor dat zij op een andere manier de inhoud van beelden, geluiden en video’s meekrijgen.
Bijvoorbeeld een MP3-bestand, podcast, video zonder geluid
Voorzie inhoud met alleen geluid of alleen video van een audiobeschrijving of een tekstversie. Zo krijgen gebruikers die moeilijk of niet zien of horen uw informatie ook mee.
Bijvoorbeeld een interview
Geef video’s die op voorhand zijn opgenomen een ondertiteling. Zo krijgen gebruikers die moeilijk of niet horen uw informatie ook mee.
Bijvoorbeeld een instructievideo
Geef vooraf opgenomen video een audiobeschrijving. Of zet wat er te horen en te zien is om in een uitgeschreven tekst. Een ander woord daarvoor is een transcript. Zo krijgen gebruikers die moeilijk of niet zien informatie die anders alleen met de ogen te zien is ook mee.
Bijvoorbeeld een videoconferentie
Geef live video een ondertiteling.
Geef op voorhand opgenomen video een audiobeschrijving. Zo krijgen gebruikers die moeilijk of niet zien informatie die anders alleen met de ogen te zien is ook mee.
Maak inhoud die gebruikers op verschillende manieren kunnen weergeven zonder dat ze informatie of het overzicht verliezen.
Bijvoorbeeld tabellen, lijsten, koppen, paragrafen, opsommingen, invoervelden van formulieren.
Leg in de code van uw website vast wat de verhouding tussen de verschillende onderdelen van uw webpagina is.
Wat u zichtbaar weergeeft, moet ook waar te nemen zijn met ondersteunende technologieën, zoals schermlezers, schermvergrotingssoftware en spraakherkenningssoftware.
Zorg dat gebruikers de inhoud in een logische volgorde kunnen waarnemen, of dat nu met hun ogen is of met ondersteunende technologie zoals een schermlezer. Daarvoor moet u alles de juiste code geven.
Zorg ervoor dat uw inhoud nooit bestaat uit dingen die gebruikers alleen maar kunnen zien of horen, zoals vormen, kleuren, grootte of geluiden.
Zo krijgen gebruikers die moeilijk of niet zien of horen uw informatie ook mee.
Zorg dat uw inhoud is afgestemd op schermen met verschillende verhoudingen. En dat uw inhoud in verschillende weergaves goed leesbaar is: staand en liggend.
Gebruikers met een handicap moeten de inhoud kunnen bekijken in een stand die voor hen het beste werkt. Een weergave in grotere letters is bijvoorbeeld makkelijker om te lezen in liggende stand. Sommige gebruikers hebben een toestel dat vastgezet is in een staande of liggende stand en dat je dus niet zomaar van stand verwisselt.
Maak het doel van invoervelden van formulieren duidelijk.
Zorg voor een goede opbouw en uitleg bij de invoervelden. Verschillende webbrowsers en ondersteunende technologieën moeten die kunnen weergeven, bijvoorbeeld een screenlezer.
Zorg ervoor dat gebruikers makkelijk kunnen belangrijke informatie onderscheiden.
Maak het voor gebruikers gemakkelijker om inhoud te horen en te zien en maak het onderscheid tussen voorgrond en achtergrond duidelijk.
Gebruikt u kleuren om informatie mee te geven of onderdelen te onderscheiden? Maak de info of het onderscheid dan ook op een andere manier duidelijk.
Zo zorgt u dat mensen die bepaalde kleuren minder goed zien een andere manier hebben om de informatie te begrijpen.
Hebt u inhoud met geluid dat vanzelf afspeelt en langer duurt dan 3 seconden? Zorg ervoor dat uw gebruikers dat kunnen op pauze zetten, stoppen of stiller zetten.
Zo kunnen gebruikers uw webpagina bezoeken met een schermlezer zonder last te hebben van dat geluid.
Gebruik genoeg contrast tussen de kleur van de voorgrond en achtergrond van uw tekst en afbeeldingen. Zorg dat iedereen alles goed kan lezen.
Standaardtekst en afbeeldingen van tekst: contrastverhouding van minstens 4,5:1.
Grote tekst en afbeeldingen van grote tekst (18 punten of 14 punten in het vet): contrastverhouding van minstens 3:1.
Zorg ervoor dat gebruikers uw tekst tot 200% kunnen groter maken. Tegelijk moeten ze alle inhoud nog altijd goed kunnen lezen en de pagina nog altijd goed kunnen gebruiken.
Zo kunnen ook slechtziende gebruikers uw inhoud gemakkelijk lezen.
Geef geen tekst als deel van een afbeelding weer. Je kan die dan niet in een groter lettertype weergeven. Als je de afbeelding dan maar vergroot, worden de letters wel groter, maar minder duidelijk.
Zorg dat alle inhoud op het scherm past.
De inhoud moet altijd ‘teruglopen’. Dat betekent dat hij over de hele breedte van uw beeldscherm zichtbaar blijft, welk apparaat u ook gebruikt.
Alle onderdelen die niet uit tekst bestaan, moeten kleuren hebben met genoeg contrast, bijvoorbeeld afbeeldingen, knoppen, iconen, grafieken of invoervelden.
Het contrast tussen de kleur van de voorgrond en achtergrond moet ten minste 3:1 zijn.
Als gebruikers de hoogte van tekstregels of de afstand tussen letters of woorden aanpassen, mag er geen inhoud verloren gaan. Alles wat de pagina doet, moet ook even goed blijven werken.
Gebruikers kunnen namelijk meer ruimte tussen regels, woorden en letters nodig hebben om tekst beter of sneller te kunnen lezen.
Uw gebruikers moeten uw extra inhoud makkelijk kunnen gebruiken, aanzetten of uitschakelen.
Voorbeelden van extra inhoud:
- Een pop-up: een boodschap die over de inhoud van een webpagina verschijnt, vaak via een nieuw venster.
- Knopinfo: informatie die je te zien krijgt door met je muis over een bepaald onderdeel te zweven, of met een ander woord, hoveren.
2. Bedienbaar
Gebruikers moeten digitale diensten en informatie makkelijk kunnen bedienen en er hun weg in vinden.
Alles wat gebruikers op de website kunnen doen, moet ze ook kunnen als ze alleen een toetsenbord gebruiken.
Zorg dat alles wat gebruikers kunnen zien en gebruiken ook te bereiken en te bedienen met alleen een toetsenbord is, bijvoorbeeld formulieren, menu’s of een winkelwagentje.
Zo kunnen ook mensen zonder muis doen wat de bedoeling is. Sommige mensen hebben niet genoeg controle of kracht in hun hand om een muis te gebruiken.
Zorg er voor dat iedereen ook met een toetsenbord de logische opbouw van uw website kan gebruiken.
Is er een onderdeel waar gebruikers naartoe moeten kunnen? Dan moeten ze daar met het toetsenbord kunnen geraken en ook weer weg kunnen.
Voorkom dus dat mensen die alleen een toetsenbord gebruiken niet verder kunnen en vast komen te zitten. In andere woorden: een valkuil door het toetsenbord.
Zorg dat gebruikers sneltoetsen zelf kunnen instellen als uw website sneltoetsen heeft. Sommige sneltoetsen zijn niet voor iedereen handig of makkelijk.
Daarom moeten gebruikers ze kunnen uitzetten en opnieuw toewijzen. Verder mag een sneltoets voor een onderdeel alleen actief zijn wanneer dat onderdeel de focus heeft.
Geef gebruikers genoeg tijd om uw inhoud te lezen, begrijpen en gebruiken.
Hebt u inhoud die alleen tijdelijk beschikbaar is? Bijvoorbeeld inhoud die verloopt of niet meer te gebruiken is na een bepaalde tijd, zoals een formulier dat u binnen een bepaalde tijd moet invullen?
Zorg er dan voor dat gebruikers kunnen aanpassen hoe lang de inhoud beschikbaar is. Zo krijgt iedereen genoeg tijd om informatie te lezen en te begrijpen.
Bijvoorbeeld animaties, video’s, knipperende tekst, fotocarrousel.
Geef gebruikers de mogelijkheid om inhoud, die langer dan vijf seconden automatisch beweegt op pauze te zetten, te stoppen of te verbergen. Zo leidt u mensen die zich moeilijker kunnen focussen en concentreren niet af.
Maak geen inhoud die aanvallen van epilepsie of andere lichamelijke reacties kan uitlokken. Zorg voor een veilig ontwerp.
Zorg ervoor dat uw inhoud niet meer dan drie keer per seconde flitst of knippert. Zo beschermt u mensen met aandoeningen zoals lichtgevoelige epilepsie tegen aanvallen
Help gebruikers de weg naar uw inhoud te vinden door een goede, duidelijke opbouw.
Zorg ervoor dat gebruikers onmiddellijk naar het begin van de hoofdinhoud kunnen gaan en onderdelen die herhaald worden, overslaan.
Bijvoorbeeld een hoofding of een menu met links. Zo kunnen gebruikers zonder muis ook snel en gemakkelijk de hoofdinhoud van de pagina bereiken, in plaats van eerst alle links van het menu daarboven te moeten doorlopen.
Geef uw webpagina’s een unieke titel die de inhoud of het doel van de pagina beschrijft. Ook zonder de inhoud te kennen, moeten gebruikers meteen begrijpen waar de pagina over gaat.
Zo vinden gebruikers snel hun weg en weten ze waarvoor een pagina dient zonder alles te moeten lezen
Zorg dat mensen via een logische volgorde door de inhoud kunnen gaan. De volgorde die u met uw ogen ziet, moet ook in de broncode gevolgd worden.
Gebruikers moeten links makkelijk begrijpen. De tekst van de link moet de bestemming of het doel ervan duidelijk maken.
Zo weten gebruikers van een schermlezer waar een link naartoe leidt zonder dat ze alle omliggende inhoud moeten lezen. En gebruikers die werken met spraakherkenning kunnen zo links kiezen via spraakopdrachten.
Zorg dat er meerdere manieren zijn om inhoud weer te geven en de weg te vinden.
Verschillende mensen hebben verschillende voorkeuren. Iemand met minder concentratie of tijd bladert misschien door een overzicht van alle links. Terwijl iemand die vergroting gebruikt misschien liever een zoekopdracht doet in plaats van door een lang overzicht te scrollen.
Gebruik duidelijke, beschrijvende koppen en tussenkoppen in uw teksten. Zo geeft u de inhoud een overzichtelijke opbouw. Geef onderdelen zoals een formulier, zoekbalk of tabel een label.
Zo begrijpen gebruikers waarvoor ze dienen en vinden gebruikers van schermlezers gemakkelijk de weg.
Maak zichtbaar welk onderdeel van een pagina de toetsenbordfocus heeft. Gebruikers van een toetsenbord moeten zien waar ze zich bevinden op de pagina.
Gebruikers moeten websites en apps kunnen gebruiken met verschillende apparaten waarmee je dingen kan aanwijzen en gegevens kan invoeren. Dus niet alleen met een toetsenbord.
Twee voorbeelden van een apparaat waarmee gebruikers een computer, tablet of smartphone gebruiken en gegevens invoeren: een touchscreen of aanraakscherm en een aanwijzer met een laser die je met je hoofd bedient.
Bijvoorbeeld inhoud vergroten of verkleinen door met een knijpbeweging met je vingers, van links naar rechts met je vinger te vegen
Op een aanraakscherm zijn er soms vingerbewegingen nodig om de onderdelen te kunnen gebruiken. Zorg dat gebruikers op meer dan één manier de inhoud kunnen bedienen.
Sommige gebruikers met een handicap moeten taken kunnen uitvoeren en selecties maken met eenvoudige invoer of eenvoudige bewegingen. Ingewikkelde of nauwkeurige bewegingen kunnen moeilijk zijn voor hen.
Als gebruikers iets doen wat niet de bedoeling is op een aanraakscherm, dan moeten ze dat kunnen stoppen of annuleren.
Zo voorkomt u dat gebruikers per ongeluk dingen in gang zetten op een pagina.
Geef onderdelen een label met een duidelijke naam die beschrijft wat de bedoeling ervan is. Gebruikers van spraakinvoer gebruiken, kunnen zo onderdelen activeren.
Gebruikers van voorleessoftware weten dan welke actie er aan een onderdeel verbonden is.
Kunnen gebruikers dingen doen op uw website of in uw app met gebaren of door hun apparaat te bewegen? Zorg dan ook voor een andere manier om dezelfde dingen te doen.
Sommige mensen hebben namelijk moeilijkheden om hun toestel te kantelen, schudden of gebaren te maken. Hun toestel kan ook ergens op vastgezet zijn, zodat ze het kunnen gebruiken zonder het vast te houden.
3. Begrijpelijk
Je vindt makkelijk je weg en je doet vlot wat de bedoeling is.
Zorg ervoor dat iedereen uw inhoud kan lezen en begrijpen. Of het nu gaat om inhoud die gebruikers zien, horen of voelen.
Geef in de code van elke pagina aan wat de hoofdtaal van de tekst is. Zo spreekt een schermlezer alles uit met het juiste accent en de juiste uitspraak.
Geef aan wanneer de taal op een pagina verandert of wanneer een deel in een andere taal is. Zo schaken schermlezers daar over naar het juiste accent en de juiste uitspraak voor die taal.
Geef inhoud in een voorspelbare volgorde weer. Gebruik voor dezelfde onderdelen dezelfde vormgeving.
Zorg ervoor dat geen enkel onderdeel verandert op het moment dat het de focus krijgt, zoals een nieuwe pagina laden. Laat gebruikers zelf beslissen of ze iets willen doen.
Anders gebeuren er onverwachte dingen zonder dat gebruikers van schermlezers en schermvergroters dat beseffen.
Als een onderdeel de focus heeft, mag de focus niet vanzelf veranderen. De focus mag bijvoorbeeld niet vanzelf naar het volgende veld in een formulier springen zodra een gebruiker het voorgaande veld heeft ingevuld. Dat mag alleen als u de gebruiker op voorhand laat weten dat dat gebeurt.
Wanneer inhoud, zoals een menu op meerdere pagina’s wordt herhaald, moet u die altijd in dezelfde volgorde weergeven. Zo vinden gebruikers gemakkelijker hun weg.
Wanneer onderdelen met dezelfde functie op meerdere plaatsen voorkomen, moeten ze altijd dezelfde vormgeving hebben en herkenbaar beschreven zijn. Zo vinden gebruikers gemakkelijker hun weg.
Geef gebruikers genoeg informatie zodat ze geen fouten maken, of begrijpen wat er misgaat en dat kunnen rechtzetten.
Wanneer er een fout optreedt, toon dan duidelijk waar de fout zit. En beschrijf goed wat er fout is.
Zo begrijpen ook mensen die bepaalde kleuren niet goed kunnen zien of die pictogrammen of andere symbolen niet goed begrijpen dat er iets fout is gegaan.
Bijvoorbeeld contactformulier of aanmelding voor nieuwsbrief
Zorg ervoor dat gebruikers begrijpen wat ze moeten invullen in een veld van een formulier. Moeten ze gegevens in een bepaald formaat ingeven, bijvoorbeeld een datum? Leg dan uit hoe dat moet.
Zo begrijpen alle gebruikers meteen welke gegevens ze moeten invullen.
Wanneer gebruikers niet de juiste gegevens invoeren, kunt u voorstellen laten zien van hoe ze die kunnen verbeteren. Tenzij dat niet veilig of nuttig zou zijn.
Zo lossen gebruikers problemen gemakkelijker op.
Moeten gebruikers vertrouwelijke gegevens invoeren, zoals wettelijke, financiële of persoonlijke gegevens? Zorg ervoor dat ze hun ingevoerde informatie kunnen nakijken, verbeteren en bevestigen.
4. Robuust
De inhoud moet altijd juist weergegeven worden en alle gebruikers moeten kunnen doen wat de bedoeling is. Daarvoor moet de ontwikkelaar de juiste code gebruiken.
Compatibel betekent dat een website werkt met alle webbrowsers en ondersteunende technologieën. Ook een app moet je met alle ondersteunende technologieën kunnen gebruiken.
Zorg dat de code van elke pagina juist is opgebouwd. Zo kunnen verschillende webbrowsers en ondersteunende technologieën die juist lezen en verwerken.
Zijn er onderdelen van de gebruikersomgeving waarmee gebruikers iets moeten kunnen doen? Dan moeten ze die ook met ondersteunende technologieën kunnen gebruiken.
Zo kunnen ook gebruikers van schermlezers met deze onderdelen werken.
Bijvoorbeeld de voortgang van een proces, een foutmelding, een bevestiging
Verandert er iets aan de inhoud van de pagina, bijvoorbeeld een bevestiging nadat iemand een formulier verzendt, of een lijst met zoekresultaten nadat iemand op ‘zoeken’ drukt? Laat dat dan weten aan uw gebruikers met een statusbericht, ook aan mensen die ondersteunende technologieën gebruiken.
Gebruikers van een schermlezer kunnen de wijzigingen niet zien en moeten een melding krijgen met info over wat er veranderd is.
Wettelijke verplichting
Alle websites en mobiele apps van overheidsorganisaties moeten voldoen aan de richtlijnen tot en met niveau AA van de WCAG 2.1(opent in nieuw venster) binnen de voorwaarden van de Europese Norm voor digitale toegankelijkheid (EN 301 549 V1.1.2)(PDF bestand opent in nieuw venster).
Deze verplichting volgt uit deze Europese richtlijn maar ook uit de Belgische wetgeving en het Bestuursdecreet in Vlaanderen(PDF bestand opent in nieuw venster).
Termen in begrijpelijke taal
- Alt-tekst of tekstalternatief is tekst die informatie in een afbeelding kort weergeeft. Daarmee krijgen blinde en slechtziende gebruikers de informatie ook, bijvoorbeeld gebruikers van schermlezers.
- Audiobeschrijving of audiodescriptie is extra geluid dat u aan een video toevoegt. Een stem beschrijft dan wat er in beeld gebeurt. Zo begrijpen gebruikers de inhoud van de video ook door er alleen naar te luisteren, zonder dat ze de beelden te zien.
- Een brailleleesregel zet de tekst op het scherm via een schermlezer om in braille.
- Knopinfo is informatie voor gebruikers. Je krijgt die door met de muis over een bepaald onderdeel te zweven, of met een ander woord, hoveren.
- Op tijd gebaseerde media is media met een bepaalde tijdsduur, zoals beelden, geluiden en video.
- Een pop-up is een boodschap die bovenop de inhoud van een webpagina verschijnt, vaak via een nieuw venster.
- Een schermlezer leest voor wat er op het scherm te zien is.
Spraakherkenning zet gesproken taal om in tekst of acties.
- Een transcript of tekstversie is een uitgeschreven tekst die de inhoud van een geluidsbestand of video weergeeft. Er moet alle belangrijke informatie uit de video of het geluidsbestand in staan.
Nieuwsbrief
Schrijf je in op de nieuwsbrief en blijf op de hoogte van het laatste nieuws rond toegankelijkheid.