Hoe toegankelijk is jouw website? (+ 3 tips!)

Is jouw website toegankelijk voor mensen met een beperking? Voor blinden en slechtzienden, bijvoorbeeld? Of weet je dat niet?

Ik weet zeker dat mijn blog niet “100% toegankelijk” is, maar ik doe mijn best om dat percentage steeds verder op te krikken. Hoe? Nou, bijvoorbeeld door hierop te letten:

1. Kies voor contrasterende kleuren

Zorg ervoor dat het contrast tussen tekst en achtergrond groot genoeg is. Dat geldt natuurlijk voor de standaard tekst- & achtergrondkleur van je website, maar vergeet de kleur van je links niet, en de kleuren die je gebruikt voor tekstvakken en eventuele (menu-)balken.

Niet alleen slechtzienden maak je daar blij mee, maar ook mensen met bepaalde vormen van kleurenblindheid.

Hoe bereken je de contrastverhouding tussen twee HTML-kleuren? Met een contrast-tool, zoals de Luminosity Colour Contrast Ratio Analyser.

Volgens de Web Content Accessibility Guidelines (WCAG) is een contrastverhouding van tenminste 4,5:1 toegankelijk genoeg voor normale tekst, en een verhouding van minstens 3:1 voor grote tekst.

Om een voorbeeld te geven: mijn menubalk had twee jaar geleden deze kleur (#01A9A9), met een witte tekst (#fff) eroverheen. De contrastverhouding van deze combinatie is blijkbaar te laag (2,9:1). Daarom heb ik de menubalk donkerder gemaakt.

Een goed contrast is belangrijk, maar overdrijf niet. Een extreem hoge contrastverhouding – tussen puur zwart en wit bijvoorbeeld – leest voor veel mensen ook niet prettig.

2. Gebruik beschrijvende links

Er bestaat software die snel alle links in een tekst verzamelt. Dat is een handig hulpmiddel als je niet met je ogen een tekst kunt scannen. Maar van een link zoals “deze website” of “klik hier” word je dan natuurlijk niet veel wijzer.

Probeer daarom altijd linkteksten te schrijven die beschrijvend zijn, oftewel die vertellen waar de link naartoe leidt.

Dus niet “ik vind deze website informatief”, maar “ik vind deze website over toegankelijkheid informatief”.

Over wat een beschrijvende link is (en wat niet) bestaat geen regel. Het beste wat je kunt doen, is jezelf bij elke link die je plaatst de vraag stellen: “Begrijp ik – zonder de context eromheen (tekst en/of afbeeldingen) – waar deze link heen leidt?”

Dat is trouwens niet alleen fijn voor blinden en slechtzienden. Ook Google hecht meer waarde aan beschrijvende links. Twee vliegen in één klap dus!

3. Gebruik (de juiste) kopjes

Nog eentje waarmee zowel de toegankelijkheid van je website als je “Google-ranking” vooruitgaat: het gebruik van duidelijke, beschrijvende kopjes.

Voor mensen die langzamer lezen, of die een beperkt kortetermijngeheugen hebben, is het fijn als de koppen in een tekst wat houvast bieden. En net zoals er software bestaat die de links uit een tekst filtert, bestaat er ook (voorlees)software die een lijst met koppen kan samenstellen. Om het navigeren makkelijker te maken.

Maarrrrr dan moeten die koppen wel beschrijvend zijn, en qua opbouw kloppen. Dus één H1-kop bovenaan de tekst, H2-koppen die de tekst in paragrafen verdelen, en H3-koppen (en verder) voor eventuele subparagrafen.

De kopjes van deze blogpost zien er bijvoorbeeld zo uit:

• [H1] Hoe toegankelijk is jouw website? (+ 3 tips)
  • [H2] Tip 1: kies voor contrasterende kleuren
  • [H2] Tip 2: gebruik beschrijvende links
  • [H2] Tip 3: gebruik (de juiste) kopjes
  • [H2] Meer weten over toegankelijkheid?

Als er onder een H2 veel informatie zou staan, dan gebruik ik H3-kopjes om de tekst verder op te delen. Maar meestal is dat niet nodig.

Meer weten over toegankelijkheid?

Deze drie tips vormen nog maar het topje van de ijsberg. En ik weet er wel iets vanaf, maar ik ben zeker geen expert.

De Nederlandse overheid heeft een website – www.digitoegankelijk.nl – waarop helder wordt uitgelegd aan welke toegankelijkheidseisen overheidswebsites en -apps moeten (gaan) voldoen. Die eisen gelden waarschijnlijk niet voor jouw website, maar je mag de informatie natuurlijk wel gewoon gebruiken. Een betere wereld begint bij jezelf!

Benieuwd hoe je website nu scoort? Via WebAIM – Website Accessibility in Mind – kun je gratis de toegankelijkheid van je website checken (één pagina per keer). Deze check kijkt vooral naar de structuur en de opmaak van je website. WebAIM controleert niet of je links beschrijvend zijn, of je video’s ondertiteling bevatten, enzovoorts.

En WordPress biedt een aantal thema’s die “accessibility ready” zijn. Als je zo’n thema gebruikt, is de structuur van je website in elk geval toegankelijk. Voor de inhoud ben je natuurlijk zelf verantwoordelijk.

Dus. Hoe toegankelijk is jouw website?

P.S.: Als jij je vlogs of podcasts van ondertiteling voorziet, dan stuur ik nu wat instant liefde jouw kant op. <3

P.P.S.: Tips voor de verbetering van mijn website? Laat het me weten!

---

Foto: “Stairs” van Guillaume Laurent, licentie CC BY-NC-SA 2.0