Vormgeving van het onderdeel score binnen WMK

Het onderdeel score in WMK is vanaf deze week een stuk gebruiksvriendelijker bij het gebruik op een mobiele telefoon. Door de nieuwe opmaak zijn de schermen beter leesbaar. We hanteren vanaf nu voor dit onderdeel ‘Mobile First’, dat betekent dat we het ontwerpen voor het kleine scherm van een telefoon. Natuurlijk is het onderdeel ook nog steeds goed op een groter scherm te gebruiken. Dan wordt een grotere variant getoond.

In deze vernieuwing zijn ook verbeteringen op het gebied van digitale toegankelijkheid (accessibility) doorgevoerd die niet direct met het blote oog zichtbaar zijn. We vertellen u er graag meer over.

Digitale toegankelijkheid (accessibility)

Nu we steeds vaker alles online doen, is het belangrijk dat websites, online documenten en mobiele applicaties voor iedereen toegankelijk zijn, ook voor mensen met een beperking.

De internationale Richtlijnen voor Toegankelijkheid van Webcontent (WCAG) bevatten een groot aantal aanbevelingen om webcontent toegankelijker te maken. Door deze richtlijnen te volgen wordt content toegankelijker voor mensen met functiebeperkingen. Denk bij die beperkingen aan onder meer blindheid en slechtziendheid, doofheid en gehoorverlies, leerproblemen, cognitieve beperkingen, motorische beperkingen, spraakproblemen, overgevoeligheid voor licht en aan een combinatie van deze beperkingen. De richtlijnen voorzien niet in elke gebruikersbehoefte van mensen met deze beperkingen. De richtlijnen zijn van toepassing op de toegankelijkheid van webcontent.
Door de richtlijnen van WCAG te volgen is de webcontent meestal ook beter bruikbaar voor alle webbezoekers.

De WCAG zijn opgebouwd rond vier principes die het uitgangspunt bij de vernieuwing van WMK zijn geweest.

• Waarneembaar (perceivable): alle informatie en alle componenten van de gebruikersinterface moeten waarneembaar zijn door de gebruiker.
• Bedienbaar (operable): alle componenten van de gebruikersinterface en de navigatie moeten bedienbaar zijn door de gebruiker.
• Begrijpelijk (understandable): alle informatie en het gebruik van de interface moet begrijpelijk zijn voor de gebruiker.
• Robuust (robuust): content moet voldoende robuust zijn om betrouwbaar geïnterpreteerd te kunnen worden door uiteenlopende soorten technologieën zoals schermlezers en andere hulpmiddelen.

Het gaat daarbij om zaken als goed contrast tussen tekst en achtergrond op een website of app, en ook om de vraag of een website of document überhaupt werkt op een tablet of leesbaar is door hulpsoftware voor mensen met een beperking. Het is daarom belangrijk dat ontwikkelaars van deze digitale toepassingen de toegankelijkheidsrichtlijnen volgen.

Per principe lichten we hieronder uit waar rekening mee is gehouden in de vormgeving van WMK.

Waarneembaar (perceivable): 

Dit principe is vooral gericht op het toegankelijk maken van webcontent voor mensen die slechtziend, blind of kleurenblind zijn. Voor WMK hebben we de volgende verbeteringen toegepast op dit gebied:

• De informatie op de site kan door een computer via de screenreader voorgelezen worden. Alle informatie zoals afbeeldingen, knoppen hebben een tekstueel alternatief of een naam gekregen.
• Bij de kleuren hebben we gekozen voor kleuren en contrast zodat slechtziende en kleurenblinde gebruikers de informatie goed kunnen gebruiken.
• De teksten zijn vanaf nu te vergroten en zijn allemaal als echte tekst geplaatst zodat de informatie kan worden voorgelezen.

Bedienbaar (operable):

• De informatie is nu zo gestructureerd dat navigatie via het toetsenbord mogelijk is. Daarbij wordt duidelijk aangegeven waar je bent op de pagina: de focus van de pagina.
• We hebben bij kopteksten gecontroleerd of bij opvragen van alle koppen op de pagina er een goed beeld wordt gekregen van de inhoud.

Begrijpelijk (understandable): 

• Bij het verkeerd invullen van een formulier krijgt de gebruiker duidelijke aanwijzingen om de fout te verbeteren.
• Bij formulieren wordt instructie gegeven over wat ingevoerd moet worden. Denk hierbij aan ‘vul hier uw achternaam in’ of ‘klik op de verstuur button als u het formulier heeft ingevuld’.

Robuust (robuust):

• Alle elementen van de internetpagina’s vertonen hetzelfde gedrag (dus zowel door onszelf ontwikkelde als standaard onderdelen van de pagina’s). Hierdoor worden alle elementen door hulpapparatuur zoals schermlezers op dezelfde manier gezien en behandeld.