Deze pagina bevat het overzicht van een aantal bevindingen uit de toegankelijkheidsaudits die het afgelopen jaar zijn uitgevoerd. Bij elke bevinding staat een korte toelichting hoe dit aandachtspunt te testen is en (waar mogelijk) hoe dit opgelost kan worden.
Video's
De video heeft een container met een aria-hidden="true", waardoor deze niet beschikbaar is voor gebruikers met voorleessoftware.
Verder is de caption onder de video niet gekoppeld aan het iframe, dit kan door deze samen in een figure-element te plaatsen.
YouTube video
Deze video is alleen af te spelen als de tracking-cookies op onze website geaccepteerd zijn.
Tabs
Wanneer er tot 400% wordt ingezoomd op een resolutie van 1280*1024 pixels valt een deel van de tabs buiten beeld en kunnen deze niet benaderd worden.
Verder krijgt de actieve tab een aria-expanded="true" en blijft de aria-selected="false" staan. De aria-selected moet veranderen naar "true", en aria-expanded mag eraf.
Dit is het verplichte eigen risico. U krijgt geen korting.
U krijgt 3 euro korting per maand.
U krijgt 6 euro korting per maand.
U krijgt 9 euro korting per maand.
U krijgt 12 euro korting per maand.
Bij de Ruime Keuze en Eigen Keuze krijg je 15 euro korting per maand
Bij de Basis Keuze krijg je 17 euro korting per maand
Tabellen
Tabellen worden deels afgekapt als er tot 400% wordt ingezoomd op een resolutie van 1280*1024 pixels.
Deze linkjes worden voorzien van een pdf-icoon, maar deze informatie wordt niet op een andere manier overgebracht (bijvoorbeeld via de content in het before-element).
De informatie "positief" en "negatief" worden niet op een andere manier overgebracht en kan van betekenis zijn voor de tekst in de lijst.
Test negatief
Nog een test negatief
Test positief
Nog een test positief
Alternatief voor en
Teksten kunnen nu opgemaakt worden met een bold- en em tag. Dit voegt extra betekenis toe, die niet altijd noodzakelijk is. Graag zou ik aan het form-menu een styling voor "Dikgedrukt" en "Schuingedrukt" toevoegen, om teksten van opmaak te voorzien.
Tooltipslider
De modal die wordt geopend moet een role="dialog" meekrijgen en een aria-labeledby om deze te voorzien van een beschrijvende titel. Geef ook een aria-modal="true" mee als het venster zichtbaar is voor de juiste focus-afhandeling.
Op 400% zoom (bij een resolutie van 1280*1024 pixels) is er nauwelijks iets te lezen in de overlay door de fixed header en footer. Die laatste mag worden verwijderd en is dubbel.
{"key":"Aan de slag met mindful werken","title":"Minder stress en meer in balans","content":"\u003cp\u003e\u003cimg alt=\u0022\u0022 height=\u0022213\u0022 width=\u0022307\u0022 src=\u0022https://cdn.vgz.nl/sc/-/media/project/websites/shared/gezond-leven/vgz-mindfulness-coach-app/hero-image-mfc-mobiel.png?la=nl-nl\u0026amp;rev=8c61ce29d0dc4d399091dd6a9ddc4056\u0022 /\u003e\u003c/p\u003e\n\u003cp /\u003eWe brengen een groot deel van onze tijd door op het werk. Deadlines, volle agenda’s en afleiding kunnen stress veroorzaken. Met het programma ‘Mindful Werken’ wordt op een rustige manier geleerd om met deze druk om te gaan. Zo blijft veerkracht behouden en ontstaat ruimte voor ontspanning. \n\u003cp\u003eKrijg gratis toegang met de vouchercode \u003cstrong\u003eVGZMindfulwerken\u003c/strong\u003e\u003c/p\u003e\n\u003cdiv class=\u0022component statusmessage statusmessage--info\u0022\u003e\n\u003cdiv class=\u0022statusmessage__iconsection statusmessage__iconsection--info\u0022\u003e\n\u003cspan class=\u0022statusmessage__icon--info\u0022\u003e\u003c/span\u003e\n\u003c/div\u003e\n\u003cdiv class=\u0022statusmessage__descriptionsection component-content\u0022\u003e\n\u003cspan class=\u0022statusmessage__description statusmessage__description--info\u0022\u003e\n\u003cp\u003eGebruik bovenstaande code om het programma te gebruiken. Open de VGZ Mindfulness Coach app, klik bij \u0027Programma\u0027s\u0027 op de knop \u0027Vouchercode gebruiken\u0027 en vul eenmalig de vouchercode in.\u003c/p\u003e\n\u003c/span\u003e\n\u003c/div\u003e\n\u003c/div\u003e\n\u003ca class=\u0022button primary\u0022 href=\u0022https://app.vgzmindfulness.nl/program/5t0i2omlKjUXnktXH5LfCK\u0022\u003eOpen het programma\u003c/a\u003e\n\u003ca class=\u0022button secondary\u0022 href=\u0022https://www.vgz.nl/gezond-leven/mentale-gezondheid/mindfulness/mindfulness-coach/mindful-werken\u0022\u003eMeer over het programma\u003c/a\u003e"}
SwipeContainer
Bij het bekijken van de slider op een resolutie van 1280*1024 pixels en vervolgens inzoomt tot 400% verschijnen er dots. Het contrast van de inactieve dots is niet voldoende en daarnaast is er geen verbinding tussen de dots en de slides.
Verder is ook de focusvolgorde niet juist (elke dot moet worden afgegaan) en zou je verwachten direct door te gaan naar de slide als de dot wordt geselecteerd.
Ook mag de "hint" worden verborgen, omdat hier een uitleg wordt gegevens met zintuigelijke eigenschappen (links/rechts) of bewegingen die niet voor iedereen mogelijk zijn (beweeg/veeg).
Beweeg de onderstaande blokken van rechts naar links
Toegankelijkheidsnaam voor hamburgericoon in hoofdnavigatie aanpassen naar "Hoofdnavigatie"
Toegankelijkheidsnaam kruisje bij submenu aanpassen naar "Sluit subnavigatie"
Toegankelijkheidsnaam invoerveld bij zoeken toevoegen (aria-label) Toegankelijkheidsnaam aanpassen als knop (hamburger, vergrootglas) veranderd in een kruisje