Digitale toegankelijkheid hoeft niet lelijk te zijn
Voor veel mensen staat toegankelijk design gelijk aan lelijke websites. Er zijn meerdere redenen voor dit misverstand. Vroege webrichtlijnen voelden beperkend aan. De eerste versies van de Web Content Accessibility Guidelines (WCAG) werden in de late jaren negentig gepubliceerd, in een tijd dat webdesign technisch nog weinig flexibiliteit bood.
Ontwerpers associeerden toegankelijkheidseisen, zoals voldoende contrast, duidelijke focus, tekstalternatieven voor afbeeldingen, met de beperkingen van die vroege webtechnologie. Dat beeld is blijven hangen, ook al zijn HTML, CSS en JavaScript sindsdien ontzettend veel geëvolueerd.
Een andere oorzaak ligt in de fase in het ontwerpproces waarin toegankelijkheid wordt geïntroduceerd. Wanneer toegankelijkheid pas aan het einde van een ontwerpproces wordt meegenomen, levert het inderdaad visuele compromissen op: plotselinge kleurwijzigingen voor contrast, groot uitgevallen tekst die niet bij de lay-out past, of formulieren met extra labels die de interface ontsieren. Wie toegankelijkheid vanaf het begin integreert in het ontwerp, ervaart dit probleem niet. Daarnaast scheelt het veel tijd wanneer toegankelijkheid wordt meegenomen aan het begin van het ontwerpproces.
Angst voor regels remt creativiteit. Sommige ontwerpers zien WCAG als een checklist van verboden, in plaats van als een kader dat richting geeft aan goede ontwerpkeuzes. Maar de richtlijnen verbieden geen enkele stijlkeuze. Ze vragen om leesbaarheid, navigeerbaarheid en begrijpelijkheid, principes die in elk goed ontwerp al centraal staan.
Wat maakt een website mooi én toegankelijk?
Goede toegankelijkheid en goed design delen dezelfde fundamenten. Wie begrijpt wat een website écht mooi maakt, ziet direct de overlap met wat een website toegankelijk maakt.
Beweging en interactie met mate
Animaties en micro-interacties maken een website levendiger. Vanuit de WCAG zijn er bepaalde eisen waar je rekening mee moet houden. Zo mag een video of animatie niet automatisch afspelen, mits deze niet gepauzeerd kan worden. Er is binnen de criteria van de WCAG dus voldoende ruimte om wél animaties toe te passen.
Daarnaast is het belangrijk dat een video of animatie niet vaker dan drie keer per seconde flitst. Dit kan gevaarlijk zijn voor bezoekers met epilepsie. Houd hier dus rekening mee bij het maken of laten maken van animaties en video’s.
Video’s met ondertiteling of transcript
Veel organisaties laten video volledig weg op toegankelijk websites. Dit is vooral omdat het veel tijd kost om video achteraf toegankelijk te maken. Wanneer je bij het produceren van de video’s rekening houdt met ondertiteling of een audiodescriptie, valt het extra werk heel erg mee. Zo kunnen de video’s ook begrepen worden door bezoekers met een visuele- of auditieve functiebeperking. Ook wanneer je in de trein of op kantoor de video kijkt zonder geluid mis je geen informatie.
Typografie met karakter én contrast
Een sterk typografisch systeem, met een duidelijke hiërarchie, passende regelafstand en voldoende kleurcontrast, is zowel esthetisch als functioneel. Een duidelijke koppenstructuur helpt bezoekers die de website zien, maar vooral degene die deze laten oplezen via een schermlezer. Zo help je alle bezoekers verder.
De WCAG schrijft een minimale contrastverhouding voor van 4,5:1 voor gewone tekst. Dat is geen belemmering, de beste typografie werkt altijd met sterke contrasten. Daarnaast is de tekst nu ook goed leesbaar voor bezoekers die bijvoorbeeld in de zon naar je website kijken, niet alleen voor slechtzienden.
Formulieren die voor iedereen werken
Formulieren zijn vaak het moment waarop een bezoeker actie onderneemt, zoals contact opnemen, een afspraak maken of een aanvraag indienen. Een toegankelijk formulier heeft duidelijke labels, logische veldvolgorde en herkenbare knoppen. Gebruik daarom niet alleen placeholders in invulvelden, omdat deze verdwijnen zodra iemand begint te typen. Een vast label maakt altijd duidelijk welke informatie gevraagd wordt.
Ook foutmeldingen moeten duidelijk en behulpzaam zijn. Alleen een rode rand om een veld is niet genoeg, omdat niet iedereen kleur op dezelfde manier waarneemt. Beschrijf concreet wat er misgaat en hoe de bezoeker dit kan oplossen. Wanneer een formulier daarnaast volledig met het toetsenbord te bedienen is en goed wordt voorgelezen door schermlezers, wordt het formulier toegankelijker én gebruiksvriendelijker voor iedereen.
Ruimte en structuur
Witruimte, duidelijke secties en een logische informatiestructuur zijn kenmerken van modern minimalistisch design. Ze zijn ook precies wat toegankelijkheid vraagt: een heldere visuele hiërarchie die ook door schermlezers correct wordt geïnterpreteerd. Hier doe je alle bezoekers van je website een plezier mee.
Het voordeel van toegankelijkheid voor SEO en GEO
Digitale toegankelijkheid levert niet alleen ethische en juridische voordelen op. Het heeft ook een directe positieve invloed op vindbaarheid, zowel in traditionele zoekmachines (SEO) als in de opkomende wereld van generatieve zoekmachines en AI-gestuurde antwoorden (GEO: Generative Engine Optimization).
Toegankelijke websites gebruiken correcte HTML-structuren: koppen met de juiste hiërarchie (h1 tot h6), betekenisvolle linkteksten, beschrijvende alt-teksten bij afbeeldingen en duidelijke paginatitels. Dit zijn precies de signalen waarop zoekmachines navigeren om content te indexeren en te begrijpen. Wat goed leesbaar is voor een schermlezer, is goed leesbaar voor een crawler.
Generatieve AI-systemen zoals Google’s AI Overviews en ChatGPT Search halen informatie op uit webpagina’s. Ze geven de voorkeur aan pagina’s met een heldere structuur, begrijpelijke taal en duidelijk afgebakende antwoorden op vragen, opnieuw kenmerken die samenvallen met toegankelijkheidseisen. Een toegankelijke website is daarmee ook beter gepositioneerd om geciteerd te worden in AI-gegenereerde antwoorden.
Lagere bounce rate, hogere gebruikerstevredenheid. Toegankelijke websites zijn eenvoudiger te gebruiken voor een bredere groep mensen. Dat resulteert in langere sessies, minder afhakers en meer interactie, gedragssignalen die indirect bijdragen aan betere organische rankings.
Voorbeelden van mooie digitaal toegankelijke websites
De volgende websites laten zien dat digitale toegankelijkheid en aantrekkelijk ontwerp goed samen kunnen gaan. De voorbeelden zijn bedoeld als inspiratie. De genoemde toegankelijkheidsinformatie is gebaseerd op de beschikbare verklaringen en bronnen op het moment van raadpleging.
Een website kan vandaag volledig voldoen aan de geldende normen en na een redesign, een nieuwe plug-in of een contentupdate alsnog problemen bevatten. De onderstaande voorbeelden dienen daarom als inspiratie, niet als een harde garantie dat alles op elk moment en in elk opzicht volledig voldoet.
1. Patagonia
Patagonia is een sterk voorbeeld van een merkwebsite waarbij visuele identiteit en toegankelijkheid naast elkaar bestaan. De website gebruikt grote fotografie, uitgesproken merktaal en een herkenbare outdoor-uitstraling. Tegelijkertijd publiceert Patagonia een eigen toegankelijkheidsverklaring waarin het bedrijf aangeeft zich te committeren aan digitale toegankelijkheid voor iedereen.
In die verklaring staat dat Patagonia conformiteit nastreeft met WCAG 2.1 op niveau A en AA en rekening houdt met ADA-eisen voor effectieve communicatie en andere toepasselijke regelgeving.
Interessant aan Patagonia is dat toegankelijkheid hier niet tegenover merkbeleving staat. De website voelt niet administratief of uitgekleed. Beeld, verhaal, productinformatie en activistische merkpositionering blijven een duidelijke rol spelen. Dat maakt Patagonia een goed voorbeeld voor organisaties die bang zijn dat toegankelijkheid hun merkidentiteit verzwakt.
2. BeweegRoute Hoorn
Beweegroute Hoorn is een Nederlands voorbeeld waarbij toegankelijkheid, publieke informatie en een frisse visuele presentatie samenkomen. De website is gericht op bewegen in de openbare ruimte en moet begrijpelijk zijn voor een brede doelgroep. Daarnaast valt de website als overheidswebsite onder het Besluit Digitale Toegankelijkheid Overheid. In het dashboard van DigiToegankelijk is te zien dat de website een A-status heeft, wat betekent dat er tijdens het toegankelijkheidsonderzoek geen fouten zijn gevonden.
Het ontwerp maakt gebruik van heldere kleurcontrasten, overzichtelijke kaartfunctionaliteit en een intuïtieve structuur die ook op mobiel prettig werkt. Juist voor dit type informatieve website, gericht op een breed publiek met uiteenlopende digitale vaardigheden, is toegankelijkheid geen bijzaak, maar de kern van het ontwerp.
3. DEN (Digitaal Erfgoed Nederland)
DEN, Kennisinstituut Cultuur & Digitale Transformatie, laat zien dat ook kennisplatforms en culturele organisaties toegankelijk én aantrekkelijk kunnen zijn. De website heeft een redactionele uitstraling, met ruimte voor artikelen, kennis, projecten en verdieping. Ook deze site heeft volgens een toegankelijkheidsonderzoek een A-status.
Dit voorbeeld is relevant omdat culturele en kennisorganisaties vaak veel content publiceren. Juist dan is structuur belangrijk. Goede koppen, duidelijke navigatie, begrijpelijke teksten en toegankelijke componenten maken het verschil tussen een website die alleen mooi oogt en een website die ook echt bruikbaar is.
4. NASA
NASA’s website is een van de meest bezochte overheidssites ter wereld en combineert spectaculaire ruimtefotografie met een uitgebreid informatieaanbod. Volgens de eigen toegankelijkheidsverklaring conformeert de site aan WCAG 2.0 niveau AA.
NASA laat zien dat toegankelijkheid ook samen kan gaan met een indrukwekkende visuele wereld. Ruimtevaart, wetenschap en technologie vragen om sterke beelden, video’s, data en verhalen. Toch hoeft dat niet te betekenen dat toegankelijkheid op de achtergrond raakt.
NASA is vooral interessant als voorbeeld omdat de website werkt met veel soorten content: nieuws, beeldmateriaal, missies, educatie, video en wetenschappelijke informatie. Dat maakt de toegankelijkheidsopgave complexer, maar ook belangrijker. Hoe rijker de content, hoe belangrijker het is dat bezoekers meerdere manieren krijgen om die content te begrijpen en te gebruiken.