Dit is de uitgeschreven versie van de video waarin Charissa het ARIA-attribuut expanded uitlegt.

Hallo, mijn naam is Charissa en ik test voor Digitaal Toegankelijk. Ik heb een visuele beperking en daarom maak ik gebruik van een schermlezer, zowel op mijn telefoon als op mijn laptop. Vandaag wil ik het nut laten zien van een ARIA-attribuut. Dit, ARIA-attribuut heet, ARIA Expanded en het zorgt er namelijk voor dat blinden en slechtzienden die gebruik maken van een schermlezer te horen krijgen of een menu is samen gevouwen of juist is uitgevouwen. Want ik klik vaak genoeg op een knop, maar dan hoor ik dat er helemaal niks gebeurd. Ik heb dus geen idee of er iets is samen gevouwen of open gevouwen is.

Ik laat je nu even een voorbeeld zien. Ik ben nu op de website van de Rijksoverheid en hier wordt het ARIA expand attribuut goed toegepast. Als ik namelijk met mijn schermlezer, ofwel screenreader op het hamburger menu ga staan, dan hoor je knop navigatiemenu samen gevouwen. Dus ik weet, hij is niet geopend. En als ik daar dan dubbel op klik om het te openen, dan hoor ik navigatie, punt, menu uitgevouwen. Dat is een hele goeie manier om te laten weten aan je visueel beperkte doelgroep dat het menu open of dicht is.

In tegenstelling tot bijvoorbeeld de website van de BCC. Hier hoor ik menu einde banner en ik klik daar dubbel op om te kijken wat er dan als feedback wordt gegeven. Ik hoor eigenlijk niks. Ik heb wel wat rest visus dus ik zie dat er wat geopend wordt. Ik hoor ook niet dat ik het menu kan sluiten, of ja, wat eigenlijk de bedoeling is. Dus hier is het ARIA-attribuut expanded niet goed toegepast.

Ik heb hier nog een ander voorbeeld. Dat is de website van Coolblue en het was even zoeken om daar de menu knop te vinden omdat hij anders gelabeld staat, maar ik had hem uiteindelijk gevonden. Namelijk als ‘ons assortiment afbeelding’, ik klik daarop. Ik hoor dan wel gelijk menu sluiten webvenster, dat dan weer wel. Wat ik bij BCC helemaal niet hoorde. Maar goed, ik wist dus in eerste instantie niet eens dat dat ja de menu Navigation was of de hamburger icon.

Dus ja, Coolblue die heeft ook niet goed gebruik gemaakt van het ARIA expanded attribuut, of eigenlijk helemaal niet, en dat kunnen ze dus gaan toepassen.

Vond je dit een nuttige video? Doe dan een duimpje omhoog en ik hoor graag in de reacties wat je van deze video vond.