Sinds een half jaar ben ik vrijwilliger in de bibliotheek bij de zogenaamde ‘Klik & Tik’ cursus. Dit is een gratis cursus voor wie wil leren (beter) om te gaan met de computer en internet. Dit staat open voor deelnemers van alle leeftijden, maar in de praktijk komen er veel ouderen op af. Sommigen hebben nog helemaal geen ervaring met computers (of tablet/smartphone), sommigen hebben al wel wat ervaring, maar lopen tegen bepaalde zaken aan en willen of kunnen daarvoor niet steeds hun naasten om hulp vragen. Dan gaat het bijvoorbeeld om het regelen van zaken met de overheid, online winkelen of het kunnen sturen van een e-mail met foto’s aan familie.
Bij het gebruik van websites zie ik tijdens deze lessen vaak dezelfde problemen terugkomen. Deze hebben te maken met hoe een website vormgegeven of gebouwd is, en hebben daarmee (grote) impact op het kunnen gebruiken van de site. In dit artikel behandel ik vijf veelvoorkomende issues, en noem daarbij de WCAG succescriteria op A en AA niveau (dit is het verplichte niveau voor overheden wat betreft toegankelijkheidsrichtlijnen) die deze issues addresseren.
Contrast en tekstgrootte
Veel ouderen hebben verminderd zicht, en daar komt nog bij dat als ze onbekend zijn met hoe websites in elkaar zitten, ze vaak ook niet weten waar ze moeten kijken. Dat een home-knop linksboven zit en een ‘verder’-knop rechtsonder is een veelvoorkomend patroon (en daarmee goed om te volgen), maar dat is voor nieuwe internetgebruikers nog helemaal niet vanzelfsprekend. Iconen worden ook vaak niet herkend zonder tekstuitleg erbij. Ze turen dus soms heel het scherm af op zoek naar bepaalde woorden of aanwijzingen. Wanneer de menu-items dan kleine, lichtblauwe tekst op een lichte achtergrond zijn, dan wordt het wel erg moeilijk om deze te herkennen. Het concept inzoomen (dat je dat zelf kunt doen) is vaak ook onbekend. Voor deze groep is het dus beter om standaard grotere tekst met voldoende contrast te gebruiken.
Relevante Succescriteria:
1.4.3 Contrast, 1.4.4 Resize text, 1.4.11 Non-text Contrast, 3.2.3 Consistent Navigation, 3.2.4 Consistent Identification
Elementen te dicht op elkaar
Naast de slechte leesbaarheid van bijvoorbeeld kleine menuteksten, wordt de bedienbaarheid vaak ook lastig wanneer links en knoppen dicht bij elkaar staan gepositioneerd. De motoriek neemt vaak af bij het ouder worden, wat betekent dat het moeilijker wordt om de muis pointer te plaatsen op een specifieke plek, en dan ook nog met de juiste timing druk uit te oefenen. Zorg daarom voor voldoende ruimte tussen interactieve elementen. Wees ook terughoudend met complexe bewegingen zoals slepen, drag en drop. Naast dat dit concept vaak niet begrepen wordt, is het motorisch gezien ook veeleisend.
Relevante Succescriteria:
2.5.2 Pointer Gestures
2.5.8 Target size, 2.5.7 Dragging movements (beide nieuw onder WCAG 2.2, nog in draft)
Drukke layout
De computer is vaak overweldigend en eng voor nieuwe gebruikers. Het verschil tussen de lagen (OS, browser, website) wordt vaak niet herkend. Als er meerdere sluit-knoppen zijn, bijvoorbeeld van een popup window, een tab en de browser, wordt vaak het verkeerde onderdeel -de browser- gesloten tijdens een proces. Wanneer binnen de website zelf dan ook nog veel tegelijk wordt getoond, kan dit erg lastig worden. Ouderen hebben vaak een slechter korte termijngeheugen en sommigen worden ook nog snel afgeleid door externe omstandigheden (zoals iemand die langs loopt). Dan is de concentratie weg en moeten ze opnieuw het proces door waar ze mee bezig waren. Het is dus belangrijk dat de taak op de website visueel duidelijk in focus is en dat de gebruiker er voldoende tijd voor krijgt. Een ’terug’-knop of herhaalknop bij een video is dan ook erg nuttig. Tijdens de cursus worden deze, waar aanwezig, veelvuldig en dankbaar gebruikt.
Relevante Succescriteria:
2.2.1 Timing Adjustable, 2.2.2 Pause, Stop, Hide
Engelse woorden
Veel ouderen hebben geen kennis van de Engelse taal. Op websites worden echter niet altijd consistent alle onderdelen goed vertaald naar het Nederlands. Een ergens vergeten ‘save’-knop kan dus wel degelijk impact hebben. Als een oudere gebruiker dit niet herkent, wordt er meestal ook niet op gedrukt. De angst is namelijk vaak groot om iets fout te doen wat niet meer hersteld kan worden. Hierdoor haken ze vaak af als ze iets niet zeker weten. En dan wordt dat artikel dus toch maar niet online gekocht.
Relevante Succescriteria:
2.4.6 Headings and labels
Invoer en spelling
Invoervelden in formulieren zijn vaak erg lastig. Iedere cursusochtend begint met een inlogformulier en dat gaat vrijwel nooit vlekkeloos. Gebruikersnamen, e-mails en wachtwoorden vereisen zeer specifieke invoer met hoofdletters, kleine letters, cijfers, speciale karakters en de afwezigheid van spaties. Ouderen noteren dit soort gegevens meestal op papiertjes, en in het handschrift is het vaak niet duidelijk waar spaties of hoofdletters staan. Ook gaat het vaak mis met toevoegingen op het papier zoals ‘WW’ voor wachtwoord, welke dan ook ingevoerd worden. Vanwege een afnemend korte termijngeheugen spelen deze problemen vaak iedere keer dat er moet worden ingelogd opnieuw op. Nu kunnen persoonlijke gegevens op openbare computers zoals in de bibliotheek niet worden bewaard, maar zorg er als webbouwer in ieder geval voor dat de velden automatisch ingevuld kunnen worden op privé-computers. Daar help je oudere gebruikers enorm mee.
Wees ook flexibel in de acceptatie van invoer in bepaalde formaten zoals postcodes en telefoonnummers. Corrigeer het waar mogelijk zelf in de achtergrond, of geef hele duidelijke foutmeldingen met suggesties voor verbeteringen. En laat gebruikers nooit twee keer dezelfde informatie invullen.
Relevante Succescriteria:
1.3.5 Identify Input Purpose, 3.3.2 Labels or Instructions, 3.3.3 Error Suggestion
3.3.7 Redundant Entry, 3.3.8 Accessible Authentication (beide nieuw onder WCAG 2.2, nog in draft)
Verwijzingen
Klik & Tik is een gratis online cursus van Oefenen.nl. Deze kan vanuit huis worden gedaan en onder begeleiding in bibliotheken door heel Nederland.
Overzicht van alle WCAG 2.1 criteria
Toegevoegde criteria in WCAG 2.2