Webdeveloper
- Home /
- Categories /
- Webdeveloper
Logo in een h1-tag? Waarom dit fout is voor SEO en a11y
Waarom je logo niet in een h1-tag hoort: de geschiedenis van een hardnekkige fout Het is 2026. We bouwen apps met React Server Components, we deployen naar edge networks, we optimaliseren voor Core Web Vitals. En toch — toch — zie ik nog steeds websites waar het logo in een <h1> zit.
Lees meer over Logo in een h1-tag? Waarom dit fout is voor SEO en a11yAccessibility Tree in Chrome: Installatie & Interpretatie Gids [2026]
Accessibility Tree in Chrome: Installatie en Interpretatie Wat is de Accessibility Tree? De Accessibility Tree is een representatie van de webpagina die door hulpsoftware (zoals schermlezers) wordt gebruikt. Het is een vereenvoudigde versie van de DOM-tree die alleen toegankelijkheidsrelevante informatie bevat.
Lees meer over Accessibility Tree in Chrome: Installatie & Interpretatie Gids [2026]Native HTML-componenten en kleurcontrast volgens WCAG 2.1
Native HTML-componenten en kleurcontrast volgens WCAG 2.1 Informatieve en interactieve interface-elementen zoals knoppen, selectievakken en schuifregelaars moeten voldoende contrast hebben zodat ze zichtbaar zijn voor alle bezoekers. In de praktijk roept dit vaak vragen op bij audits en code-reviews: moet ik het kleurcontrast van elk zichtbaar UI-element controleren en verbeteren?
Lees meer over Native HTML-componenten en kleurcontrast volgens WCAG 2.1Submenu dichtklappen
Toetsenbordfocus moet logisch zijn Als bezoekers met het toetsenbord door de website navigeren, moeten interactieve elementen zoals knoppen en links op een logische volgorde toetsenbordfocus krijgen. Logisch betekent dat het aansluit op de volgorde die de elementen hebben in de visuele vormgeving. Anders kunnen bezoekers die alleen een toetsenbord gebruiken, minder makkelijk door de pagina navigeren.
Lees meer over Submenu dichtklappenAutomatisch toepassen van huisstijlkleuren in software: contrastproblemen voorkomen
Sommige softwareleveranciers die SAS-achtige platforms aan meerdere klanten aanbieden, bieden de mogelijkheid om de interface automatisch te stylen. Dit gebeurt dan op basis van de huisstijl van de klant.Vaak wordt hiervoor het kleurenpalet uit het logo van de organisatie gebruikt. Hoewel dit op het eerste gezicht logisch en efficiënt lijkt, brengt deze aanpak een belangrijk risico met zich mee. Het gaat daarbij om onvoldoende kleurcontrast van tekst, wat direct invloed heeft op de digitale toegankelijkheid.
Lees meer over Automatisch toepassen van huisstijlkleuren in software: contrastproblemen voorkomenHoe verwijder ik de melding ‘Google vragen over dit bericht’ – en waarom zou je dat willen?
Als je regelmatig digitale toegankelijkheid test, dan weet je hoe onmisbaar de Tab-toets is. Het is dé manier om snel te controleren of een website met alleen het toetsenbord te bedienen is. Tijdens onze audits zeg ik het altijd: wat niet met de Tab-toets bereikbaar is, is ook niet bereikbaar voor veel hulpsoftware.
Lees meer over Hoe verwijder ik de melding ‘Google vragen over dit bericht’ – en waarom zou je dat willen?Hoe test je elementen die op hover, focus of klik verschijnen (en meteen weer verdwijnen)?
Sommige UI-elementen verschijnen alleen kort — bijvoorbeeld vensters, dropdowns of menus die op hover of focus zichtbaar worden. Die kunnen interactieve onderdelen bevatten die je moet testen op toegankelijkheid. Denk aan:
Lees meer over Hoe test je elementen die op hover, focus of klik verschijnen (en meteen weer verdwijnen)?Hoe test ik focus zichtbaarheid
Hoe test ik SC 2.4.7 - Focus zichtbaarheid Navigeer met het toetsenbord door alle elementen op de pagina die focus kunnen krijgen.
Lees meer over Hoe test ik focus zichtbaarheidHoe test ik focusvolgorde?
Hoe te testen WCAG SC 2.4.3 - Focusvolgorde: Klik in de adresbalk van de browser. Gebruik de Tab toets om te navigeren en Shift Tab om terug te navigeren.
Lees meer over Hoe test ik focusvolgorde?Hoe toegankelijk is het `<dl>`-element?
Wil je op een webpagina een relatie tussen termen en definities presenteren, dan ligt het gebruik van het <dl>-element voor de hand. Het bestaat uit een container (<dl>) waarin je per term een <dt> (definition term) gebruikt, gevolgd door een <dd> (definition description). Je ziet dit veel terug in juridische teksten, woordenlijsten of bij gegevens die in een tabel lay-out worden gepresenteerd, zoals openingstijden:
Lees meer over Hoe toegankelijk is het `<dl>`-element?Hoe geef ik een applicatie een accessible name?
Beginsituatie: er is een element met role="application" en het heeft geen toegankelijkheidsnaam (accessible name). Hoe kun je dit oplossen?
Lees meer over Hoe geef ik een applicatie een accessible name?Accessible name: wat moet je weten
Bij Proper Access beginnen we al onze trainingen voor webdevelopers met iets dat simpel lijkt, maar reuze belangrijk is. Want wat moet je nou absoluut weten over digitale toegankelijkheid? Als ik je als ontwikkelaar een tip mag geven: dat is begrijpen hoe je de toegankelijke naam (accessibility name) van een interactief element gebruikt.
Lees meer over Accessible name: wat moet je wetenMeerdere knoppen met dezelfde naam
Update 25 jan 2026 Uit ons recent onderzoek met een blinde collega is gebleken dat de meeste mensen liever van kop naar kop navigeren. In plaats van verborgen tekst aan de knop toe te voegen, kun je er voor zorgen dat de naam van een product als een kop is gemarkeerd.
Lees meer over Meerdere knoppen met dezelfde naamToegankelijkheidslabel ontoegankelijk plaatsen (doe dat niet!)
Wanneer je een toegankelijkheidsverklaring hebt opgesteld, kun je een label ophalen dat je op je website kunt plaatsen om de status van je website te tonen. Je vindt het label op deze pagina: https://www.toegankelijkheidsverklaring.nl/verklaringen
Lees meer over Toegankelijkheidslabel ontoegankelijk plaatsen (doe dat niet!)Een toegankelijk iframe
Waar moet je opletten als je een iframe digitaal toegankelijk wil toevoegen aan een webpagina? De WCAG stelt een aantal eisen aan de implementatie van een iframe. Dit zijn de kritieke punten.
Lees meer over Een toegankelijk iframe