Online Magazine ‘Week van
de Digitale Toegankelijkheid’
Concept
Ontwerp
Onderzoek
Tijdens mijn stage bij DutchGiraffe kreeg ik de opdracht om een online magazine te ontwerpen over de WCAG-richtlijnen. De grootste uitdaging binnen dit project was: hoe zorg ik ervoor dat het magazine visueel aantrekkelijk is én tegelijkertijd voldoet aan de WCAG-richtlijnen? Benieuwd hoe ik visueel ontwerp combineerde met toegankelijkheid? Lees meer over dit project.
Het doel van dit magazine was om klanten van DutchGiraffe te informeren over digitale toegankelijkheid en hen te overtuigen van het belang om de richtlijnen op de juiste manier toe te passen. Dit betekende dat mijn ontwerp niet alleen visueel sterk moest zijn, maar ook functioneel en toegankelijk voor iedereen.
Onderzoek naar digitale toegankelijkheid
Voor het ontwerpen van dit magazine had ik anderhalve week, waardoor ik geen uitgebreid onderzoek kon doen. Daarom richtte ik me op één centrale onderzoeksvraag: Hoe zorg ik ervoor dat ik een visueel aantrekkelijk magazine maak waarin ik de WCAG-richtlijnen op AA/AAA-niveau toepas?
Omdat dit een uitdaging leek, onderzocht ik specifiek welke kleuren iemand met kleurenblindheid goed zou kunnen zien en welke lettertypes geschikt zijn volgens de WCAG-richtlijnen. Dit testte ik met contrastcheckers in Figma en Photoshop. Tijdens mijn onderzoek ontdekte ik ook dat iconen een belangrijke rol spelen in toegankelijkheid, omdat ze tekst kunnen ondersteunen en visuele herkenning verbeteren. Deze inzichten gebruikte ik als basis voor mijn ontwerpkeuzes.
Van onderzoek naar concept
Op basis van mijn onderzoek bepaalde ik een stijl die minimalistisch, overzichtelijk en visueel aantrekkelijk is. Ik koos voor de lettertypes Montserrat en Lato vanwege hun goede leesbaarheid en experimenteerde met verschillende kleurenpaletten om de beste contrastverhoudingen te vinden. De ronde vormgevingselementen zorgen voor een vriendelijke uitstraling, terwijl iconen en afbeeldingen de inhoud versterken en toegankelijk maken voor een brede doelgroep. Tijdens deze fase maakte ik meerdere schetsen en wireframes om verschillende ontwerp opties te hebben en de beste keuzes te maken. Door te testen en te itereren kon ik mijn ontwerp steeds verder aanscherpen. Uiteindelijk resulteerde dit in een stijl die zowel toegankelijk als visueel aantrekkelijk is voor de gebruiker.
Hier zie je de aantekeningen die ik heb meegenomen uit mijn onderzoek.
Dit is de stijltile waarin ik de visuele stijl van het magazine heb vastgelegd.
Het volledige magazine ontwierp ik in Figma, waarbij ik rekening hield met WCAG 2.2 AA/AAA-richtlijnen. Dit hield in dat ik:
Extra hoge contrastwaarden gebruikte voor betere leesbaarheid.
Klikbare elementen groter maakte voor gebruiksgemak.
De tekstbreedte beperkte tot 500 pixels voor optimale leesbaarheid.
Links niet alleen een kleur gaf, maar ook onderstreepte voor betere zichtbaarheid.
Iconen en afbeeldingen gebruikte om de inhoud beter toegankelijk te maken.
Gedurende het proces werkte ik nauw samen met mijn begeleider en verwerkte ik feedback om het ontwerp verder te optimaliseren. Uiteindelijk leverde ik een compleet en
professioneel toegankelijk magazine op, dat op de laatste dag van de Week van de Digitale Toegankelijkheid werd gepubliceerd.
Toegankelijk ontwerp volgens WCAG-Richtlijnen
Wat heb ik geleerd?
Deze opdracht heeft me veel geleerd over digitale toegankelijkheid en hoe ik toegankelijkheid al vanaf de conceptfase in mijn ontwerp kan integreren. Ik ontdekte hoe belangrijk contrast, typografie en iconen zijn en hoe ik strikter volgens WCAG 2.2 AA/AAA-richtlijnen kan werken. Ook leerde ik efficiënter ontwerpen met Auto-layout in Figma, waardoor ik sneller en gestructureerder kon werken.
Het eindresultaat was een toegankelijk en visueel aantrekkelijk magazine dat positief werd ontvangen door collega’s en klanten. Dit project heeft me niet alleen meer inzicht gegeven in digitale toegankelijkheid, maar ook in hoe ik als ontwerper impact kan maken door drempels voor gebruikers weg te nemen.
Klik hier om het magazine te bekijken!
Inhoudsopgave
Pagina uit het magazine
Cover
Cover
Colofon
Voorwoord
![](data:image/svg+xml,<svg display="block" id="1189051114" role="presentation" viewBox="0 0 24 20" xmlns="http://www.w3.org/2000/svg"><path d="M 20.4 0 L 3.6 0 C 2.645 0 1.729 0.395 1.054 1.098 C 0.378 1.803 -0.001 2.756 0 3.75 L 0 16.25 C 0 17.245 0.379 18.198 1.054 18.901 C 1.728 19.604 2.644 20 3.6 20 L 20.4 20 C 21.355 20 22.271 19.605 22.946 18.902 C 23.622 18.197 24.001 17.244 24 16.25 L 24 3.75 C 24 2.755 23.621 1.802 22.946 1.099 C 22.272 0.396 21.356 0 20.4 0 Z M 19.597 2.499 L 12 8.439 L 4.403 2.499 Z M 20.4 17.5 L 3.6 17.5 C 3.282 17.5 2.976 17.368 2.752 17.134 C 2.526 16.899 2.4 16.581 2.4 16.25 L 2.4 4.063 L 11.28 11 C 11.706 11.333 12.294 11.333 12.72 11 L 21.6 4.063 L 21.6 16.25 C 21.6 16.581 21.474 16.899 21.248 17.134 C 21.024 17.368 20.718 17.5 20.4 17.5 Z" fill="rgb(255, 255, 255)" height="20px" id="EdetBMibR" width="24px"/></svg>)