Rapport in PDF

Deelonderzoek content werkpleinhartvanwest-brabant.nl

Inleiding

Openbare voorzieningen moeten bruikbaar en toegankelijk zijn voor alle burgers. Net zoals een gebouw rolstoeltoegankelijk moet zijn, moet een website of mobiele app ook bediend kunnen worden door mensen met een beperking. Dit kunnen bijvoorbeeld visuele, auditieve of motorische beperkingen zijn. Denk aan slechtzienden, doven en slechthorenden en mensen die hun handen niet of in beperkte mate kunnen gebruiken. Ook cognitieve factoren spelen een rol: is de content voor iedereen te begrijpen?

Nederlandse overheidsorganisaties moeten voldoen aan de Web Content Accessibility Guidelines (WCAG) versie 2.1, onder de Europese standaard voor overheidswebsites EN 301 549. Deze criteria variëren van technisch functionele eisen zoals een goede werking met het toetsenbord tot aan meer inhoudelijke eisen zoals duidelijke foutmeldingen en een heldere navigatiestructuur.

Dit onderzoek is handmatig uitgevoerd volgens de WCAG-EM evaluatiemethode met ondersteuning van automatische test tools. De pagina’s uit de sample zijn onderzocht op alle 50 criteria onder WCAG 2.1 A en AA. Wanneer aan een criterium niet wordt voldaan, wordt hiervan minimaal één voorbeeld gegeven. Deze bevindingen kunnen op meer plekken voorkomen en moeten daarom structureel worden aangepakt.

De WCAG criteria zijn ingedeeld volgens vier principes, welke ook de leidraad vormen voor dit rapport: Waarneembaar, Bedienbaar, Begrijpelijk en Robuust. Gedetailleerde informatie over deze criteria is te vinden op de website van het W3C (Nederlandse vertaling).

Over deze evaluatie

Rapport auteur
Janita Top
Evaluatie opdrachtgever
iWink
Evaluatiedatum
11 juni 2025

Managementsamenvatting

Dit rapport bevat het deelonderzoek content. In combinatie met het deelonderzoek techniek vormt dit een volledig toegankelijkheidsonderzoek van de website. Uit dit onderzoek blijkt dat wordt voldaan aan 14 van de 26 content-specifieke criteria voor toegankelijkheid. Veel onderdelen van de site zijn dus al goed toegankelijk, maar er zijn nog verbeteringen mogelijk.

Positief is bijvoorbeeld dat er geen zintuiglijke eigenschappen worden gebruikt om betekenis over te brengen, dat er geen afbeeldingen van tekst worden gebruikt en dat de webpagina's goede titels hebben.

Verbeteringen zijn echter nog mogelijk op diverse punten, zoals:

  • Onjuiste of missende alt-teksten bij afbeeldingen
  • Onjuist opegmaakte koppen
  • Missende codelaag in PDF's

Scope van de evaluatie

Website naam
werkpleinhartvanwest-brabant.nl
Scope van de website
Alle pagina's op https://www.werkpleinhartvanwest-brabant.nl/. Niet de pagina's achter inloggen met DigiD (https://mijn.werkpleinhartvanwest-brabant.nl/)
WCAG Versie
2.1
Conformiteitsdoel
AA
Basisniveau van toegankelijkheid-ondersteuning
Gangbare webbrowsers en hulpapparatuur.
Verdere onderzoeksvereisten
Niet ingevuld

Uitgebreide toetsresultaten

Samenvatting

Gerapporteerd over 26 van 50 WCAG 2.1 AA Success Criteria.

Alle resultaten

1 Waarneembaar

1.1 Tekstalternatieven
Success Criterium Uitkomst Bevindingen
1.1.1: Niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Werkpunt voor werkgevers

Uitkomst: Onvoldoende
Hele sample

In de footer staat het logo van Werkplein met een lege alt-tekst. Het logo dient hier echter als kopje voor de contactgegevens. Beter is het om de alt-tekst daarom “Werkplein” mee te geven zodat screenreadergebruikers dezelfde informatie krijgen als ziende gebruikers.

Homepage

Bij het ‘Laatste nieuws’ staat een foto met als alt-tekst “Noodfonds energie”. Dit is geen beschrijving van wat er op de foto te zien is. Geef de foto een correcte beschrijving of laat de alt-tekst leeg.

Werkpunt voor werkgevers

Op deze staan foto’s van contactpersonen. Deze foto’s hebben een lege alt-tekst. Portretfoto’s zijn echter niet decoratief (ze hebben een functie) en moeten daarom altijd een beschrijving hebben van de persoon op de foto. Dit komt ook voor op de pagina’s Banenafspraak en praktijkroute en Verhaal Fatima.
1.2 Op tijd gebaseerde media
Success Criterium Uitkomst Bevindingen
1.2.1: Louter-geluid en louter-videobeeld (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing
1.2.2: Ondertitels voor doven en slechthorenden (vooraf opgenomen)
Hele sample

Uitkomst: Onvoldoende

Sociaal ondernemen

Uitkomst: Onvoldoende
Sociaal ondernemen

De video heeft enkel een automatisch gegenereerde ondertiteling. Deze tekst klopt niet overal. Voeg een correcte ondertiteling toe.
1.2.3: Audiodescriptie of media-alternatief (vooraf opgenomen)
Hele sample

Uitkomst: Onvoldoende

Sociaal ondernemen

Uitkomst: Onvoldoende
Sociaal ondernemen

Aan het einde van de video komt informatie in beeld die niet wordt uitgesproken. Mensen die deze teksten niet kunnen zien, krijgen deze informatie niet mee. Behalve audiodescriptie kan deze informatie ook via een alternatief worden aangeboden, zoals een uitgeschreven tekst onder de video.
1.2.4: Ondertitels voor doven en slechthorenden (live)
Hele sample

Uitkomst: Niet van toepassing
1.2.5: Audiodescriptie (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing
1.3 Aanpasbaar
Success Criterium Uitkomst Bevindingen
1.3.1: Info en relaties
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Veelgestelde vragen

Uitkomst: Onvoldoende

Werkpunt voor werkgevers

Uitkomst: Voldoende

PDF verslag Algemeen Bestuur

Uitkomst: Onvoldoende

PDF wijzigingsformulier

Uitkomst: Onvoldoende
Hele sample

De lijsten binnen het hoofdmenu zijn niet goed opgemaakt. Het eerste item heeft role=”none” waardoor de lijstopmaak weg is gehaald. Dit kan problemen geven voor screenreadergebruikers. Zie screenshot 1. (NB: dit is een andere implementatie dan in het technisch onderzoek)

Homepage

De koppenstructuur klopt niet helemaal. Er staan h2-koppen zoals ‘Hier kunnen we je ook bij helpen‘ met koppen eronder die ook op h2-niveau staan, zoals ‘Een paar voorbeelden’. Deze koppen horen een niveau lager te staan, omdat ze qua betekenis onder de voorgaande h2-kop vallen. Voor screenreadergebruikers die navigeren via koppen is een onjuiste structuur lastig om de content goed te begrijpen.

Contact

Er worden teksten als kop opgemaakt welke geen kop horen te zijn. Het gaat bijvoorbeeld om ‘Wilt u langskomen? Vergeet niet eerst een afspraak te maken.’ Dit staat opgemaakt als een h5-kop (direct na een h2-kop). Maak hier een paragraaf van. Dit komt op meerdere pagina’s voor, bijvoorbeeld ook op de pagina Banenafspraak en praktijkroute. De locaties zijn aangegeven met het strong-element. Hier is het wel beter om (h3-)kopjes te gebruiken (in plaats van strong).

Veelgestelde vragen

Subkopjes binnen de vragen worden opgemaakt met het strong-element in plaats van met kopelementen. Screenreader gebruikers die navigeren via koppen missen deze nu. Maak hier kopelementen van zoals h2 of h3. Zie bijvoorbeeld de kopjes onder de vraag ‘Aanvragen van periodieke bijstand: wat heeft u nodig?’.

Kolomkoppen van tabellen binnen de vragen zijn niet als kop opgemaakt maar met behulp van het strong-element. Screenreaders lezen ze nu niet als kop voor. Maak hier table headers van (th). Zie bijvoorbeeld de tabel onder de vraag ‘Wat is de inkomensgrens naar draagkracht?’. Dit komt op meerdere pagina’s (binnen vragen) voor.

Werkpunt voor werkgevers

Opmerking: er worden op deze pagina veel kopniveaus overgeslagen. Het wordt aangeraden een logische koppenstructuur te bieden zonder niveaus over te slaan. Zie screenshot 2.

PDF verslag Algemeen Bestuur

De PDF heeft geen tags (codelaag) en daardoor is er voor hulpsoftware zoals screenreaders geen informatie beschikbaar om de PDF te interpreteren. Deze codelaag wordt aangemaakt in het bronbestand (bijvoorbeeld Word of Indesign) en moet van daaruit goed worden geëxporteerd. Wanneer de codelaag aanwezig is en aan de richtlijnen voldoet, kan hulpsoftware de inhoud juist weergeven voor de gebruiker, zoals ook bij goed opgebouwde HTML-pagina's het geval is.

PDF wijzigingsformulier

De eerste pagina van het document heeft geen tags (codelaag), waardoor deze informatie niet beschikbaar is voor hulpsoftware. Op pagina 2 t/m 4 zijn veel onderdelen niet correct opgemaakt. Zo staan er cellen opgemaakt als tabel header terwijl dit geen kop maar een invoerveld is. Ook staan veel invoervelden enkel als paragraaf opgemaakt. Voor een screenreadergebruiker is het niet duidelijk dat hier invoervelden staan. Zorg bij een formulier dat alle velden correct zijn opgemaakt en van tekstlabels zijn voorzien.
1.3.2: Betekenisvolle volgorde
Hele sample

Uitkomst: Niet getoetst
1.3.3: Zintuiglijke eigenschappen
Hele sample

Uitkomst: Voldoende
1.3.4: Weergavestand
Hele sample

Uitkomst: Niet getoetst
1.3.5: Identificeer het doel van de input
Hele sample

Uitkomst: Niet getoetst
1.4 Onderscheidbaar
Success Criterium Uitkomst Bevindingen
1.4.1: Gebruik van kleur
Hele sample

Uitkomst: Voldoende
1.4.2: Geluidsbediening
Hele sample

Uitkomst: Niet getoetst
1.4.3: Contrast (minimum)
Hele sample

Uitkomst: Onvoldoende

PDF verslag Algemeen Bestuur

Uitkomst: Onvoldoende
Hele sample

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. Onderstaande elementen op de website zitten qua contrast onder deze waarden.

De knoppen voor “lees voor’ en de tekstgrootte op hover en focus (lichtroze/wit, 2.3:1).

PDF verslag Algemeen Bestuur

De grijze tussenkopjes (2.1:1).
1.4.4: Herschalen van tekst
Hele sample

Uitkomst: Niet getoetst
1.4.5: Afbeeldingen van tekst
Hele sample

Uitkomst: Voldoende
1.4.10: Reflow
Hele sample

Uitkomst: Niet getoetst
1.4.11: Contrast van niet-tekstuele content
Hele sample

Uitkomst: Voldoende
1.4.12: Tekstafstand
Hele sample

Uitkomst: Niet getoetst
1.4.13: Content bij hover of focus
Hele sample

Uitkomst: Niet getoetst

2 Bedienbaar

2.1 Toetsenbordtoegankelijk
Success Criterium Uitkomst Bevindingen
2.1.1: Toetsenbord
Hele sample

Uitkomst: Niet getoetst
Hele sample

Technische bevinding: De knop met het vraagteken in de header (Google Translate) werkt niet met het toetsenbord. Dit is een (span-)element zonder goede interactieve rol. (NB: dit is een andere implementatie dan in het technisch onderzoek)
2.1.2: Geen toetsenbordval
Hele sample

Uitkomst: Niet getoetst
2.1.4: Enkel teken sneltoetsen
Hele sample

Uitkomst: Onvoldoende

Uitkering aanvragen

Uitkomst: Onvoldoende

Sociaal ondernemen

Uitkomst: Onvoldoende
Uitkering aanvragen

Op deze pagina wordt gebruik gemaakt van een videospeler. Binnen deze videospeler is het mogelijk om sneltoetsen van één karakter te gebruiken voor de bediening. Het probleem is hier dat deze sneltoetsen ook actief zijn als de toetsenbordfocus op een ander element binnen de video staat. Dit kan problemen opleveren voor mensen die met spraakbediening werken en waarbij deze letters kunnen voorkomen in de woorden die uitgesproken worden. Ook kan dit problemen opleveren voor mensen die per ongeluk een toets op het toetsenbord indrukken. Bij deze Vimeo-videospeler kan dit opgelost worden door de parameter keyboard=false toe te voegen aan de URI van de video in de HTML-code. De bediening met deze toetsen wordt dan uitgeschakeld, maar het is dan nog wel mogelijk om de video te bedienen met het toetsenbord. Zie ook de Engelstalige pagina https://vimeo.zendesk.com/hc/en-us/articles/360001494447-Using-Player-Parameters.

Sociaal ondernemen

Op deze pagina wordt gebruik gemaakt van een videospeler. Binnen deze videospeler is het mogelijk om sneltoetsen van één karakter te gebruiken voor de bediening. Een oplossing is om de embedcode van de YouTube video aanpassen zodat de bediening met tekentoetsen uit staat. De eigenschap die toegevoegd moet worden aan de embedcode is 'disablekb=1'. Dus op deze manier: src="https://www.youtube.com/embed/_XXXXXXXXXX?disablekb=1" Zie ook https://developers.google.com/youtube/player_parameters#disablekb
2.2 Genoeg tijd
Success Criterium Uitkomst Bevindingen
2.2.1: Timing aanpasbaar
Hele sample

Uitkomst: Niet getoetst
2.2.2: Pauzeren, stoppen, verbergen
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende
Homepage

De carrousel bovenaan de pagina toont afwisselend verschillende afbeeldingen met verschillende teksten. Deze beweging is niet te stoppen of te pauzeren. Dit is hinderlijk voor mensen die bijvoorbeeld concentratieproblemen hebben of ADHD. De beweging leidt erg af van de tekst. Zorg ervoor dat er een mechanisme komt om de carrousel stop te zetten, bijvoorbeeld een pauzeknop. (NB: dit is een technische bevinding, maar een dergelijke carrousel was niet als component aanwezig in het technische onderzoek. Daarom wordt het hier opgenomen.)
2.3 Toevallen en fysieke reacties
Success Criterium Uitkomst Bevindingen
2.3.1: Drie flitsen of beneden drempelwaarde
Hele sample

Uitkomst: Voldoende
2.4 Navigeerbaar
Success Criterium Uitkomst Bevindingen
2.4.1: Blokken omzeilen
Hele sample

Uitkomst: Niet getoetst
2.4.2: Paginatitel
Hele sample

Uitkomst: Onvoldoende

PDF wijzigingsformulier

Uitkomst: Onvoldoende
PDF wijzigingsformulier

PDF wijzigingsformulier Het PDF-bestand heeft geen titel. Voor gebruikers van hulpsoftware is het voor de navigatie tussen documenten 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. Stel daarnaast in de eigenschappen in dat de documenttitel wordt getoond in plaats van de bestandsnaam.
2.4.3: Focus volgorde
Hele sample

Uitkomst: Niet getoetst
2.4.4: Linkdoel (in context)
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Extra geld en meedoen

Uitkomst: Voldoende
Homepage

Onder de kop ‘Adviesraad: praat mee!’ staat een link met enkel de tekst ‘Lees meer’. Dit maakt niet duidelijk waar deze link naartoe gaat. ​​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 tekst toe aan de link die duidelijk maakt waar het precies om gaat. 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, bijvoorbeeld de h2-kop die ervoor staat. Zie voor meer info https://www.w3.org/TR/WCAG20-TECHS/ARIA7.html. Dit komt op meerdere pagina’s voor, bijvoorbeeld ook op de pagina Uitkering aanvragen.

Extra geld en meedoen

Opmerking: de linkblokken bevatten veel dubbele tekst voor screenreadergebruikers, zie bijvoorbeeld de linktekst ‘Bijzondere kosten (Bijzondere bijstand) Meer informatie over Bijzondere kosten (Bijzondere bijstand)’. Een betere oplossing is om alleen de eerste tekst (nu een kop) als ‘gewone’ linktekst te gebruiken (zonder kopopmaak) en het deel vanaf ‘Meer informatie…’ weg te laten. Dit komt op meerdere pagina’s voor, ook bijvoorbeeld op de pagina Werkpunt voor werkgevers (dubbele tekst zonder ‘Meer informatie…’). Zie screenshot 3.
2.4.5: Meerdere manieren
Hele sample

Uitkomst: Niet getoetst
2.4.6: Koppen en labels
Hele sample

Uitkomst: Voldoende
2.4.7: Focus zichtbaar
Hele sample

Uitkomst: Niet getoetst
2.5 Input Modaliteiten
Success Criterium Uitkomst Bevindingen
2.5.1: Aanwijzergebaren
Hele sample

Uitkomst: Niet getoetst
2.5.2: Aanwijzerannulering
Hele sample

Uitkomst: Niet getoetst
2.5.3: Label in naam
Hele sample

Uitkomst: Voldoende
2.5.4: Bewegingsactivering
Hele sample

Uitkomst: Niet getoetst

3 Begrijpelijk

3.1 Leesbaar
Success Criterium Uitkomst Bevindingen
3.1.1: Taal van de pagina
Hele sample

Uitkomst: Onvoldoende

PDF verslag Algemeen Bestuur

Uitkomst: Onvoldoende

PDF wijzigingsformulier

Uitkomst: Onvoldoende
PDF verslag Algemeen Bestuur

Het document heeft geen taal gespecificeerd. Screenreaders lezen de pdf mogelijk niet in de juiste taal voor. Stel de juiste taal in bij de documenteigenschappen in Acrobat.

PDF wijzigingsformulier

Het document heeft geen taal gespecificeerd. Screenreaders lezen de pdf mogelijk niet in de juiste taal voor. Stel de juiste taal in bij de documenteigenschappen in Acrobat.
3.1.2: Taal van onderdelen
Hele sample

Uitkomst: Onvoldoende

Help with civic integration

Uitkomst: Onvoldoende
Help with civic integration

Het gedeelte met de Engelse content is niet in de code aangegeven als Engels. Screenreaders kunnen hierdoor niet de juiste taal bepalen voor dit onderdeel en lezen het mogelijk verkeerd voor. Geef de taal van de Engelse tekst aan met het attribuut lang="en" op het betreffende element.
3.2 Voorspelbaar
Success Criterium Uitkomst Bevindingen
3.2.1: Bij focus
Hele sample

Uitkomst: Niet getoetst
3.2.2: Bij input
Hele sample

Uitkomst: Niet getoetst
3.2.3: Consistente navigatie
Hele sample

Uitkomst: Niet getoetst
3.2.4: Consistente identificatie
Hele sample

Uitkomst: Voldoende
3.3 Assistentie bij invoer
Success Criterium Uitkomst Bevindingen
3.3.1: Foutidentificatie
Hele sample

Uitkomst: Niet van toepassing
3.3.2: Labels of instructies
Hele sample

Uitkomst: Niet van toepassing
3.3.3: Foutsuggestie
Hele sample

Uitkomst: Niet van toepassing
3.3.4: Foutpreventie (wettelijk, financieel, gegevens
Hele sample

Uitkomst: Niet getoetst

4 Robuust

4.1 Compatibel
Success Criterium Uitkomst Bevindingen
4.1.1: Parsen
Hele sample

Uitkomst: Niet getoetst
4.1.2: Naam, rol, waarde
Hele sample

Uitkomst: Onvoldoende

Uitkering aanvragen

Uitkomst: Onvoldoende
Uitkering aanvragen

De iframes met video’s hebben geen toegankelijke naam. Gebruikers van hulpsoftware weten niet wat er in dit iframe staat en of ze deze daarom willen openen of overslaan. Voeg bijvoorbeeld een title attribuut met beschrijving toe of een aria-label.

Onderaan de pagina staan 2 kleine embedded video’s. Deze hebben een knop met ongeldige ARIA-opmaak aria-haspopup="modal".
4.1.3: Statusberichten
Hele sample

Uitkomst: Niet getoetst

Sample

  1. Homepage - https://www.werkpleinhartvanwest-brabant.nl/
  2. Contact - https://www.werkpleinhartvanwest-brabant.nl/contact-opnemen
  3. Uitkering aanvragen - https://www.werkpleinhartvanwest-brabant.nl/een-uitkering-aanvragen
  4. Veelgestelde vragen - https://www.werkpleinhartvanwest-brabant.nl/veelgestelde-vragen
  5. Werkpunt voor werkgevers - https://www.werkpleinhartvanwest-brabant.nl/voor-werkgevers/werkpunt
  6. Sociaal ondernemen - https://www.werkpleinhartvanwest-brabant.nl/voor-werkgevers/sroi
  7. Zoekresultaten - https://www.werkpleinhartvanwest-brabant.nl/zoeken?q=toeslagen
  8. Extra geld en meedoen - https://werkpleinhartvanwestbrabant.sites.kirra.nl/extra-geld-en-meedoen
  9. Help with civic integration - https://werkpleinhartvanwestbrabant.sites.kirra.nl/werk-vinden-en-inburgeren/hulp-bij-inburgering/help-with-civic-integration
  10. Ali’s groeiverhaal bij HOF Kabelfabriek - https://werkpleinhartvanwestbrabant.sites.kirra.nl/nieuws/alis-groeiverhaal-bij-hof-kabelfabriek
  11. Collectieve zorgverzekering - https://www.werkpleinhartvanwest-brabant.nl/extra-geld-en-meedoen/collectieve-zorgverzekering
  12. Verhaal Fatima - https://www.werkpleinhartvanwest-brabant.nl/verhalen-van-inwoners-en-werkpleiners/fatima-zorgkracht-met-rijbewijs
  13. PDF verslag Algemeen Bestuur - https://www.werkpleinhartvanwest-brabant.nl/uploads/fckconnector/5d4ec80e-d144-56a2-a4a9-a01baabf7424
  14. PDF wijzigingsformulier - https://werkpleinhartvanwestbrabant.sites.kirra.nl/uploads/bestanden/7b1296a0-ec3b-5161-800f-7f276a481de5/3348787243/wijzigingsformulier_werkplein_hart_van_west-brabant%20T5.pdf
  15. Banenafspraak en praktijkroute - https://www.werkpleinhartvanwest-brabant.nl/voor-werkgevers/banenafspraak-en-praktijkroute

Technologie

HTML,CSS,WAI-ARIA,JavaScript,SVG,PDF,DOM

Onderbouwing van de evaluatie

Gebruikte systemen tijdens het onderzoek:

Screenshots

  1. hoofdmenu in web inspector
    Figuur 1: de lijst van het hoofdmenu is niet correct opgemaakt
    ↩
  2. koppenlijst
    Figuur 2: er worden veel kopniveaus overgeslagen
    ↩
  3. linkblokken in web inspector
    Figuur 3: links hebben dubbele teksten
    ↩