Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website NPO Kennis

(Alleen de bevindingen)

Scope van de evaluatie

Naam website NPO Kennis
Datum 8 november 2024
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op npokennis.nl
Buiten de scope van het onderzoek valt:
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
  • Alle externe systemen en websites waar de onderzochte website met een link naar wordt verwezen.
Conformiteitsdoel WCAG 2.1 niveau AA

Uitgebreide toetsresultaten

Aantal bevindingen: 45

1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 1: Op pagina https://npokennis.nl/ staat midden bovenaan het logo van NPO kennis. Dat logo heeft geen tekstalternatief. Het is een optie om de SVG op te maken als afbeelding met een tekstalternatief door aan het SVG-element de attributen role=”img” en aria-label=”NPO kennis (logo)” toe te voegen. Onderaan iedere pagina staat een grijze versie van dit logo die ook een tekstalternatief hoort te krijgen. Die versie van dat logo staat daar om te laten zien op welke website de gebruiker zich bevindt. Die versie van het logo moet ook een tekstalternatief krijgen om te voldoen.

Bevinding 2: Op pagina https://npokennis.nl/ komt mogelijk een cookiemelding in beeld onderaan het venster. In die cookiemelding staat rechts een blauw kruis om deze melding te sluiten. Die interactieve component heeft nu geen tekstalternatief die als naam van de interactieve component zou moeten gaan werken.

Bevinding 3: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat er op de grote afbeelding “Iemand drinkt koffie in de avond” een knop die met een play-icoon erin. Dat icoon heeft geen tekstalternatief. Het is een optie om de SVG op te maken als afbeelding met een tekstalternatief door aan het SVG-element de attributen role=”img” en aria-label=”open video en speel deze af” toe te voegen. Het video-element dat in beeld komt is interactieve content en moet om die reden zelf ook een tekstalternatief krijgen dat kort de inhoud van de video beschrijft. Dit tweede probleem kan opgelost worden door een title-attribuut toe te voegen met een tekst als “invloed van cafeïne op jouw nachtrust”.

1.2 Op tijd gebaseerde media

1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 4: Op pagina https://npokennis.nl/thema/1/gezondheid-voeding staat een link met het aria-label “video over "Wat is melatonine?". Cover: Een vrouw ligt in bed te slapen.” De afbeelding bij deze link is bewegend beeld zonder geluid. Dit louter-videobeeld moet een alternatief hebben om te voldoen. De tekst “Cover: Een vrouw ligt in bed te slapen” komt niet overeen met wat er te zien is op het beeld. Doordat die tekst onjuiste informatie geeft moet dit afgekeurd worden. Dit geld ook voor de bewegende beelden boven de teksten “Wat zijn anabole steroïden?” en “Wat zijn geraffineerde koolhydraten?”. Dit type probleem komt mogelijk meer voor op deze pagina. Dit type probleem komt ook voor op andere pagina’s zoals https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap bij de animaties “Cover: Slaaptekort openingsanimatie” en “Cover: 0 snurken opening”. Op pagina https://npokennis.nl/thema/2/geld-inkomen gaat het onder andere om “Cover: Prijsov jongenintrein” en “Cover: 1 waarom ziekenhuiszorg zo duur is animatie”.

1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 5: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat een video met uitleg over cafeïne. Bij deze video is ondertiteling voor doven en slechthorenden aanwezig, helaas ontbreekt de tekst “Dus nu je dit weet” uitgesproken rond 1:11 in deze ondertitels, het probleem is dat die tekst een belangrijk onderdeel van de conclusie van deze video vormt en daarmee ook beschikbaar moet zijn voor gebruikers die het geluid (tijdelijk) niet kunnen horen. Het wordt aangeraden om ook de ondertiteling aan het begin van de video te verbeteren, daar is het niet goed duidelijk dat er een andere spreker te horen is.

Bevinding 6: Op pagina https://npokennis.nl/story/756/hoe-herken-je-autisme staat een video van “Het is hier autistisch - BNNVARA” en een video van “Ik durf het bijna niet te vragen - BNNVARA”. In de beide video’s is geen ondertiteling voor doven en slechthorenden aanwezig. Dit geldt ook voor de video’s op pagina https://npokennis.nl/story/663/wat-doet-verliefd-zijn-met-je, de video op pagina https://npokennis.nl/longread/7886/waarom-zijn-honden-ons-favoriete-huisdier en de video op pagina https://npokennis.nl/story/730/hoe-ontstaat-jeuk.

Bevinding 7: Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa staat een blok content met de kop “Hoe is de Europese Unie ontstaan?”. In dat blok (iframe) staan meerdere video’s waarvan bij enkele video’s de ondertitels ontbreken. De laatste video in dat blok heeft wel voldoende ondertitels. De eerste video met de naam “Wie is de baas van de EU?” voldoet gebruikers kunnen de ondertiteling van deze video zelf in en uitschakelen, maar de drie video’s daaronder voldoen dan weer niet omdat de ondertitels ontbreken.

1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 8: In de eerste video op pagina https://npokennis.nl/story/730/hoe-ontstaat-jeuk komt de naam en functie van de spreker in beeld. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Zo kunnen mensen die de video niet kunnen zien en afhankelijk zijn van hulpsoftware de waarde van deze informatie niet goed beoordelen. Zet deze en andere informatie in een transcript. Of maak gebruik van een extra audiospoor om ook te voldoen aan SC 1.2.5. In de derde video op deze pagina is naast de spreker ook een mevrouw met jeuk te zien tegen wie gesproken wordt. Die context is nu niet op te maken uit alleen het geluid van dit fragment. Die video moet daarom ook aangepast worden om te voldoen.
Op pagina https://npokennis.nl/story/756/hoe-herken-je-autisme komt in de eerste video de naam van de expert in beeld, het ontbreken van die informatie zorgt ervoor dat deze video niet voldoet. Dit type probleem komt ook voor op andere pagina’s zoals https://npokennis.nl/story/663/wat-doet-verliefd-zijn-met-je en dergelijke.

Bevinding 9: Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa staat de video “Von der Leyen wordt nieuwe Commissievoorzitter”. Uit het beeld blijkt meteen dat dit een fragment uit het journaal is en in de beelden van het journaal komt rond 00:11 de naam en functie van de spreker in beeld die niet in het geluid terugkomt. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Zo kunnen mensen die de video niet kunnen zien en afhankelijk zijn van hulpsoftware de waarde van deze informatie niet goed beoordelen. Zet deze en andere informatie in een transcript. Of maak gebruik van een extra audiospoor om ook te voldoen aan SC 1.2.5. Het hierboven beschreven probleem met namen die in beeld komen komt ook voor bij de reacties van de parlementsleden. Dit type probleem geld ook voor de video “Vetorecht in de raad”, omdat aan het begin van de video een logo en tekst in beeld staat en geld ook voor de naam en functie die rond 00:48 en 1:17 in beeld komen. Dit type probleem komt ook voor in de tweede video met de titel “”Wie is de baas in Europa” video op deze pagina.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 10: Bij succescriterium 1.2.3 zijn meerdere video’s afgekeurd omdat er informatie in het beeld niet terugkomt in het geluid. Onder dat succescriterium is een oplossing door middel van een media-alternatief (zoals een transcript) toegestaan, maar onder de eisen van dit succescriterium is het vereist om een audiodescriptie (extra audiospoor) aan te bieden als oplossing voor de genoemde problemen met de video’s zoals die op pagina’s https://npokennis.nl/story/730/hoe-ontstaat-jeuk, https://npokennis.nl/story/756/hoe-herken-je-autisme, https://npokennis.nl/story/663/wat-doet-verliefd-zijn-met-je en https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 11: Op pagina https://npokennis.nl/ staat meerdere div-elementen met het aria-label “Hier kun je horizontaal scrollen tussen slides”. Het is niet toegestaan om een div-element met aria-label een naam te geven zonder ook de rol van dat div-element aan te passen. De tekst die alleen beschikbaar is voor hulpsoftware (in het aria-label) geeft nu ook niet de juiste informatie. De bediening staat niet in maar onder deze component. Het div-element met de bediening heeft met “group” wel een goede rol, maar de naam “Slider bediening” geeft niet de relatie met de bovenstaande set sliders aan. Het is daardoor niet goed genoeg duidelijk bij welke slider deze “Slider bediening” hoort.

Bevinding 12: Op pagina’s zoals https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren, https://npokennis.nl/story/730/hoe-ontstaat-jeuk, https://npokennis.nl/story/756/hoe-herken-je-autisme en dergelijke staat een div-element met het aria-label “Hier kun je horizontaal scrollen tussen slides”. Het is niet toegestaan om een div-element met aria-label een naam te geven zonder ook de rol van dat div-element aan te passen. Hiernaast geeft het gebruikte aria-label in het geval van de quiz onjuiste informatie. Het is een optie om dit aria-label weg te halen omdat de component “Slider bediening” in deze gevallen maar op één slider kan slaan is dat genoeg om te voldoen.

Bevinding 13: Op pagina https://npokennis.nl/over staan alinea’s die in de code gescheiden zijn door het gebruik van twee br-elementen. Door het gebruik van deze code zijn de teksten “Van ‘Waarom piekeren … doet de NAVO?’” en “We beantwoorden de … je verder brengt.” Niet goed van elkaar gescheiden voor hulpsoftware. Het is een optie is om de deze twee teksten ieder in een eigen p-element te plaatsen net als gedaan is voor de eerste alinea. De tekst “NPO Kennis ... en je weet het” staat ook niet in een eigen paragraaf. Die tekst is nu met em opgemaakt. Het is niet toegestaan om alle tekst in één alinea op te maken in een em-element. De oplossing voor die tekst is om hem in een apart p-element te plaatsen en alleen visueel schuingedrukt te maken. Het em-element geeft tekst nadruk en mag alleen gebruikt worden om een deel van een tekst of kop nadruk te geven.
Onder de kop “Wie maken NPO Kennis?” staan de schuingedrukte teksten “Makers NPO Kennis” en “IN10 - design”. Die teksten zeggen iets over de onderstaande content. Die relatie is nu niet beschikbaar voor hulpsoftware. Daar is het een optie om van die twee teksten koppen te maken in plaats van het geven van nadruk aan een deel van de tekst.

Bevinding 14: Op pagina https://npokennis.nl/thema/1/gezondheid-voeding komt er na het openen van de knop “Toon filters” een aantal links in beeld. Van die links is de link “Alles Weergeven” visueel anders om duidelijk te maken dat die link actief is. Die visuele informatie heeft geen alternatief die beschikbaar is voor hulpsoftware. Het is een opties om op de actieve link het attribuut aria-current=”true” te plaatsen. Dit type probleem komt ook voor op de overige thema pagina’s zoals https://npokennis.nl/thema/2/geld-inkomen.

Bevinding 15: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat voor de zichtbare kop “Welk effect heeft cafeïne op je slaap?” informatie die betrekking heeft op dit onderwerp. Het gaat om de teksten “Video” en “Explainer” én om de video met uitleg die afgespeeld kan worden. Het is een optie om de visueel verborgen tekst “Welk effect heeft cafeïne op je slaap?” op te maken als kop van niveau 1. In dat geval is het ook de bedoeling om de zichtbare kop (alleen in de code) niet langer op te maken als kop. Op die manier staat er op deze pagina één kop van niveau 1 die aan het begin van de unieke content aangeeft waar de pagina over gaat.

Bevinding 16: Op pagina https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren staat een zichtbare kop van niveau 1 met de tekst “Hoeveel weet jij over huisdieren?”. In de code staat er na deze kop een tweede kop van niveau 1 met de tekst “Meer over de quizonderwerpen” erin. Deze tweede kop wordt door hulpsoftware aan gebruikers gepresenteerd en dat is niet toegestaan. Het is een optie om de tweede kop ook voor hulpsoftware te verbergen met display:none.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 17: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat de knop “Lees het antwoord” in de code onder het antwoord. Het verbergen van de antwoordtekst is alleen visueel gedaan. Voor gebruikers van hulpsoftware is het hele antwoord altijd al beschikbaar.

1.3.5 Identificeer het doel van de input (Niveau AA)

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Uitkomst: Onvoldoende

Bevinding 18: Op alle pagina’s van https://npokennis.nl/ staan invoervelden waar de gebruiker een e-mailadres in moet vullen om de nieuwsbrief te ontvangen. Invoervelden die bedoeld zijn voor het persoonlijke e-mailadres van de gebruiker moeten het attribuut autocomplete=”email” hebben om aan de eisen van dit succescriterium te voldoen. Die waarde maakt het mogelijk voor hulpsoftware om gebruikers te ondersteunen bij het in één keer goed invullen van deze gestandaardiseerde persoonlijke gegevens.

Bevinding 19: Op pagina https://npokennis.nl/contact staan de invoervelden “Naam” en “Email”, op deze invoervelden ontbreekt het autocomplete-attribuut. In dit geval is het de nodig om de waarden “name” en “email” te gebruiken om het voor hulpsoftware mogelijk te maken om te ondersteunen bij het invullen van deze invoervelden.

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 20: Op pagina https://npokennis.nl/ staan twee lichtblauwe links (#009CDD) die met 3,1:1 niet voldoende contrast met de witte achtergrond hebben. Het gaat om de links “Meer over mentale gezondheid” en “Bekijk de hele collectie”. Dit type probleem komt ook voor op andere pagina’s zoals op https://npokennis.nl/contact bij de link “privacystatement” in de zin onder het invoerveld “Opmerking” én bij de blauwe versie van de labels van de invoervelden die in beeld komen gedurende het invullen. Op andere pagina https://npokennis.nl/over bestaat hetzelfde probleem. Voor het beoordelen van dit succescriterium is de witte standaardweergave van de website gebruikt, het advies is om er voor te zorgen dat het contrast in “dark mode” ook overal voldoende is.

Bevinding 21: Bij het laden van de pagina https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren staat de lichtblauwe knop “Doe de quiz!” (#009CDD) in beeld. De witte tekst op die knop heeft met 3,1:1 niet voldoende contrast om te voldoen. Ook de verschillende “Volgende vraag” knoppen op deze pagina hebben niet voldoende contrast. Let op dit zijn voorbeelden van dit type probleem op deze pagina andere knoppen moeten ook aangepast worden om te voldoen.

Bevinding 22: Op pagina https://npokennis.nl/thema/1/gezondheid-voeding hebben de verschillende blauwe onderdelen (#009CDD) van de filteropties met 3,1:1 niet voldoende contrast met de witte achtergrond (of tekst). Het contrast van de filteropties moet ook verbeterd worden om te voldoen.

Bevinding 23: Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa staat een blok (iframe) met de kop “Hoe is de Europese Unie ontstaan?”. In die serie slides staan twee kaart animaties met onderaan een groot wit jaartal. Die jaartallen moeten voldoende contrast hebben om te voldoen. De witte cijfers hebben nu niet met 2,3:1 niet voldoende contrast met de grijze achtergrond (#AAAAAA) om te voldoen. Ook tekst op afbeeldingen en animaties moet voldoende contrast hebben.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 24: Indien een pagina als https://npokennis.nl/ bij een schermgrootte van 1280x1024px ingezoomd wordt tot 200% dan is de zoekfunctie niet langer met het toetsenbord te bedienen. Een deel van de gebruikers die inzoomen zijn ook niet in staat om de muisaanwijzer te gebruiken. Alle functionaliteiten moeten daarom ook op de herschaalde versie van de pagina met het toetsenbord bedienbaar zijn.

Bevinding 25: Indien een pagina als https://npokennis.nl/ bij een schermgrootte van 1280x1024px ingezoomd wordt tot 200% dan bedekken de balk met de cookiemelding en de pop-up met het formulier “Blijf op de hoogte met de wekelijkse nieuwsbrief” een groot gedeelte van het beeld. Het wordt hierdoor onnodig lastig om de website te gebruiken. Onderdeel van dit probleem is de focus volgorde van deze onderdelen. De cookiemelding staat altijd vooraan en zou daardoor ook als eerste toetsenbordfocus moeten krijgen, zodat die gesloten kan worden. Doordat het formulier ook onderaan iedere pagina staat geld voor dat onderdeel het advies om deze op kleinere weergaven te verbergen zodat deze gebruikers niet blokkeert. Op die manier is voorveel mogelijk van de beperkte ruimte beschikbaar voor de informatie op de pagina.
Indien de pagina https://npokennis.nl/ bekeken wordt met 400% zoom is het probleem zo groot dat de hele website niet langer te gebruiken is. De pop-up met het formulier komt pas in beeld nadat de gebruiker naar beneden scrolt en bedekt alle content totdat de gebruiker in staat is om die pop-up te sluiten.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 26: Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa staat onder de kop “In het kort” een lijst met vijf punten. De gele bullets (#FFDD55) in deze lijst hebben met 1,3:1 niet voldoende contrast met de witte achtergrond om te voldoen. Dit probleem geld ook voor de lijst onder de kop “Hoe werkt de EU?”.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 27: Op alle pagina’s van https://npokennis.nl/ is het niet mogelijk om de cookiemelding te sluiten met het toetsenbord. Het lichtblauwe kruis dat in beeld komt kan geen toetsenbordfocus ontvangen en is daardoor ook niet met toetsenbord te bedienen.

Bevinding 28: Op pagina https://npokennis.nl/ staat onderaan het formulier “Blijf op de hoogte met de wekelijkse nieuwsbrief”. In dat formulier is het mogelijk om met het toetsenbord de algemene voorwaarden te accepteren. Op het moment dat een gebruiker het selectievakje met het toetsenbord activeert klapt de knop “Ik accepteer de algemene voorwaarden” ook open. Dit is niet de bedoeling. Het wordt aangeraden om de uitklapbare knop niet in het label van het selectievakje te plaatsen. Het is niet de bedoeling om interactieve componenten in de labels van andere componenten te plaatsen. Dit probleem komt voor in alle versies van dit formulier op deze en andere pagina’s, het formulier onderaan de homepage is puur als voorbeeld gebruikt.

Bevinding 29: Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa staan de links “[1]” tot en met “[3]”. Deze links verwijzen naar links onder het kopje “Geraadpleegde bronnen” onderaan de pagina. Het probleem is dat bij het activeren van deze links de toetsenbordfocus niet verplaatst wordt. Het is dus niet mogelijk om met behulp van de link in de tekst direct naar de bron te navigeren. Het probleem is dat deze links alleen de viewport verplaatsen. Er zijn verschillende oplossingen mogelijk, een hiervan is om aan elk van de li-elementen in de lijst onder de kop “Geraadpleegde bronnen” het attribuut tabindex=”-1” toe te voegen. Op die manier wordt de toetsenbordfocus voor toetsenbord gebruikers mee verplaatst met het activeren van de link.

2.2 Genoeg tijd

2.2.2 Pauzeren, stoppen, verbergen (Niveau A)

Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen

Uitkomst: Onvoldoende

Bevinding 30: Animaties die bij het laden van de pagina automatisch beginnen te spelen zijn niet zomaar toegestaan. Dit type probleem komt op de meeste pagina’s van https://npokennis.nl/ voor. Het is een optie gebruikers de optie te geven om alle bewegende content op de huidige pagina in één keer uit te zetten, maar het zou beter zijn als content niet automatisch start met bewegen zodra de pagina geladen is. Het inladen van aanvullende content door te scrollen is geen probleem indien die animaties binnen de vijf seconden zijn afgerond.
Op pagina’s zoals https://npokennis.nl/story/730/hoe-ontstaat-jeuk is er een niet alleen een probleem met de eerste slide, maar ook met het automatisch starten van de video van het klokhuis is een probleem.
Op pagina https://npokennis.nl/longread/7453/wie-is-de-baas-van-europa is er in het blok (iframe) “Hoe is de Europese Unie ontstaan?” staan naast video’s die niet voldoen ook nog enkele animaties die blijven bewegen zoals de animatie met de kaart met daarboven de tekst “De welvaart in de samenwerkende landen stijgt en meer landen sluiten zich aan, zoals het Verenigd Koninkrijk, Griekenland en Portugal.”.

Bevinding 31: Op pagina https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren beweegt de pijl naast “Volgende vraag” die in beeld komt na het beantwoorden van een van de vragen. Deze bewegende content is niet zomaar toegestaan. Het is een optie om deze animatie uit te schakelen of na vijf seconden uit te schakelen.

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Voldoende

Bevinding 32: Advies: Op pagina’s https://npokennis.nl/thema/1/gezondheid-voeding, https://npokennis.nl/thema/2/geld-inkomen en https://npokennis.nl/thema/6/liefde-relaties land de toetsenbordfocus na het activeren van de skiplink “Direct naar de hoofdinhoud” op de knop “Toon filters”. Het advies is om er voor te zorgen dat de skiplink ook deze ene knop overslaat, maar dat is niet vereist om te voldoen.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 33: Op pagina’s zoals https://npokennis.nl/ staat onderaan een formulier met de kop “Blijf op de hoogte met de wekelijkse nieuwsbrief”. In dat formulier staat een uitklapbare knop “Ik accepteer de algemene voorwaarden”. In de tekst die dan in beeld komt staat een link met de naam “privacystatement”. Die link is mag als deze visueel verborgen geen toetsenbordfocus krijgen. Deze link moet als deze verborgen is overgeslagen worden in de focus volgorde om te voldoen. Dit type probleem komt voor in alle versies van dit formulier (zoals ook die in de pop-up), de versie onderaan de homepage is puur als voorbeeld gebruikt.

Bevinding 34: Op pagina https://npokennis.nl/ staat onderaan een formulier. In dat formulier staat een knop met de naam “nu inschrijven”. Die knop is inactief als niet alle gegevens juist zijn ingevuld, maar als deze beschikbaar wordt moet deze wel op een logische plaats in de focus volgorde staan. In dit geval is dat na de beide verplichte invoervelden. De visuele positie van deze knop is geen probleem, het gaat puur om de volgorde van focus voor gebruikers die geen visueel overzicht hebben.

Bevinding 35: Op pagina https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren komt de toetsenbordfocus op een div-element, doordat er op dat element een tabindex=”0” is geplaatst. Dit div-element is geen interactief element of een ander element met een bijzondere rol die het nodig maakt om dit element onderdeel te laten zijn van de focus volgorde van toetsenbord gebruikers. Het is een optie om de waarde van de tabindex te veranderen naar “-1” op die manier wordt dit onderdeel overgeslagen in de toetsenbord bediening terwijl het wel nog mogelijk is om de focus met software op dit onderdeel te zetten. Dit probleem geld niet alleen voor het div-element dat in beeld staat bij het laden van de pagina, maar ook voor alle andere div-elementen met vragen en antwoorden. Dit type probleem komt ook voor op andere pagina’s met dit soort vensters zoals https://npokennis.nl/story/730/hoe-ontstaat-jeuk, https://npokennis.nl/story/756/hoe-herken-je-autisme en https://npokennis.nl/story/185/hoe-werkt-spierpijn.

Bevinding 36: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat de knop “Lees het antwoord”. Na het activeren van deze knop zou de focus eerst naar de nieuw verschenen content moeten gaan voordat deze verder gaat op de pagina.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 37: Op pagina https://npokennis.nl/ staat de link “Bekijk hier de hele collectie”. Links als deze hebben niet zomaar context met de bovenstaande tekst of kop. Het is nu dus niet duidelijk dat deze link bij de kop “Opvangcrisis” hoort. Dit type probleem komt meer voor op deze pagina het geld namelijk ook voor de twee “Bekijk de hele collectie” link.

Bevinding 38: Advies: Op pagina https://npokennis.nl/quiz/35/hoeveel-weet-jij-over-huisdieren staat de link “Sluit story”. Het advies is om deze tekst aan te passen zodat deze ook van toepassing is op de quiz. Indien deze link de gebruiker altijd terugstuurt naar de vorige pagina is een tekstalternatief als “Ga terug” een optie.

2.4.5 Meerdere manieren (Niveau AA)

Informatie over succescriterium 2.4.5 Meerdere manieren

Uitkomst: Onvoldoende

Bevinding 39: Pagina’s zoals https://npokennis.nl/contact en https://npokennis.nl/over zijn op dit moment alleen te bereiken door het volgen van een link in het uitklapbare menu. Deze pagina’s zijn te vinden door het gebruik van de algemene zoekfunctie bovenaan iedere pagina.
De thema pagina’s zoals https://npokennis.nl/thema/1/gezondheid-voeding en https://npokennis.nl/thema/2/geld-inkomen zijn op dit moment ook niet te vinden via de algemene zoekfunctie bovenaan.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 40: Op pagina’s zoals https://npokennis.nl/ staat onderaan een formulier met de kop “Blijf op de hoogte met de wekelijkse nieuwsbrief”. Op het moment dat het selectievakje “Ik accepteer de algemene voorwaarden” toetsenbordfocus krijgt is er geen duidelijk zichtbare indicatie van die toetsenbordfocus. Op het moment dat de toetsenbordfocus op de uitklapbare knop naast het selectievakje staat is de toetsenbordfocus wel zichtbaar. Dit type probleem komt voor in alle versies van dit formulier (zoals ook die in de pop-up), de versie onderaan de homepage is puur als voorbeeld gebruikt.

3. Begrijpelijk

3.1 Leesbaar

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 41: De pagina https://npokennis.nl/program/13/net-in-nederland begint net als alle andere pagina’s in het Nederlands, maar bevat in de content enkele teksten die niet Nederlands zijn. Het gaat met name om de zin in het Arabisch en de zin daaronder die gedeeltelijk Oekraïens is. Die twee teksten hebben een taalwissel nodig om te voldoen. Het wordt aangeraden om dat ook voor de Arabische tekst bij de schakelaar te doen. In de tekst van een story in een andere taal is hoort die ook een taalwissel te krijgen. Dit kan door een lang-attribuut toe te voegen aan de html-code. De waarde voor Arabisch is lang=“ar”, de waarde voor Oekraïens is lang=”uk” en de waarde voor Engels is lang=”en”.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 42: Op pagina https://npokennis.nl/contact wordt de rode tekst “Dit veld is verplicht” gebruikt. Die tekst is geen foutmelding maar een instructie de er ook van te voren had kunnen staan om dit probleem te voorkomen. Het wordt aangeraden om in de foutmelding ook aan te geven om welke fout het gaat zoals “Er is geen naam ingevuld” of “Het veld Opmerking mag niet leeg zijn”. Let erop dat meldingen die in beeld komen bij het invullen van een ongeldig e-mailadres ook niet toegankelijk zijn. Bij het invoeren van de waarde “a@a” komt de tekst “Vul een geldig e-mailadres in” in beeld, die tekst is ook alleen een instructie. Bij sommige fouten zoals “a” komt er alleen een browserafhankelijk foutmelding in beeld. Die meldingen voldoen (nog) niet aan de eisen voor toegankelijkheid. In de meeste gevallen zijn dit ook enkel instructies en in Chrome heeft de melding een tijdslimiet. Het advies is dan ook om de donkerrode teksten aan te passen en om geen gebruik te maken van browserafhankelijke foutmeldingen.
Dit type probleem komt ook voor bij de verschillende versies van het formulier “Blijf op de hoogte met de wekelijkse nieuwsbrief” dat onder andere onderaan deze pagina staat. Dit probleem geld dus ook de versie van dit formulier in de pop-up.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Uitkomst: Onvoldoende

Bevinding 43: Op pagina https://npokennis.nl/video/97/welk-effect-heeft-cafeine-op-je-slaap staat op de afbeelding “Iemand drinkt koffie in de avond” een knop om de video af te spelen. Deze knop heeft geen naam.

Bevinding 44: Onderaan pagina https://npokennis.nl/ staat een formulier met de tekst “Ik accepteer de algemene voorwaarden”. Deze tekst is nu tegelijk het label van het selectievakje ernaast én een uitklapbare knop die meer informatie laat zien. Het wordt sterk aangeraden om niet alle tekst in het label als knop op te maken. De uitklapbare knop “Ik accepteer de algemene voorwaarden” geeft nu niet aan gebruikers van hulpsoftware door wat de status van deze knop is. Een van de manieren om deze problemen op te lossen is om de knop uit het label te halen. Dan kan onder het label een uitklapbare knop met een naam als “Meer over algemene voorwaarden” geplaatst worden. Die knop kan dan opgemaakt worden met aria-expanded=”false” om goed aan te geven dat het een ingeklapte uitklapbare knop is. Bij het openen van de knop met die waarde aangepast worden naar “true” om de toestand (state) van de knop goed over te brengen aan hulpsoftware. Dit probleem komt voor op alle versies van dit formulier die op deze en andere pagina’s in beeld komen. De versie onderaan de homepage is enkel als voorbeeld gebruikt.

Bevinding 45: Advies: Op alle pagina’s van https://npokennis.nl/ staat in het menu een de optie “Dark mode”. Deze knop is met aria opgemaakt als aan en uit schakelaar met de naam “schakel dark mode in of uit”. Door het goed gebruik van aria is het niet nodig om in het tekstalternatief van deze schakelaar extra uitleg te geven. Het advies is dan ook om een kortere waarde van het aria-label zoals “Dark mode” te geven. Er is hier zo goed geprogrammeerd voor hulpsoftware dat aanvullende instructies niet langer nodig zijn.

Onderbouwing van de evaluatie

Het onderzoek is uitgevoerd op basis van de evaluatiemethode van het W3C, WCAG-EM. Dit gebeurt grotendeels handmatig door een steekproef te nemen. Voor een quickscan geldt dat we slechts delen uit deze methodiek gebruiken. Ondanks alle zorgvuldigheid en ervaring van de onderzoeker kan het voorkomen dat een probleem niet gesignaleerd is. Houd er rekening mee dat in een volgend onderzoek bepaalde onderdelen anders worden beoordeeld omdat technologieën en hulpsoftware worden doorontwikkeld. Bij het handmatig onderzoek wordt gebruik gemaakt van tools.

Steekproef getoetste webpagina's

Ondersteunende technieken

Bronnen

Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.

Geprint: 2025-07-07 07:17:37 v2.4-011