11 richtlijnen voor betere digitale toegankelijkheid

Blog

Gepost op

3/08/2023

Auteur

Rembrand Le Compte

Frontend Product Engineer

Laatste update 03/09/2023

Je zal er misschien al van gehoord hebben: de WCAG-richtlijnen of ‘Richtlijnen voor Toegankelijkheid van Webcontent’. Maar waar gaat dit precies over? En moet je er van wakker liggen voor jouw website?

Je wil uiteraard dat je website zo toegankelijk mogelijk is. Maar wat betekent dat precies? Wat zijn de minimale vereisten en wie kan je hiermee helpen? Dat klaren we even uit voor jou!

Wat is digitale toegankelijkheid?

Digitale toegankelijkheid gaat om het bouwen van een digitale omgeving (websites, apps…) die bruikbaar is door zoveel mogelijk mensen. We doen dit door rekening te houden met de verschillende mogelijkheden of omstandigheden van de mensen die toegang kunnen hebben tot die omgeving.

Wat is ‘WCAG’ en wat heeft het met digitale toegankelijkheid te maken? WCAG, of Web Content Accessibility Guidelines, zijn een set van richtlijnen, in het leven geroepen door het World Wide Web Consortium (W3C), die de internationale standaarden voor het internet bepaalt en documenteert. Kortom, het WCAG is een gids om toegankelijke websites (of apps) te maken. Het is een veelgebruikte en zelfs internationale standaard. Er bestaan verschillende versies en gradaties maar de meestgebruikte is momenteel WCAG 2.1 AA. Een update naar 2.2 was gepland voor eind 2022 maar is uitgesteld. Het W3C heeft een voorgesteld advies gepubliceerd in juli 2023. Het is nog niet duidelijk waneer de officiële update gereleased wordt.

Het belang van digitale toegankelijkheid

Tenzij je website bij een bepaalde sector hoort (zoals een overheidswebsite), ben je wettelijk niet verplicht rekening te houden met toegankelijkheid. Toch raden we je aan hier rekening mee te houden omdat je er voordelen uithaalt voor jezelf en je bezoekers.

De voordelen van een goede digitale toegankelijkheid

Voordelen voor grotere massa

Toegankelijkheidsverbeteringen bieden ook voordelen voor mensen zonder (permanente) handicap. Denk bijvoorbeeld aan stemherkenning in een GSM. Dit maakt al jaren een belangrijk deel uit van de hulpmiddelen voor blinden en slechtzienden. Het is ook wijdverspreid door integraties met digitale assistenten zoals Google Home, Alexa, Siri… waarmee we handsfree onze devices bedienen. Maar ook in combinatie met de GPS, zodat je je ogen op de weg en je handen op het stuur kan houden.

Hoe inclusiever je website, hoe meer bezoekers

Als we weten dat 8% van de Belgische bevolking tussen 15 en 64 jaar ernstige hinder heeft bij dagelijkse activiteiten door een handicap of langdurige gezondheidsproblemen (enquete Statbel, 2020) en 81% hiervan regelmatig gebruik maakt van het internet, kunnen we wel spreken van een grote groep potentiële bezoekers.

Samen de wereld een beetje verbeteren

Tijdens de Corona-crisis, zagen we een ongekende stijging in het online winkelen. Onder andere door noodzaak, maar we zien hiermee ook dat het gebruik van digitale producten kan bijdragen tot een graad van onafhankelijkheid. Iets ‘zelf niet kunnen’ en afhankelijk van derden, is een grote stress-factor die een impact heeft op bijvoorbeeld mensen met een motorische handicap, maar ook op hun omgeving. Verbeteringen in het gebruik van online tools (zoals online winkelen, informatie opzoeken, …) vermindert die stress en maakt het leven een stuk gemakkelijker.

Verbeterde SEO

Verschillende factoren die bijdragen aan toegankelijkheid, dragen ook bij aan een betere SEO. Een website die een goede toegankelijkheid heeft, zal dus ook een positieve impact hebben op SEO.

Hoe pakken we digitale toegankelijkheid aan?

Waar niet altijd aan gedacht wordt, is het brede spectrum aan handicaps en hindernissen die het online gebruik van een website bemoeilijken. Bij ‘Toegankelijkheidsproblemen’, denken we misschien vooral aan het extreme einde van dat spectrum en hoe blinden en slechtzienden met onze websites moeten omgaan. Het gaat evengoed om mensen die slechthorend zijn (mensen die bijvoorbeeld omgaan met auditieve informatie bij video’s), mensen met een leesstoornis (6% van de volwassen Vlamingen), laaggeletterdheid (14% van de volwassen Vlamingen) of zelfs situationele beperkingen (bijvoorbeeld een trage of slechte mobiele internetverbinding, net wanneer je de trein- of busregeling nodig hebt).

Kortom: bij digitale toegankelijkheid zijn er veel zaken om rekening mee te houden, maar het belang voor je bezoekers is enorm groot. En je plukt er zelf ook de vruchten van.

Het goede nieuws is dat er al veel (hulp)middelen bestaan om het online navigeren te vergemakkelijken (text readers, toegankelijkheidssettings in devices, …). 90% van wat nog moet gebeuren aan je website, is het toepassen van vaste standaarden zodat die hulpmiddelen goed werken. Omdat dit vaak een impact heeft op de bouw van een nieuwe website, raden we je aan om dit vanaf de start al in het achterhoofd te houden.

De overige 10% is vooral oplossingen zoeken voor situaties en patronen die ietwat buiten de norm vallen of vroeger zelden in vraag gesteld zijn. Denk bijvoorbeeld aan de alomtegenwoordige JavaScript datepicker. Deze component opent een kleine kalender, als je op een datum-veld klikt. Je navigeert doorheen jaren en maanden aan de hand van pijltjes om uiteindelijk een dag aan te klikken. Dit oogt mooi en is handig wanneer je met de muis werkt maar we merken vaak problemen met navigeren via het toetsenbord, wat dé basistool is voor toegankelijke navigatie. Gelukkig zijn er wel oplossingen of alternatieven te vinden.

Digitale accessibility checklist

Bij Dropsolid, maken we gebruik van een accessibility checklist: richtlijnen die problemen moet voorkomen op vlak van content, structuur, design (UI) en ontwikkeling. Deze maken het gemakkelijker om uiteindelijk te voldoen aan de WCAG 2.2 AA. De oplijsting hieronder maakt ook meteen duidelijk dat toegankelijkheid een gedeelde verantwoordelijkheid is. Een website kan maar optimaal toegankelijk zijn als al deze aspecten voldoen, en dus iedereen die meebouwt (ook wie content aanmaakt) werkt hieraan mee.

Hier zijn alvast enkele basis-richtlijnen om je op weg te helpen:

1. Leesniveau

Zorg dat de tekst overeenkomt met het leesniveau van je publiek. Dit betekent niet enkel rekening houden met het taalvermogen maar ook met het feit dat veel mensen afhaken bij gigantische blokken tekst.

4. Zoom

Zorg dat je bezoeker kan inzoomen tot 200%, zonder dat er functionaliteiten (bijvoorbeeld de navigatie) of informatie verloren gaat. Denk er aan dat dit ook geldt voor kleine schermen (zoals een smartphone).

7. Formulieren

Help de gebruiker door duidelijk te maken waar in het formulier hij bezig is. Dat houdt in dat je focus-stijlen gebruikt om duidelijk te maken welk veld de bezoeker aan het invullen is. Maak ook duidelijk wanneer een veld verplicht is, waar er een fout gebeurt bij het invullen… en hoe je gebruiker dit kan oplossen.

10. Touch

Zorg dat alle aanklikbare elementen, groot genoeg zijn (minimum 24 bij 24 px) om ook met touch te werken.

2. Semantische HTML

Gebruik de juiste HTML voor de juiste functie. Dit zorgt ervoor dat screen readers de navigatie en inhoud kunnen vinden en andere hulpmiddelen deze kunnen gebruiken (inclusief toetsenbordnavigatie).

5. Links

Links moeten duidelijk onderscheidbaar zijn. Zorg dus voor een kleur die contrasteert met de omliggende tekst en achtergrond.

8. Contrast

Hogere contrastwaarden helpen bij verschillende types van kleurenblindheid en troebel zicht. Het kan gemakkelijk gemeten worden met tal van contrast-checkers die je online vindt.

11. Responsive design

Het spreekt ondertussen bijna voor zich, maar zorg dat een ontwerp de informatie duidelijk kan overbrengen op verschillende schermgroottes maar vooral op kleine schermen en devices.

3. Tabnavigatie

Een website mag niet enkel via je muis (of touch) bruikbaar zijn. Het moet mogelijk zijn om op een duidelijke en vlotte manier, via de tab-toets doorheen de site te navigeren en via de Enter-toets, pijltjes… elementen zoals links en formulieren kunnen bedienen.

6. Media

Voor audiovisueel materiaal, moeten alternatieven beschikbaar zijn. Een podcast of interview geef je een transcript, een video geef je ondertiteling en een beschrijvende tekst mee.

9. Animatie en lichtflitsen

Let op met lichtflitsen, ze kunnen epileptische aanvallen veroorzaken. Vermijd dus flitsen die langer duren dan 3 seconden of beperk dit tot een zeer klein gebied. Deze tool helpt je om dit te meten.

We zetten de checklist ook om in een uitgebreide versie in de vorm van een PDF, zodat jij gemakkelijk nagaat aan welke puntjes jouw website nog niet voldoet en waar je nog verbeteringen kan toevoegen.

Download de uitgebreide checklist

Validatie en certificatie van digitale toegankelijkheid

Enkel bovenstaande set richtlijnen gebruiken, levert niet noodzakelijk een volledig toegankelijke website op maar het is alvast een startpunt. Uiteindelijk moet het resultaat gevalideerd worden door te vergelijken met de passende versie van WCAG. Bij Dropsolid, doen we een uitgebreide audit van je website, gebruik makend van onze kennis rond toegankelijkheid en met hulp van automatische test-suites zoals Axe. Als we een website valideren of een audit uitvoeren, gebeurt de controle steeds door iemand die een opleiding volgde over toegankelijkheid (Bijvoorbeeld bij AnySurfer).

Het is belangrijk te weten dat test-suites geen allesomvattende oplossing vormen, daarom zijn manuele checks nodig. Context is belangrijk bij het toepassen van de richtlijnen en dit kan een automatisch systeem (nog) niet inschatten. Een zekere expertise is dus vereist om de regels correct toe te passen en de juiste prioriteiten te stellen.

Als je nog een stap verder wil, is het mogelijk om audits en rapporten te laten opstellen door individuen die een gespecialiseerde opleiding hebben gevolgd, bijvoorbeeld via het IAAP (International Association of Accessibility Professionals). Een site die door hen getest is (en slaagt), krijgt dan een certificaat. In België zijn er een aantal organisaties die dit soort professionals in huis hebben, waarvan Eleven Ways en AnySurfer de bekendste zijn. Als bijvoorbeeld iemand van AnySurfer je website positief evalueert, kan je een label in de footer van je site plaatsen, dat aan iedereen laat weten dat je site door hen getest is. Dit is geen must om toegankelijk te zijn, maar een externe validatie geeft soms wel extra vertrouwen.

Conclusie rond digitale toegankelijkheid

Niemand kan 100% van de tijd, 100% rekening houden met alle aspecten rond toegankelijkheid van een website. Zeker als het samengaat met tijd en budget. Gelukkig kunnen we wel veel goed doen zoals:

De WCAG-richtlijnen gebruiken als hulpmiddel.
Prioriteiten stellen en zaken aanpakken die de grootste impact hebben.
Vanaf begin deze prioriteiten en richtlijnen meenemen in het (bouw)process.
Je resultaat evalueren.

Bronnen

Statistics :

Hoe inclusief is jouw website?

Stel je digitale platforms open voor iedereen. Door de digitale toegankelijkheid te verbeteren, bereik je een breder publiek en laat je zien dat je je inzet voor inclusiviteit. Laten we eens kijken wat de potentiële voordelen hiervan zijn voor jouw bedrijf.

Bereken hoe inclusief jouw website is