Je website toegankelijker maken: 5 praktische controles
Je website toegankelijker maken begint met een eenvoudige vraag: kan een bezoeker zelfstandig vinden, lezen en gebruiken wat je aanbiedt? Een fraaie homepage helpt weinig als iemand het menu niet kan bedienen of de tekst niet kan vergroten. Voor ondernemers is toegankelijkheid daarom een praktisch onderdeel van een bruikbare bedrijfswebsite.
Je hoeft niet meteen je hele website te vervangen. Begin met de pagina’s die belangrijk zijn voor je klanten: je diensten, informatie over je werkwijze en de stap naar contact. Met onderstaande controles ontdek je waar aandacht nodig is en kun je verbeteringen gericht bespreken met je webbouwer.
1. Doorloop je website zonder muis
Open je homepage en leg de muis even aan de kant. Gebruik Tab om tussen links en knoppen te bewegen, Shift+Tab om terug te gaan en Enter om een link te openen. Kijk of je het hoofdmenu, belangrijke knoppen en eventuele pop-ups kunt bereiken. Test ook of je een geopend venster weer kunt sluiten.
Bij iedere stap moet zichtbaar zijn welk onderdeel geselecteerd is. Dat kan bijvoorbeeld met een duidelijke rand rond een link. Verdwijnt die markering, dan wordt navigeren al snel gokken. Een menu dat alleen verschijnt wanneer je er met de muis overheen gaat, verdient eveneens aandacht. W3C legt uit waarom zichtbare toetsenbordfocus belangrijk is voor mensen die met het toetsenbord navigeren.
Noteer de pagina en de handeling waarbij je vastloopt. “Het submenu opent niet met het toetsenbord” is voor een ontwikkelaar veel bruikbaarder dan “het menu werkt niet goed”. Bij aanpassingen aan bestaande onderdelen kan een WordPress developer de bediening en de techniek samen beoordelen.
2. Controleer leesbaarheid en vergroten
Bekijk je teksten op een telefoon én op een computer. Zijn de alinea’s overzichtelijk? Valt de tekst voldoende op tegen de achtergrond? Let vooral op lichtgrijze tekst, tekst over foto’s en knoppen met een subtiele kleur. Wat op jouw scherm prettig lijkt, kan in andere omstandigheden moeilijk leesbaar zijn.
Vergroot de pagina vervolgens in je browser, bijvoorbeeld naar 200 procent. Controleer of teksten, navigatie en knoppen bruikbaar blijven. Kijk of een vaste balk belangrijke informatie bedekt en of tekst buiten een kader verdwijnt. Je test hiermee een concrete gebruikerssituatie; een mooi ontwerp op de oorspronkelijke grootte vertelt nog niet hoe de pagina bij vergroting werkt.
Laat twijfelachtige kleurcombinaties nameten en leg problemen met afgesneden inhoud vast met een screenshot. Verander kleuren bij voorkeur in de algemene stijlinstellingen. Zo verbeter je meerdere pagina’s tegelijk en voorkom je dat iedere pagina een andere oplossing krijgt.
3. Geef koppen en links een duidelijke betekenis
Een pagina moet ook zonder uitgebreid lezen begrijpelijk zijn. Gebruik koppen die vertellen waar de volgende alinea’s over gaan. “Onze aanpak voor jouw bedrijfswebsite” geeft meer richting dan “Meer informatie”. Maak het verschil tussen hoofdonderwerpen en subonderwerpen duidelijk.
In WordPress betekent dit dat je echte kopblokken gebruikt, met een logisch niveau. Alleen een alinea vet maken en groter zetten levert geen kopstructuur op. Volgens de W3C-uitleg over koppen helpt die structuur ook hulpmiddelen om door een pagina te navigeren.
Bekijk daarnaast je linkteksten. Meerdere links met “klik hier” zijn lastig van elkaar te onderscheiden. Benoem liever de bestemming, zoals “bekijk onze onderhoudsdiensten”. Dat maakt je pagina ook voor scannende bezoekers overzichtelijker. Neem deze afspraken mee wanneer je een nieuwe WordPress website laat maken.
4. Bekijk afbeeldingen vanuit hun functie
Open in de mediabibliotheek de afbeeldingen op je belangrijkste pagina’s. Vraag per afbeelding wat iemand mist als die afbeelding niet zichtbaar is. Bij een productfoto kan dat een kenmerk zijn; bij een grafiek kan het juist de uitkomst zijn. Geef informatieve afbeeldingen een passende alternatieve tekst die hun functie in die context duidelijk maakt.
Een decoratieve afbeelding vraagt een andere aanpak. W3C adviseert voor zulke afbeeldingen een leeg alt-attribuut, zodat voorleessoftware ze kan overslaan. Een bestandsnaam of een verzameling zoekwoorden is geen nuttige vervanging. Kijk ook of belangrijke informatie uitsluitend in een afbeelding staat. Een telefoonnummer of aanbieding hoort daarnaast als gewone tekst beschikbaar te zijn.
5. Maak van je bevindingen een werkbare verbeterlijst
Probeer niet alles in één middag op te lossen. Kies eerst drie belangrijke pagina’s en noteer per probleem de locatie, wat er gebeurt en welke handeling daardoor moeilijk wordt. Zet blokkades bovenaan: een onbereikbaar menu heeft meestal meer urgentie dan een wat onhandige formulering.
Spreek vervolgens af wie de inhoud aanpast en wie de technische wijzigingen uitvoert. Test na iedere wijziging dezelfde handeling opnieuw. Controleer terugkerende onderdelen, zoals het menu, ook op andere pagina’s. Laat deze aandacht terugkomen bij nieuwe content en bij WordPress onderhoud, zodat verbeteringen behouden blijven.
Je website toegankelijker maken: begin met één klantreis
Kies een herkenbare route: van de homepage naar een dienst en vervolgens naar de mogelijkheid om contact op te nemen. Doorloop die route met het toetsenbord, met vergrote weergave en op je telefoon. Dat levert een concreet startpunt op om drempels weg te nemen.
Deze controles vormen een eerste verkenning. Zoals W3C aangeeft bij de Easy Checks, kunnen er ook na zulke checks toegankelijkheidsproblemen overblijven. Voor een volledige beoordeling is uitgebreider onderzoek nodig. DSG WEB kan helpen bij het onderzoeken en aanpassen van je WordPress website. Begin met de onderdelen die jouw bezoekers dagelijks gebruiken en bouw van daaruit verder.