Onderzoek toegankelijkheid stimulus.nl

Hele sample

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma OPZuid projecten

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Uitkomst: Onvoldoende

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Uitkomst: Onvoldoende

programma OPZuid

Het logo van het programma bovenaan de pagina heeft een lege alt-tekst. Logo’s moeten in de alt-tekst alle zichtbare tekst beschrijven. Dit issue komt ook voor op de pagina’s van het programma Just Transition Fund.

De afbeelding met logo en tekst over de Europese Unie heeft een leeg alt-attribuut. Dit is echter geen decoratieve afbeelding, maar biedt informatie over het programma. Zorg dat deze content geheel terugkomt in de alt-tekst.

programma OPZuid projecten

Binnen de Download-button staat een icoontje van Excel. Dit is een afbeelding zonder alt-attribuut. Hierdoor is het voor gebruikers van hulpsoftware niet duidelijk waar deze afbeelding van is. Er kan hier het best een leeg alt-attribuut gebruikt worden, zodat screenreaders de afbeelding negeren.

PDF factsheet JTF West-Noord-Brabant

Er zijn afbeeldingen gevonden zonder alternatieve tekst. Dit zijn gekleurde achtergronden. Deze lijken decoratief en kunnen daarom beter als zodanig worden gemarkeerd.

Ook zijn er logo’s in het document (onderaan de pagina) die niet in de codelaag staan en daardoor geheel worden genegeerd door screenreaders. Zorg dat deze op de eerste pagina (of in ieder geval 1 keer) wel staan opgenomen in de codelaag met goede alternatieve teksten. De herhalingen kunnen dan het best decoratief worden gemaakt.

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Er staan logo’s in het document (bovenaan en onderaan de pagina) die niet in de codelaag staan en daardoor geheel worden genegeerd door screenreaders. Zorg dat deze op de eerste pagina (of in ieder geval 1 keer) wel staan opgenomen in de codelaag met goede alternatieve teksten. De herhalingen kunnen dan het best decoratief worden gemaakt.

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Onvoldoende

team

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma OPzuid documenten

Uitkomst: Onvoldoende

programma OPZuid projecten

Uitkomst: Onvoldoende

programma Just Transition Fund

Uitkomst: Onvoldoende

programma Just Transition Fund project Opleidingscentrum Rootz

Uitkomst: Onvoldoende

nieuws

Uitkomst: Onvoldoende

verhaal Inspirerend en vernieuwend onderwijsmodel gooit hoge ogen in binnen- en buitenland

Uitkomst: Onvoldoende

agendaitem Walk-in hours The Gate

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Uitkomst: Onvoldoende

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Uitkomst: Onvoldoende

random pagina 2 -regionale voorlichtingsbijeenkomsten OPZuid

Uitkomst: Onvoldoende

team

De koppenhiërarchie op de pagina is niet goed. Er is een h2-kop met ‘Team’ en van de teamleden daaronder staan de namen ook op h2-niveau. Die moeten een niveau lager zijn (of Team een niveau hoger). Vervolgens staan de functietitels in h4-koppen, maar dit horen geen koppen te zijn.

programma OPZuid

Binnen de tab ‘Openstellingen’ staat een tabel. De koprijen in de tabel zijn niet als zodanig gemarkeerd in de code, maar als datacel (td). Maak hier th-cellen van zodat screenreaders de tabel goed kunnen voorlezen.

In de tab ‘Organisatie’ staan tussenkopjes niet als kop opgemaakt, maar met het strong-element. Hierdoor komen ze niet terug in koppenlijsten, die screenreadergebruikers vaak gebruiken om te navigeren.

programma OPzuid documenten

De koppenhiërarchie op de pagina is niet goed. Bovenaan staat een h2-kop ‘Documenten’ en binnen de hoofdstukken staan h1-koppen als tussenkop. Zie screenshot 2. Beter zou zijn als ‘Documenten’ een h1-kop is en de tussenkopjes een lager niveau. Ook zijn er tussenkopjes opgemaakt met het strong-element (bijvoorbeeld onder Projectaanvraag en Voorlichting en publiciteit). Maak hier bijvoorbeeld h3-kopjes van.

programma OPZuid projecten

De koppenhiërarchie op de pagina is niet goed. De pagina start met de h2 ‘Projecten’ en daaronder hebben alle projecten een h1. Dit zou andersom moeten zijn. De h3-kop ‘Geef een antwoord’ valt door de hiërarchische structuur onder de h2-kop ‘Statistieken’. Dit is niet correct.

programma Just Transition Fund

De koppenhiërarchie op de pagina is niet goed. Naast de hoofdcontent staat een h1-kop ‘Openstellingen 2023’ waaronder dan alle koppen daarna vallen, zoals Nieuws en Agenda. Daarnaast zijn tussenkoppen zoals ‘Waarvoor is het JTF bedoeld?’ niet als kop opgemaakt, maar met het strong-element. Zie screenshot 3.

In de tab ‘West-Noord-Brabant’ staat een lijst die is opgemaakt als één paragraaf met allemaal ‘o’’s er in (Beginnend met ‘Energiesector:’). Het is hierdoor voor screenreaders niet duidelijk dat het om een lijst gaat en wordt hierdoor mogelijk niet goed voorgelezen.

Onder Zuid-Limburg staat een genummerde lijst die niet als zodanig in de code is opgemaakt, maar als een paragraaf.

programma Just Transition Fund project Opleidingscentrum Rootz

Visueel staat er 3 tabellen op deze pagina met 2 kolommen. In de code zijn deze niet als tabel opgemaakt.

nieuws

De koppenhiërarchie op de pagina is niet goed. Er staat een h2-kop ‘nieuws’ met de nieuwskoppen daaronder ook op h2-niveau. Dit moet een lager niveau zijn.

De invoervelden onder ‘Nieuwsbrief’ hebben geen label. Er staat een placeholdertekst, maar een placeholder is niet altijd beschikbaar. Voeg een label-element of aria-label toe. Voor hulpsoftware is een label altijd vereist. Voor ziende gebruikers kan het ook beter zijn een duidelijk tekstlabel te tonen dat altijd blijft staan.

De checkboxes zijn niet gegroepeerd en hebben geen groepslabel. Dit kan worden gedaan via een fieldset en legend, waarbij de tekst ‘Van welke programma's wilt u op de hoogte blijven?’ in de legend wordt gezet.

verhaal Inspirerend en vernieuwend onderwijsmodel gooit hoge ogen in binnen- en buitenland

De introductietekst is in het geheel opgemaakt met het strong-element. Dat is hier niet voor bedoeld, maar voor het uitlichten van enkele woorden die extra aandacht behoeven. Screenreaders kunnen deze teksten op een andere manier voorlezen. Gebruik CSS om deze paragraaf anders te stylen.

De tussenkopjes zijn niet als kop opgemaakt, maar met het strong-element.

Beide bevindingen komen op meerdere verhalenpagina’s voor.

agendaitem Walk-in hours The Gate

De pagina bevat bij locatie een definition list (dl-element) met enkel een dd-element en geen dt-element. Wanneer lijsten noet correct zijn opgemaakt worden ze mogelijk niet goed geïnterpreteerd door screenreaders. Aangezien de locatie hier leeg is, kan de lijst beter geheel verborgen worden. Wanneer deze wel content bevat, moet er minstens een dt- en een dd-element in staan.

PDF factsheet JTF West-Noord-Brabant

Koppen in het document zijn niet als kop (heading) opgemaakt, maar als paragraaf.

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Koppen in het document zijn niet als kop (heading) opgemaakt, maar als paragraaf.

Op pagina 2 begint een genummerde lijst. Deze is in de code opgemaakt als meerdere lijsten met (lege) paragrafen tussendoor. Zorg dat dit in de code 1 lijst is, zodat dit goed kan worden voorgelezen door screenreaders.

random pagina 2 -regionale voorlichtingsbijeenkomsten OPZuid

De koppenhiërarchie op de pagina is niet goed. Als eerste staat er een h2-kop ‘Regionale voorlichtingsbijeenkomsten OPZuid 14, 18 en 19 september’ en daarna volgen als tussenkopjes meerdere h1-koppen.

Hele sample

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

De visuele volgorde en de bronvolgorde zijn nogal verschillend. Dit is verwarrend voor (slechtziende) screenreadergebruikers en voor gebruikers die navigeren met het toetsenbord. Er missen ook vaak teksten van kopjes in de code (of deze staan heel ergens anders en worden daardoor niet op het juiste moment voorgelezen). Zorg dat de visuele volgorde en de bronvolgorde op een logische manier overeenkomen.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

nieuws

Uitkomst: Onvoldoende

nieuws

Bij het formulier van de nieuwsbrief hebben de invoervelden voor persoonlijke informatie zoals naam en adres geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Dit maakt het invullen van formulieren voor veel gebruikers gemakkelijker, bijvoorbeeld voor mensen voor wie het invoeren van tekst veel tijd kost omdat dit via speciale hulpmiddelen gaat, of voor mensen met cognitieve beperkingen. Dit kan worden verbeterd door ‘autocomplete’ attributen te plaatsen bij de invoervelden. Zie voor meer informatie https://www.w3.org/WAI/WCAG21/Techniques/html/H98 en voor een lijst van alle attributen https://www.w3.org/TR/WCAG21/#input-purposes.

Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Sommige links binnen paragrafen worden alleen aangegeven met behulp van kleur, bijvoorbeeld de link naar de privacy-statement in de cookie-popup en de links onderaan in de footer. Slechtzienden en kleurenblinden kunnen missen dat hier een link staat. Voeg bijvoorbeeld onderstreping toe om duidelijk te maken dat het om een link gaat. Dit komt op meerdere pagina’s voor, ook bijvoorbeeld bij Nieuws onder het formulier voor de nieuwsbrief.

De actieve pagina wordt in het menu alleen aangegeven met behulp van kleur: blauw in het hoofdmenu en geel in het submenu (welke ook te weinig contrast heeft). Voeg bijvoorbeeld een onderstreping toe. Voor hulpsoftware kun je aria-current=“true” toevoegen aan het actieve hoofditem. Zie ook screenshot 1.

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

contact

Uitkomst: Onvoldoende

team

Uitkomst: Onvoldoende

nieuws

Uitkomst: Onvoldoende

Zoekresultaten zonnepanelen

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Tekst moet een contrast hebben van minimaal 4,5:1 voor slechtzienden en kleurenblinden. Dat geldt ook voor actieve elementen zoals op hover en focus. Een aantal elementen op de website zitten qua contrast onder deze waarden.

De link ‘privacy-statement’ in de cookie-popup op hover (geel op wit, 1.3:1). Dit komt bij veel links voor, zie ook screenshot 1.

homepage

De witte teksten in de groene balk (‘Op de hoogte blijven van het laatste nieuws?’, 1.92:1).
De maand bij de agenda-items (4.46:1). Dit komt ook voor op de agenda pagina en de pagina van het agenda-item.
De datum onder de nieuwsberichten in de footer (3.26:1).
Sommige links en invoervelden, zoals achter het logo en ‘Inschrijven’ voor de nieuwsbrief krijgen bij focus een donkerblauwe achtergrond, met zwarte tekst (2.4:1). Dit komt bijvoorbeeld ook voor op de ‘Lees meer’ links bij projecten en in het zoekveld bij evenementen. Zie screenshots 4 en 5.

contact

De tekst wordt tijdens het invoeren wit, op een witte achtergrond is dit onzichtbaar.
De foutmelding in de rode tekst bij de CAPTCHA (3.8:1).

team

De placeholder ‘Zoek een contactpersoon’ (4.07:1). Dit komt op meerdere pagina’s voor bij het zoekveld.

nieuws

De datum bij de nieuwsberichten (2.84:1).

Zoekresultaten zonnepanelen

De blauwe links met de resultaten (3.16:1).

PDF factsheet JTF West-Noord-Brabant

De blauwe links in het groene vak op pagina 2 (3.2:1).

Hele sample

Uitkomst: Onvoldoende

programma's

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Bij het inzoomen valt een deel van het menu onder Webportal buiten beeld. Zie screenshot 7.

Vanaf 200% verdwijnen de Webportal links in het geheel. Deze zijn ook niet te vinden in het mobiele menu of elders op de pagina.

Vanaf 125% verdwijnt de link naar het jaarverslag (in de popup).

Zorg ervoor dat bezoekers die inzoomen alle content en functionaliteit kunnen blijven gebruiken.

programma's

Bij het inzoomen worden teksten onleesbaar, doordat onderdelen over elkaar heen vallen. Zie screenshot 6 bij 150%.

programma OPZuid

Waar je inzoomt (of de pagina op mobiel bekijkt), valt een deel van de tabel onder Openstellingen buiten beeld. Er kan ook niet naartoe gescrold worden. Zie screenshot 8 op 200%.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

programma OPZuid projecten

Uitkomst: Onvoldoende

programma OPZuid projecten

Op 400% ingezoomd vallen er teksten buiten de blokken. Zie screenshot 10.

Opmerking : Het is erg lastig de content te lezen op 400%, omdat een groot deel van het scherm wordt gebruikt voor witruimte. Overweeg dit in het design aan te passen.

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

contact

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Grafische elementen moeten een contrast hebben van minimaal 3:1. Dit geldt ook voor de randen of achtergrondkleur van invoervelden. Een aantal elementen op de website zitten qua contrast onder deze waarden.

In de cookiemelding staan invoervelden met vinkjes in lichtgrijs (1.2:1) Ze zijn hier inactief – kunnen niet uitgeschakeld worden - , maar het geeft wel informatie te weten dat ze zijn ingeschakeld.
De ‘naar boven’ link (2.1:1)

homepage

De dot-links binnen de slider (2.1:1)

contact

De randen van de checkbox voor de CAPTCHA (1.8:1)

programma OPZuid

De checkbox om de gegevens te bewaren in de browser (1.1:1)

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma Just Transition Fund

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Het aanpassen van tekstafstand door de gebruiker is onmogelijk gemaakt door in de eigen stylesheet lijnhoogte af te dwingen via  line-height: 10px !important; voor de ‘Over Stimulus’ tekst in de footer. Gebruikers die voor de leesbaarheid eigen tekstafstand instellingen gebruiken kunnen deze hier niet toepassen. Haal !important weg uit deze declaratie.

Wanneer tekstafstand-instellingen worden aangepast voor de leesbaarheid (zoals line-height, letter of word spacing) is niet alle tekst meer goed leesbaar. De teksten in het webportalmenu worden afgebroken. Dit kan worden opgelost door containers in de layout te laten meegroeien met de tekst. Dit criterium kun je gemakkelijk testen met deze bookmarklet: https://dylanb.github.io/bookmarklets.html.

homepage

In de slider lopen sommige teksten door de categorie heen.

programma OPZuid

Een deel van het submenu onder Contact valt buiten beeld.
Bij de nieuwsitems loopt de titel deels door het begin van de introtekst. Zie screenshot 11.

programma Just Transition Fund

De tekst van de tabs loopt deels buiten beeld.

Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De submenu’s kunnen alleen worden gesloten door de muis of de toetsenbordfocus te verplaatsen. Mensen die vergrotingssoftware gebruiken moeten de muis bewegen om delen van de pagina te bekijken. Wanneer dan (onbedoeld) content over iets heen valt, moeten ze deze met het toetsenbord weg kunnen halen. Zorg dat deze ook op een andere manier gesloten kan worden, bijvoorbeeld met de escape toets.

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

contact

Uitkomst: Onvoldoende

programma OPZuid faq

Uitkomst: Onvoldoende

programma OPZuid projecten

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De uitklapopties in de cookie-popup zijn niet te bedienen met het toetsenbord. Dit zijn link elementen zonder href attribuut. Om content uit te klappen kan beter een button element worden gebruikt.

homepage

De categorieknoppen onder ‘Verhalen uit de praktijk’ werken niet met het toetsenbord.

De navigatieknoppen van de slider (pijltjes en dots) werken niet met het toetsenbord.

contact

De visuele CAPTCHA is niet met het toetsenbord te bedienen. (De audio CAPTCHA wel, maar voor bezoekers die deze niet kunnen horen en geen muis kunnen gebruiken, is er nu geen alternatief.)

programma OPZuid faq

De tabs en de vragen kunnen niet geopend worden met het toetsenbord. De tabs zijn h3-koppen, en hebben geen tabopmaak in de code. De vragen zijn link elementen zonder href attribuut. Om content uit te klappen kan beter een button element worden gebruikt.

programma OPZuid projecten

De filters kunnen niet gebruikt worden met het toetsenbord. Dit zijn links zonder href-attribuut. Hiervoor kunnen beter button elementen worden gebruikt waarbij de status in de code wordt aangegeven.

Bij de diagrammen wordt per onderdeel via hover informatie gegeven over de bedragen. Dit is niet bereikbaar via het toetsenbord. Maak de hover informatie ook beschikbaar via het toetsenbord of laat deze informatie standaard zien zonder dat daar interactie voor nodig is, bijvoorbeeld door de percentages ook te tonen in de tabellen erboven.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

homepage

De pagina bevat een animatie van bewegende blokjes. Onderaan de pagina staat een popup met een constant wisselende titel (Van idee tot innovatie/uitvoering). Deze komt op elke pagina opnieuw in beeld. Onderaan bij de verhalen uit de praktijk staat een bewegende carousel. De wisselende blokjes kunnen niet gestopt worden. De popup kan met de muis wel snel gesloten worden, maar met het toetsenbord moet je eerst de gehele pagina doorlopen, en dit zijn erg veel links. De carousel kan niet gestopt worden. Voor gebruikers die last hebben van bewegende beelden kan dit erg storend of zelfs gevaarlijk zijn. Voeg een mogelijkheid toe om deze animaties (meteen) te kunnen stoppen.

programma OPZuid

Vanaf 150% ingezoomd gaan de nieuwsitems onderaan de pagina bewegen. Dit kan niet worden stopgezet.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Er is een skiplink wanneer de website bekeken wordt op 100%, maar vanaf 150% ingezoomd staat deze niet meer als eerste link op de pagina. Het staat nu midden in het bovenste menu. Zie screenshot 12. Vanaf 200% is de link geheel niet meer beschikbaar. Zorg dat de skiplink altijd de eerste link is die focus krijgt, en ook beschikbaar is voor bezoekers die inzoomen.

Hele sample

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Uitkomst: Onvoldoende

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Uitkomst: Onvoldoende

PDF factsheet JTF West-Noord-Brabant

Het PDF-bestand heeft geen titel. Voor gebruikers van hulpsoftware is het voor de navigatie tussen documenten/webpagina’s belangrijk dat de titel duidelijk maakt waar ze zijn. Wanneer een pdf geen titel heeft wordt de bestandsnaam getoond, deze is niet altijd even duidelijk. Pas de titel aan in de Documenteigenschappen in Adobe PDF.

PDF projectbeschrijving openstelling 2023 in het kader van JTF Zuid-Nederland

Het PDF-bestand heeft geen titel.

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma OPzuid documenten

Uitkomst: Onvoldoende

Zoekresultaten zonnepanelen

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De cookievoorkeuren staan in een popup window (dialog), maar de focus komt hier pas op na het doorlopen van de gehele pagina. Dit zijn erg veel links en dit duurt daardoor erg lang. Ook is het slecht zichtbaar door de donkere overlay. Zorg dat de focus alleen in de popup kan komen, totdat deze gesloten is.

homepage

De focus komt op de items in de carousel die niet zichtbaar zijn. Dit is verwarrend voor ziende toetsenbordgebruikers.

Op 400% ingezoomd komt de focus na het hoofdmenu op de zoekbalk, maar er kan niks ingevoerd worden. Zie screenshot 9.

programma OPZuid

Na het activeren van een tab gaat de focus niet meteen in het tabpanel, maar eerst naar de andere tabs. Het voorgeschreven gedrag bij tabs is dat de focus via de tabtoets meteen in het actieve panel komt en dat je met de pijltjestoetsen tussen de tabs kunt navigeren.Zorg dat de code voor tabs is opgemaakt volgens de specificatie, zie voor een voorbeeld https://www.w3.org/WAI/ARIA/apg/example-index/tabs/tabs-manual.html Dit komt op veel pagina’s voor.

programma OPzuid documenten

De focus komt ook op alle documentlinks binnen accordionsecties die gesloten zijn. Zorg dat de focus alleen kan komen op zichtbare links in uitgeklapte onderdelen.

Zoekresultaten zonnepanelen

Wanneer je een zoekwoord invult, opent er een popup window met resultaten. Bovenin staan tabs (in de code is dit een menubar). De focus gaat meteen naar de zoekresultaten en pas als je terug omhoog navigeert via shift-tab kom je bij de menu-items terecht. In een menu is het verwachte patroon dat je met pijltjestoetsen tussen de menu-items te kunnen navigeren, en met tab toets binnen de content van het geselecteerde menu-item. Maar dit werkt hier niet zo. Zorg dat het toetenbordgebruik hierin de specificaties volgt van in dit geval het menubar element. Zie ook https://www.w3.org/WAI/ARIA/apg/patterns/menubar/.

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma Just Transition Fund

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

In de popupwindow met de cookievoorkeuren staan links om uit te klappen. Deze links hebben geen tekst.

homepage

Bovenaan de pagina staan 3 blokken met onderwerpen. Bovenaan in die blokjes staan illustraties binnen een link. Deze links hebben als enig tekst ‘Link’ (via het aria-label). Dit zegt niks over het linkdoel. Omdat deze links ook eronder staan binnen de titel (h3), kunnen deze links beter weg worden gelaten. Als ze wel blijven staan, moeten ze goed onderscheidende linkteksten krijgen. Onderaan deze blokken staan ‘Lees meer’ links. Ook deze zeggen niks over het doel. Laat deze links weg (door het gehele blok aanklikbaar te maken via de link achter de titel), of voeg linkteksten toe. Dit kan met een extra tekst in de link, eventueel met CSS verborgen, of via een aria-labelledby verwijzing naar een tekst elders op de pagina. Zie voor meer info https://www.w3.org/TR/WCAG20-TECHS/ARIA7.html. Dit komt op meerdere pagina’s voor, ook bijvoorbeeld op de startpagina van programma OPZuid.

Onderaan de pagina in de popup over het jaarverslag staat een link met de tekst ‘Bekijk hier’. Deze tekst zegt onvoldoende over het doel van de link. Gebruikers van hulpsoftware vragen vaak lijsten op van links op de pagina. Wanneer deze teksten geen duidelijke informatie geven kunnen ze niks met deze links. Voeg een extra (eventueel verborgen) tekst toe aan de link.

Opmerking: in de footer onder Contact staan de 3 links er dubbel in: achter het icoon en achter de tekst. Voor gebruikers van hulpsoftware en toetsenbordgebruikers zorgt dit voor ruis en/of extra ‘tabstops’. Overweeg om de eerste link achter het icoon weg te halen.

programma OPZuid

De link achter het logo van het programma bovenaan de pagina heeft als tekst ‘Link’ . Dit zegt niks over het linkdoel (het aria-label voegt hier dus niks toe. Een screenreader leest hier dan voor ‘Link link’). Zorg voor een goede alt-tekst achter het logo (zie 1.1.1). Daarmee is het doel van de link hier ook duidelijk. DIt geldt voor alle pagina’s onder dit programma.

Er zijn meerdere links op de pagina met de tekst ‘Lees meer’, bovenaan en onder Nieuws. Voeg teksten toe aan de link die duidelijk maken waar het precies om gaat, zodat de diverse links van elkaar te onderscheiden zijn. Dit kan met een extra tekst in de link, eventueel met CSS verborgen, of via een aria-labelledby verwijzing naar een tekst elders op de pagina. Zie voor meer info https://www.w3.org/TR/WCAG20-TECHS/ARIA7.html. Dit komt op meerdere pagina’s voor, ook bijvoorbeeld bij projecten.

programma Just Transition Fund

De link naar de openstellingen achter de afbeelding heeft enkel als linktekst ‘Link’ (via het aria-label). Geef deze een goede linktekst.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

homepage

Uitkomst: Onvoldoende

homepage

Het invoerveld om te zoeken heeft als label ‘search query’. Dit is mogelijk niet voor alle bezoekers duidelijk. Maak hier een Nederlandse tekst van. Zulke Engelse termen komen op meerdere plekken op de site voor. Zie ook screenshot 9.

Hele sample

Uitkomst: Onvoldoende

nieuws

Uitkomst: Onvoldoende

nieuws

De focus op de checkboxes bij de nieuwsbrief is niet zichtbaar. Voeg bijvoorbeeld een zwarte rand toe, zoals bij de tekstinvoervelden erboven.

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma OPZuid

De link achter het logo heeft als toegankelijke naam enkel ‘link’. Hierdoor is het lastig om deze met stem te bedienen. Zorg dat de toegankelijke naam (zoals de alt-tekst) minimaal de zichtbare tekst bevat.

Dit issue komt ook voor op de pagina’s van het programma Just Transition Fund.

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Voldoende

Hele sample

Bevindingen:

Opmerking: wanneer je bent ingezoomd en met de muis boven een nieuwsitem staat, blijft deze op z’n plek staan. Wanneer je de focus er op hebt staan, blijven de items echter bewegen en gaan dus soms ook buiten beeld. Dit kan lastig zijn voor toetsenbordgebruikers. Zorg dat ook op focus het item stil blijft staan.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

nieuws

Uitkomst: Onvoldoende

nieuws

Wanneer het aanmeldformulier niet verzonden kan worden, wordt niet in tekst aangegeven welke velden fout zijn ingevuld. Er komt alleen heel kort een (Engelstalige) tooltip in beeld bij de standaard browservalidatie. Zorg voor een ‘eigen’ validatie met duidelijke, Nederlandse teksten over wat er fout gaat.

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Niet van toepassing

Hele sample

Uitkomst: Voldoende

Hele sample

Uitkomst: Onvoldoende

programma OPZuid

Uitkomst: Onvoldoende

programma OPZuid faq

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De popup window van de cookievoorkeuren heeft geen naam. Dit kan worden toegevoegd door bijvoorbeeld een aria-label of aria-labelled-by attribuut.

De knop om de popup van het jaarverslag te sluiten heeft als naam ‘x’. Dit is geen duidelijke beschrijving. Maak hier bijvoorbeeld ‘sluit popup’ van.

Bij het uitklapbare menu van de webportal wordt de status niet aangegeven. Er staat een aria-expanded attribuut, maar op de verkeerde plek, namelijk op een div-element met de id ‘contactlink_dropdown’ in plaats van op de link waarmee het menu geopend wordt.

Bij het uitklapbare hoofdmenu wanneer je bent ingezoomd, wordt de status niet aangegeven. Dit geldt ook voor het submenu ‘Over Stimulus’. DIt kan worden gedaan door het toevoegen van het aria-expanded attribuut op de betreffende links.

programma OPZuid

De opmaak van de tabs is niet correct. De eerste tab bevat een ‘aria-controls’ attribuut dat verwijst naar een niet bestaande id. Dit komt op meerdere pagina’s met tabs voor.

programma OPZuid faq

De tabs zijn h3-koppen die je met de muis kunt selecteren, maar in de code zijn dit geen interactieve elementen met geschikte rol en status. Dit kan bijvoorbeeld worden aangegeven door in de code gebruik te maken van tab en tabpanel. Zie ook https://www.w3.org/TR/wai-aria-1.1/#tab.

Hele sample

Uitkomst: Voldoende