De zeven Universal Design principes

Wat is Universal Design?

Iedereen moet het internet kunnen gebruiken, ook mensen met een beperking. De Web Content Accessibility Guidelines (WCAG) bieden hiervoor een uitgebreid kader, maar soms is het goed om verder te kijken dan alleen websites. 

Universal Design is zo’n breder concept, bedacht door Ronald Mace en zijn team. Door de zeven basisprincipes van Universal Design toe te passen op website-ontwikkeling, creëren designers en developers sites die niet alleen toegankelijk zijn, maar ook gebruiksvriendelijker en aantrekkelijker zijn voor alle gebruikers.

In dit artikel duiken we in de zeven principes van Universal Design en geven we praktische tips over hoe designers en developers deze kunnen implementeren. Zo bouwen we samen aan een internet dat echt voor iedereen werkt!

Zet Universal Design principes in om de digitale toegankelijkheid te verbeteren

Universele ontwerpprincipes zorgen ervoor dat uw website toegankelijk is voor alle gebruikers, inclusief mensen met een visuele, auditieve, motorische of cognitieve beperking. De zeven belangrijkste principes van Universal Design laten zien hoe site-eigenaren, ontwerpers en ontwikkelaars ervoor kunnen zorgen dat hun sites aan deze principes voldoen.

Gelijkwaardig gebruik

Het eerste principe van toegankelijk webdesign is ‘gelijkwaardig gebruik’. Dit betekent dat het ontwerp nuttig en bruikbaar moet zijn voor mensen met verschillende mogelijkheden. Ontwerpers moeten ervoor zorgen dat alle onderdelen van de website bruikbaar zijn voor alle bezoekers, ongeacht hun beperking.

Om ervoor te zorgen dat je website voor iedereen toegankelijk is, zijn er een paar dingen waar je als ontwerper op moet letten:

• Alternatieve tekst voor afbeeldingen en video’s: Bied altijd alternatieve tekst voor afbeeldingen (“alt-tekst”) en video’s aan. Zo kunnen mensen met een visuele beperking, die een screenreader gebruiken, toch begrijpen wat er op de afbeelding of in de video te zien is.
• Navigatie met muis én toetsenbord: Zorg ervoor dat alle onderdelen van je website te bedienen zijn met zowel een muis als een toetsenbord. Dit is belangrijk voor mensen die moeite hebben met het gebruiken van een muis.
• Voldoende kleurcontrast: Gebruik voldoende contrast tussen de tekstkleur en de achtergrondkleur. Zo kunnen mensen met kleurenblindheid of andere visuele beperkingen de tekst goed lezen. Kies bijvoorbeeld voor een donkere tekst op een lichte achtergrond.
• Kleur is niet genoeg: Gebruik kleur niet als enige manier om informatie over te brengen. Als een formulier bijvoorbeeld niet goed is ingevuld, geef dit dan niet alleen aan met een rode rand. Gebruik ook tekst of icoontjes om de foutmelding duidelijk te maken.

Flexibiliteit in gebruik

Dit principe draait om het aanpassen van het ontwerp aan verschillende voorkeuren en mogelijkheden. Het gaat erom dat gebruikers op hun eigen manier met je website kunnen omgaan.

Hier zijn een paar dingen om in gedachten te houden:

• Tekstgrootte aanpassen: Zorg ervoor dat gebruikers de tekstgrootte kunnen aanpassen zonder dat de website raar gaat doen. Zo kunnen mensen met een visuele beperking de tekst groter maken, zodat ze hem beter kunnen lezen.
• Geen automatisch afspelen: Gebruik geen automatische weergave voor video’s of audio, vooral niet als ze langer dan 5 seconden duren. Geef gebruikers liever de controle met afspeelknoppen.
• Geen sliders of automatisch scrollen: Vermijd het gebruik van sliders en automatisch scrollen. Sommige gebruikers hebben misschien meer tijd nodig om de informatie te lezen.

Het doel is om gebruikers de vrijheid te geven om op hun eigen manier met je website te werken. Door flexibiliteit in je ontwerp te prioriteren, creëer je een gebruiksvriendelijke omgeving die aan verschillende behoeften en voorkeuren voldoet.

Duidelijkheid

Dit principe benadrukt hoe belangrijk het is om ontwerpen te maken die gemakkelijk te begrijpen en te gebruiken zijn. Het zou niet uit moeten maken hoeveel ervaring, kennis of concentratie de gebruiker heeft.

Het doel is om een intuïtieve gebruikerservaring te bieden. Hier zijn een paar tips:

• Vermijd jargon: Gebruik geen moeilijke woorden of vaktermen. Kies in plaats daarvan voor eenvoudige taal die iedereen begrijpt.
• Consistente elementen: Zorg ervoor dat knoppen, menu’s en andere interactieve elementen er overal op de website hetzelfde uitzien. Dit helpt gebruikers om de website snel te begrijpen.
• Duidelijke links: Gebruik beschrijvende tekst voor links, zodat gebruikers weten waar ze naartoe gaan als ze erop klikken.
• Heldere labels: Voorzie formulieren en invulvelden van duidelijke labels. Zo weten gebruikers precies wat ze moeten invullen.

Heldere informatie

Dit principe stelt dat je ontwerp noodzakelijke informatie effectief moet communiceren naar de gebruiker, ongeacht de omgevingsomstandigheden of de zintuiglijke mogelijkheden van de gebruiker.

Dit lijkt op het principe van gelijkwaardig gebruik, omdat beide erop gericht zijn je website toegankelijk te maken voor gebruikers met verschillende mogelijkheden. Naast het effectief gebruik van kleur en het bieden van alt-tekst voor niet-tekstelementen, zijn er nog andere manieren waarop ontwerpers zich aan het principe van waarneembare informatie kunnen houden:

• Gebruik een logische kopstructuur: Organiseer informatie op een gemakkelijk te begrijpen manier door een logische kopstructuur te gebruiken. Koppen moeten rechtstreeks betrekking hebben op de tekst eronder en moeten hiërarchisch worden georganiseerd. Dit betekent dat je <h1>-tags gebruikt voor hoofdkoppen, <h2>-tags voor subkoppen, enzovoort. Door je inhoud op deze manier te structureren, kunnen gebruikers de pagina snel scannen en de belangrijkste punten begrijpen, zelfs als ze moeite hebben met het lezen van de volledige tekst.
  
• Presenteer informatie zowel tekstueel als visueel: Hoewel het verstrekken van alt-tekst voor niet-tekstelementen cruciaal is voor gebruikers met een visuele beperking, is het omgekeerde ook waar; sommige gebruikers zullen baat hebben bij een visueel alternatief voor gecompliceerde tekstinformatie. Dit kan diagrammen, grafieken of illustraties omvatten die helpen complexe ideeën op te splitsen in gemakkelijker verteerbare formaten.

Vergevingsgezindheid

Dit principe gaat over het verminderen van risico’s en de vervelende gevolgen van onbedoelde acties.

Door dit principe te volgen, maak je de website gebruiksvriendelijker en voorkom je frustratie bij bezoekers.

• Tips die je kunt wegklikken: Zorg ervoor dat tooltips (kleine informatievensters) weg te klikken zijn, verschijnen als je er met je muis overheen beweegt en blijven staan totdat je ze wegklikt. Zo voorkom je dat ze in de weg zitten of per ongeluk verdwijnen.
• Vertraging bij menu’s: Voeg een kleine vertraging toe aan dropdown menu’s. Dit helpt gebruikers om te voorkomen dat ze per ongeluk een menu openen.
• Ongedaan maken of terug: Zorg voor knoppen om acties ongedaan te maken of terug te gaan naar een vorige pagina. Zo kunnen gebruikers fouten herstellen zonder helemaal opnieuw te moeten beginnen.
• Bevestiging bij belangrijke acties: Vraag gebruikers om een actie te bevestigen als deze permanente gevolgen heeft, zoals het verwijderen van een account. Dit voorkomt dat ze per ongeluk iets doen wat ze niet willen.

Lage fysieke inspanning

Dit principe draait om het ontwerpen van websites die efficiënt en comfortabel te gebruiken zijn, zonder dat gebruikers snel vermoeid raken. Het doel is om te voorkomen dat bezoekers te veel fysieke of mentale inspanning moeten leveren om de website te gebruiken.

Hier zijn een paar tips:

• Grotere klikbare elementen: Maak knoppen, links en andere interactieve elementen groter. Dit maakt het makkelijker voor gebruikers om ze aan te klikken, vooral voor mensen met motorische beperkingen.
• Minder stappen: Zorg ervoor dat gebruikers hun doel snel kunnen bereiken met zo min mogelijk stappen. Vermijd lange formulieren of het navigeren door meerdere pagina’s om te vinden wat ze nodig hebben.
• Logische tabvolgorde: Zorg voor een logische volgorde van de elementen op de pagina, zodat gebruikers die met het toetsenbord navigeren gemakkelijk van het ene naar het andere element kunnen gaan.
• Consequent ontwerp: Houd je ontwerp consistent en vermijd het overladen van gebruikers met te veel informatie tegelijk. Verdeel complexe taken in kleinere stappen en geef duidelijke instructies.

Voldoende plek voor gebruik

Dit principe stelt dat ontwerpen voldoende ruimte moeten bieden voor “benadering, bereik, manipulatie en gebruik, ongeacht de lichaamsgrootte, houding of mobiliteit van de gebruiker”.

Het doel is om ervoor te zorgen dat ontwerpen toegankelijk zijn voor alle gebruikers, hoe ze de website ook bekijken of ermee omgaan. Dit principe hangt nauw samen met andere principes, zoals ‘Lage fysieke inspanning’ en ‘Flexibiliteit in gebruik’, omdat het gericht is op het tegemoetkomen aan een breed scala aan behoeften en voorkeuren.

Enkele aandachtspunten:

• Verschillende apparaten: Gebruikers bezoeken websites vanaf verschillende apparaten, zoals desktopcomputers, laptops, tablets en smartphones. Zorg ervoor dat je website op al deze apparaten toegankelijk en gebruiksvriendelijk is. Ontwerp responsieve lay-outs die zich aanpassen aan verschillende schermgroottes en zorg ervoor dat interactieve elementen zoals knoppen en links groot genoeg zijn om gemakkelijk op kleinere schermen te kunnen tikken.
  
• Hulpmiddelen: Houd rekening met hulpmiddelen zoals schermvergroters of tekst-naar-spraak-software. Als een gebruiker bijvoorbeeld je site vergroot, moet je ervoor zorgen dat dynamische elementen zoals dropdown-menu’s gemakkelijk te begrijpen en te gebruiken blijven, zelfs wanneer ze vergroot zijn. Als een gebruiker afhankelijk is van tekst-naar-spraak-software, is het belangrijk om ervoor te zorgen dat de inhoud van je site zo is gestructureerd dat deze logisch is wanneer deze wordt voorgelezen.

Wij hanteren de principes van Universal Design bij je volgende web-project

Stel je voor: je bouwt een huis, maar de deur is te smal voor rolstoelen, de lichtschakelaars zitten te hoog voor kinderen en de trappen zijn te steil voor ouderen. Zonde, toch?

Hetzelfde geldt voor websites!

Universal Design zorgt ervoor dat jouw online ‘huis’ toegankelijk is voor iedereen, ongeacht hun beperkingen. Denk aan mensen met een visuele beperking, motorische problemen of leermoeilijkheden.

Level Level werkt vol overtuiging aan een internet dat voor iedereen toegankelijk is. Wij leveren uitsluitend fraaie, toegankelijke websites op. Onze designers en developers zijn doordrenkt van het Universal Design gedachtegoed. Laat je volgend project door Level Level bouwen!

We hebben het Accessibility Team in huis, een ploeg van webtoegankelijkheids-experts die je team komen versterken. Wij ondersteunen je organisatie bij het bereiken van digitale toegankelijkheid. 

En, last but not least, bieden we opleidingen aan via ons cursus-platform The A11y Collective.