Ontwerp

Ontwerp is essentieel voor de toegankelijkheid. Kleur, vorm en plaatsing van elementen bepalen niet alleen hoe de pagina eruitziet, maar ook hoe de boodschap overkomt. Niet iedereen kan deze visuele informatie goed zien of begrijpen. Zorg voor voldoende contrast en geef alternatieve manieren om dezelfde informatie over te brengen. Zo wordt je ontwerp toegankelijk voor iedereen.

  • Genoeg contrast tussen twee kleuren is van belang voor mensen die niet goed kunnen zien. Het helpt om het verschil tussen kleuren beter te zien.

    De richtlijnen vereisen voor deze onderdelen een contrastverhouding van ten minste 3:1 tegen alle aangrenzende kleuren. Het kan dus zijn dat een contrast op meerdere plekken gemeten moet worden.

    Formulierelementen

    Formulierelementen, zoals invoervelden, keuzerondjes en selectievakjes moeten genoeg contrast hebben. Zorg voor een duidelijke rand of een achtergrondkleur met voldoende contrast. Ook de verschillende statussen van deze elementen moeten genoeg contrast hebben. Het moet duidelijk zijn of een keuzerondje of selectievakje is geselecteerd of juist niet.

    Iconen

    Informatieve iconen en iconen die ook worden gebruik als link of knop moeten genoeg contrast hebben.

    Grafieken en diagrammen

    Ook onderdelen in grafieken en diagrammen moeten genoeg contrast hebben. Denk hierbij aan de lijnen in een grafiek en de onderdelen in een diagram.

  • Genoeg contrast tussen twee kleuren is van belang voor mensen die niet goed kunnen zien. Het helpt om het verschil tussen kleuren beter te zien.

    De contrastverhouding voor tekst moet voldoen aan minimaal:

    • 4,5:1 voor tekst die kleiner is dan 24px of 18,5px vetgedrukt.
    • 3:1 voor tekst die groter is dan 24px of 18,5px vetgedrukt.

    Deze contrasteisen gelden ook voor tekst op afbeeldingen.

    Let op: De contrastverhoudingen worden niet afgerond. Als een contrastverhouding van minimaal 4,5:1 is vereist, dan is 4,49:1 dus nog niet genoeg.

    Er zijn tools die kunnen helpen bij het berekenen van de contrastverhouding. Bijvoorbeeld de contrast checker op de website van WebAIM of de Colour Contrast Analyser (software) van The Paciello Group.

  • Kleur kan helpen om eenvoudig informatie over te brengen, een actie aan te geven, tot een reactie op te roepen of een visueel element te onderscheiden, maar het mag niet de enige manier zijn. Mensen met een visuele beperking kunnen informatie die alleen met kleur worden aangegeven niet (of niet goed) onderscheiden.

    Gebruik ook andere manieren, zoals met tekst of een icoon.

  • Navigatiemenu’s en onderdelen die op meerdere webpagina’s voorkomen, moeten telkens in dezelfde volgorde worden geplaatst. Zorg dat deze volgorde zowel in de vormgeving als in de code hetzelfde is.

    Een consistente navigatie- en paginastructuur maakt het voor iedereen makkelijker om te navigeren door de website en informatie op een pagina te vinden. Ook bezoekers die gebruik maken van schermlezers kunnen hierdoor sneller en efficiënter hun weg vinden.

Heb je nog vragen?

Wil je weten hoe jouw website ervoor staat met betrekking tot digitale toegankelijkheid? Of heb je vragen over onze dienstverlening?

Neem contact op

Vergroot je bereik

Digitale toegankelijkheid vergroot de gebruiksvriendelijkheid, vindbaarheid en compatibiliteit.

Succescriteria

  • Principe 1. Waarneembaar
    • Richtlijn 1.4 Onderscheidbaar
      • 1.4.1 Gebruik van kleur
      • 1.4.3 Contrast (minimum)
      • 1.4.11 Contrast van niet-tekstuele content
  • Principe 3. Begrijpelijk
    • Richtlijn 3.2 Voorspelbaar
      • 3.2.3 Consistente navigatie

Thema’s

Afbeeldingen

Websites bevatten vaak meer dan alleen tekst, zoals foto’s, pictogrammen en andere afbeeldingen. Om deze afbeeldingen toegankelijk te maken voor iedereen, is het belangrijk om een tekstalternatief toe te voegen. Schermlezer, zoals voorleessoftware en brailleleesregels, kunnen dit tekstalternatief gebruiken om de afbeelding begrijpelijk te maken voor mensen die de afbeelding zelf niet kunnen zien.

Bediening

Een website moet gemakkelijk te bedienen zijn voor iedereen. Veel mensen gebruiken een muis en toetsenbord, maar niet iedereen kan dat even goed. Mensen met motorische beperkingen of blinde/slechtziende bezoekers hebben soms moeite met het gebruik van een muis. Zorg er daarom voor dat alle functionaliteit ook alleen met het toetsenbord te bedienen is.

Formulieren

Formulieren worden gebruikt om informatie in te vullen of te verzamelen. Om formulieren toegankelijk te maken, moet je letten op de techniek, vormgeving en tekst. Zorg dat formulier volledig met het toetsenbord te bedienen is. Gebruik duidelijke labels voor de invoervelden en geef heldere foutmeldingen als er iets misgaat. Zo wordt het invullen makkelijk voor iedereen, ook voor mensen die hulptechnolgieën gebruiken.

Media

Mediabestanden zoals geluidsfragmenten en filmpjes kunnen informatie op een snelle en makkelijke manier overbrengen. Maar deze media moeten ook toegankelijk zijn voor mensen die niet kunnen horen of zien. Bijvoorbeeld, mensen die doof of slechthorend zijn, hebben ondertitels of een transcript nodig. En blinde of slechtziende bezoekers kunnen een gesproken audiodescriptie gebruiken. Zorg er daarom altijd voor dat er alternatieve opties beschikbaar zijn, zodat alle bezoekers de mediabestanden goed kunnen gebruiken. Let op: In Nederland geldt een uitzondering voor media die vóór 23 september 2020 is gepubliceerd. Ook live media hoeft niet direct toegankelijk te zijn. Als het na de uitzending online blijft staan of ergens opnieuw wordt gepubliceerd, dan moet het wel toegankelijk worden gemaakt.

Navigatie

Goed kunnen navigeren is belangrijk voor het vinden van informatie. Een duidelijke en logische indeling van de pagina helpt daarbij. Skiplinks en duidelijke titels en linkteksten maken het makkelijker om door de website te navigeren. Zorg dat het navigeren voor iedereen toegankelijk is, zodat iedereen de inhoud kan vinden.

Ontwerp

Ontwerp is essentieel voor de toegankelijkheid. Kleur, vorm en plaatsing van elementen bepalen niet alleen hoe de pagina eruitziet, maar ook hoe de boodschap overkomt. Niet iedereen kan deze visuele informatie goed zien of begrijpen. Zorg voor voldoende contrast en geef alternatieve manieren om dezelfde informatie over te brengen. Zo wordt je ontwerp toegankelijk voor iedereen.

Tekst

Tekst is de meest toegankelijke vorm van digitale informatie. Een duidelijke structuur is belangrijk voor de toegankelijkheid van een tekst. Gebruik koppen, tussenkoppen en opsommingen om structuur aan te brengen. Deze structuur moet goed in de code van de website worden vastgelegd. De inhoud moet begrijpelijk zijn en in een logische volgorde gepresenteerd worden.