Wat is de WCAG-ratio? Waarom u het in uw ontwerpen zou moeten implementeren

De Web Content Accessibility Guidelines (WCAG) zijn toegankelijkheidsrichtlijnen voor digitaal en webdesign. Door deze richtlijnen te volgen, zorgt u ervoor dat kleuren voldoende contrasteren om mensen met een visuele beperking te helpen uw ontwerpen goed te zien en te lezen. Dit gaat ook hand in hand met typografisch formaat, om de leesbaarheid samen met de kleuren te garanderen.

In een wereld die inclusiever zou moeten zijn, zal het toevoegen van toegankelijke elementen aan uw ontwerpen uw werk alleen maar naar een hoger niveau tillen en u in staat stellen het met meer mensen te delen.

Wat is de WCAG-ratio?

WCAG staat voor Richtlijnen voor toegankelijkheid van webinhoud. De WCAG helpt iedereen die ontwerpt of creëert voor het web of internet om ervoor te zorgen dat hun ontwerpen de toegankelijkheidsdoelstellingen halen. Dit betekent dat iedereen van uw ontwerpen kan genieten en deze kan gebruiken, zonder waar mogelijk mensen met visuele beperkingen of andere handicaps uit te sluiten.

De WCAG-ratio stelt de minimale ratio's in om de toegankelijkheid van het doel te bereiken. Dit omvat kleurcontrast en tekstgrootte, die er beide voor zorgen dat mensen met een visuele beperking een betere kans hebben om uw ontwerpen te zien, ermee om te gaan en ze te gebruiken. Het bereiken van de WCAG-ratio helpt niet alleen mensen met visuele beperkingen, maar het verhoogt ook de gebruikerservaring voor alle internetgebruikers.

De World Wide Web Consortium ontwikkelt standaarden voor webontwikkeling. Hoewel er geen vaste regels zijn voor webtoegankelijkheid, stelt de WCAG een norm vast waaraan elke webontwerper zich moet houden.

Bij het testen van contrastverhoudingen stelt de WCAG een A tot AAA-classificatie voor. Een A-classificatie toont de laagste contrastniveaus. AA zijn contrastniveaus in het middenbereik met een verhouding van 4,5:1, wat wordt beschouwd als de minimale verhouding. Tot slot is AAA het hoogste contrastniveau. Als u voor iedereen ontwerpt, zijn uw contrastniveaus het beste tussen een AA- en AAA-bereik.

Waarom is de WCAG-ratio belangrijk in grafisch en webdesign?

Grafisch ontwerp en webdesign moeten er niet alleen voor zorgen dat informatie er mooi uitziet. Informatieontwerp informeert de massa - dit betekent dat uw informatie voor iedereen toegankelijk moet zijn. WCAG-implementatie zorgt voor toegankelijke ontwerpen voor mensen met een visuele beperking, dyslexie, neurodivergentie of iets anders dat iemands zicht of leesvermogen beïnvloedt.

Web- en digitaal ontwerp, evenals programmeren, hebben al gevestigde toegankelijkheidsfuncties. Bijvoorbeeld, Windows biedt handige toegankelijkheidstools voor gebruikers, en het is al gebruikelijk voor de meeste YouTube-video's om aan te bieden ondertitels of bijschriften. Maar we kunnen de bereikbaarheid altijd verbeteren.

Globaal ontwerp zorgt voor een beter ontwerp. Hoe meer mensen zich met uw ontwerp kunnen bezighouden, hoe succesvoller het is en hoe groter het bereik. Het is niet alleen goed voor jou als ontwerper om meer mensen te bereiken, maar het is ook beter voor de wereld dat er minder mensen worden buitengesloten.

Ontwerpen met de WCAG-verhouding en toegankelijkheidsfuncties in uw ontwerpen heeft positieve effecten op kleurenpaletten, typografische keuzes en tekstgroottes. Je zou niet met opzet iets ontwerpen dat moeilijk leesbaar is, dus waarom zou je niet meer manieren toevoegen om ontwerpen te maken die beter leesbaar zijn voor alle mensen?

Implementatie van de WCAG-ratio in uw ontwerpen

Er zijn plaatsen waar u de WCAG-verhouding in uw ontwerpen kunt controleren, zoals deze contrast controleur website. Maar u moet hoe dan ook beginnen met het implementeren van toegankelijke ontwerpfuncties in uw werk zonder te vertrouwen op het absolute minimum.

Opgemerkt moet worden dat de contrastrichtlijnen niet van toepassing zijn op logo-ontwerp. Dit komt doordat logo's in verschillende formaten en vaak tegen verschillende achtergronden worden gepresenteerd. Het kan echter geen kwaad om bij het ontwerpen van logo’s rekening te houden met de WCAG-ratio.

Kleuren met hoog contrast

Het gebruik van contrastrijke kleuren is een gemakkelijke manier om inclusiviteit aan uw ontwerpen toe te voegen. Kleuren die contrasteren met elkaar helpen mensen met visuele beperkingen en kleurenblindheid om uw ontwerpen beter te zien. Niet alleen dat, maar zelfs mensen zonder beperking van hun gezichtsvermogen zullen uw ontwerpen beter zien en ermee omgaan.

Ooit geprobeerd een lichtroze tekst op een lichtgroene achtergrond te lezen? Het is bijna onmogelijk. Maar een donkerblauwe tekst op een lichtgele achtergrond is veel beter te zien en te lezen.

Kleuren met hoog contrast werken het beste wanneer u tekst op een gekleurde achtergrond plaatst of wanneer u kleine paden in uw illustraties gebruikt. Chroma is een AI-kleurenpaletgenerator die wordt geleverd met een ingebouwde contrastcontrole - een van de vele geweldige AI-tools om uw grafische ontwerpworkflow te ondersteunen.

Een geweldige manier om het contrast te controleren, is door uw ontwerp in grijstinten te veranderen. Als je de kleuren kunt scheiden en het ontwerp in zwart en grijs begrijpt, zou het ook goed moeten vertalen in de door jou gekozen kleuren.

Lettergrootte

Naast dat tekstkleuren voldoende contrasteren met achtergrondkleuren, moet uw tekst zelf groot genoeg zijn om gemakkelijk te kunnen lezen. De WCAG-verhouding voor grote tekst is 3:1.

De tekstgrootte is niet gelijk voor alle typografie, dus vertrouw niet op een 12-puntsgrootte - die doorgaans wordt gezien als de minimumgrootte voor standaard leesbaarheid - voor alle lettertypen. Test ze zelf of met gebruikerstesters door ontwerpen op ware grootte weer te geven of af te drukken. Als uw kleuren niet zo goed contrasteren, zal grotere tekst de leesbaarheid bevorderen, als tijdelijke oplossing.

Lettertype leesbaarheid

Het spreekt voor zich, maar de lettertypen die u in uw ontwerpen kiest, moeten gemakkelijk leesbaar zijn. Decoratieve lettertypen, cursieve lettertypen of handgetekende lettertypen hebben vaak problemen met de leesbaarheid. Heavy metalbands staan ​​erom bekend dat ze inherent moeilijk leesbare lettertypen gebruiken voor bijvoorbeeld hun bandlogo's.

U moet ook spatiëring en tracking overwegen wanneer u uw tekst voor kleine ontwerpen gebruikt. Letterafstand kan ook van invloed zijn op de beoogde leesbaarheid van woorden.

Inclusieve toegankelijkheidsfactoren

Hoewel alleen kleurcontrast, lettergrootte en leesbaarheid van tekst in webdesign worden meegewogen in WCAG-verhoudingen, moet u bij al uw web- en grafische ontwerpen rekening houden met inclusiviteit.

Als u een webontwerper bent die met een programmeur of codeur werkt, zorg er dan voor dat u dat bent HTML-technieken gebruiken die helpen bij webtoegankelijkheid. Er zijn ook toegankelijkheidsfuncties in Canva om het bereik van uw ontwerpen bij uw publiek uit te breiden.

Je moet niet alleen stoppen bij de minimumvereisten voor de WCAG-ratio's; als je controle hebt over het toevoegen van alt-tekst aan afbeeldingen, bijschriften aan audio- of videobestanden, of zelfs nuttige formulering van tekst voor hyperlinks - die hardop worden voorgelezen door schermlezers - moet u hierboven en voorbij. Het opnemen van toegankelijkheidsfuncties sluit geen enkel publiek uit - het nodigt alleen maar meer mensen uit.

Ontwerpen met de WCAG-ratio verbetert ontwerpen voor iedereen

De standaarden voor webdesign zijn afkomstig van het World Wide Web Consortium, een gemeenschap die helpt bij best practices op internet. Het consortium heeft de Web Content Accessibility Guidelines ontwikkeld, die webdesigners moeten volgen. Dit biedt een verhoudingsstandaard voor zichtbaarheidscontroles bij het ontwerpen voor het web.

Door deze richtlijnen en verhoudingsnormen te volgen, kunnen meer mensen toegang krijgen tot uw webontwerpen.