Rapport:
Audit digitale toegankelijkheid website Provalu.nl

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina is het logo te vinden, deze staat in een link. De afbeelding waarop het logo staat heeft geen alternatieve tekst, waardoor voor bezoekers die niet kunnen zien niet duidelijk is dat hier het logo staat. Een alternatieve tekst van deze afbeelding zou ook een beschrijving van het linkdoel leveren, waarmee zowel de link als de afbeelding toegankelijk zouden worden. Los dit op door bij het alt-attribuut van de afbeelding (img) een tekst toe te voegen die zowel het woord 'logo' als alle tekst die op het logo te zien is bevat. Dit komt ook voor bij het logo dat te vinden is in het dialoogscherm met het inschrijfformulier, deze is te vinden via de link 'Aanmelden voor nieuwsbrief' in de footer. Zie ook succescriterium 2.4.4 en 4.1.2.

Op pagina https://www.provalu.nl/404 staat een afbeelding met de tekst 'Oeps! De pagina bestaat niet'. De tekst staat op een afbeelding die voor hulpsoftware is verborgen middels een leeg alt-attribuut. Daarom is deze informatie niet beschikbaar voor bezoekers die niet kunnen zien. Meerdere oplossingen zijn mogelijk. De afbeelding kan een alternatieve tekst krijgen (via het alt-attribuut) waarin alle tekst terugkomt die op de afbeelding te zien is, of/en de tekst van de afbeelding kan als gewone tekst op de pagina worden geplaatst. Zie succescriterium 1.4.5.

Op pagina https://www.provalu.nl/over-ons/ staat onder de kop 'Samenwerkingspartners/netwerkorganisaties' een slider. Deze bevat afbeeldingen met logo's. Deze afbeeldingen zijn voor hulpsoftware verborgen middels een leeg alt-attribuut. Logo's brengen altijd belangrijke informatie over. Geef deze daarom een alternatieve tekst waarin zowel het woord 'logo' als alle tekst die op de afbeelding te zien is, terugkomt. Dit komt ook voor op pagina https://www.provalu.nl/over-ons/ik-wil-werk-uitbesteden/ bij de slider onder de kop 'Wie gingen u voor?'.

Op pagina https://www.provalu.nl/waardemakers/ staan blokken met afbeeldingen, tekst en links. De afbeeldingen hebben via het alt-attribuut een alternatieve tekst gekregen, deze geeft ook de link waar de afbeelding in staat een toegankelijke naam. De alternatieve tekst beschrijft zowel de afbeelding als het linkdoel onvoldoende. Bij 'KLM biedt stabiele werkgelegenheid' is de alternatieve tekst 'W4A8218dklein'. Pas de alternatieve teksten aan. Zie overigens ook succescriterium 2.4.4. voor opmerkingen over de links in deze blokken.

Op pagina https://www.provalu.nl/nieuwsberichten/werkbezoek-noordwijk-aan-provalu-innovatie-en-samenwerking-in-de-praktijk/ staan afbeeldingen met foto's van het werkbezoek. Deze hebben via het alt-attribuut een alternatieve tekst gekregen. Deze is onvoldoende beschrijvend. Het gaat bijvoorbeeld om '20250326 werkbezoek1' en '20250326 werkbezoek2'. Dit maakt niet duidelijk wat er op de afbeelding te zien is. Vervang de tekst zodat dit beter beschreven wordt. Als het hier gaat om decoratieve afbeeldingen is het niet verplicht om deze alternatieve teksten te geven, deze kunnen worden verborgen voor hulpsoftware via een leeg alt-attribuut.

In het PDF document https://www.provalu.nl/assets/files/algemene-verkoopvoorwaarden-provalu-productie-en-detachering-def.pdf komt op elke pagina een afbeelding voor die het logo bevat. Deze afbeeldingen hebben geen alternatieve tekst, waardoor voor bezoekers die niet kunnen zien de informatie die het logo overbrengt niet beschikbaar is. Het is niet nodig om het logo op elke pagina van een alternatieve tekst te voorzien, maar wel op de eerste pagina. Zorg dat de alternatieve tekst het woord 'logo' bevat en alle tekst die in het logo te zien is.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staat bij de kop 'Werkgeversservicepunt Holland Rijnland' een afbeelding die als alternatieve tekst 'Marijke en Jeremy 2210' heeft. '2210' kan hieruit worden verwijderd. Het is wel goed dat de afbeelding een alternatieve tekst heeft, omdat deze in een slider staat.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staan bij de portretfoto's bij de citaten boven de footer afbeeldingen met alternatieve tekst. Bijvoorbeeld bij 'Concierge Bob - basisschool de Egelantier', waar de alternatieve tekst 'Bob2 DEF' is. Zorg dat de alternatieve tekst kloppend is. Een goede oplossing zou zijn om de combinatie van fig en fig caption elementen te gebruiken om hulpsoftware het verband te laten zien tussen de teksten en de afbeeldingen.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/ is er in de video bij 'Schoonmaakunit' alleen automatisch gegenereerde ondertiteling beschikbaar. Hierin ontbreekt interpunctie en worden sommige woorden verkeerd ondertiteld. Bijvoorbeeld op tijdstip 0:06 het woordt Provalu dat wordt ondertiteld als 'proflu', en 'Unit schoonmaak' als 'juridisch schoonmaak'. Los dit op door zelf ondertiteling toe te voegen.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/ is er in de video bij 'Schoonmaakunit' op verschillende plaatsen tekst in beeld, bijvoorbeeld in de eerste seconden het logo met tekst, en bij tijdstip 0:07 de naam en functie van de spreker. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Daardoor kunnen bezoekers die niet kunnen zien niet weten wat er wordt getoond in de video. Zet deze informatie in een transcript om te voldoen aan dit succes criterium. Of maak gebruik van een extra audiospoor om ook te voldoen aan succescriterium 1.2.5.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/ is er in de video bij 'Schoonmaakunit' op verschillende plaatsen tekst in beeld, bijvoorbeeld in de eerste seconden het logo met tekst, en bij tijdstip 0:07 de naam en functie van de spreker. Voeg deze informatie toe aan de audiodescriptie, of laat alle informatie uitspreken door de voiceover waardoor de audiodescriptie overbodig wordt.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/contact/ staat in de header de tekst 'Contact'. Deze tekst is een koptekst, al is deze niet als zodanig opgemaakt. Bezoekers die gebruik maken van hulpsoftware kunnen aan de hand van een koppenstructuur efficient navigeren over de pagina, daarom is het belangrijk dat deze structuur goed is opgebouwd. Zorg ervoor dat de tekst 'Contact' wordt opgemaakt als kop op kopniveau h1. Ditzelfde probleem doet zich op meerdere pagina's voor, bijvoorbeeld pagina https://www.provalu.nl/over-ons/ waar het gaat om de tekst 'Over ons' in de header. Een ander voorbeeld doet zich voor op pagina https://www.provalu.nl/over-ons/ik-wil-werk-uitbesteden/ bij de tekst 'Ik wil werk uitbesteden'.

Op pagina https://www.provalu.nl/over-ons/ik-wil-werk-uitbesteden/ staat het citaat 'Provalu neemt graag het werk uit handen'. Dit is opgemaakt als kop. De functie van een kop is het beschrijven van bijbehorende content, en dat is hier niet aanwezig. Deze tekst is geen kop, en mag daarom niet als zodanig worden opgemaakt. Los dit op door dit op andere wijze op te maken, en de styling aan te passen in bijvoorbeeld CSS. Dit doet zich op meerdere pagina's voor, bijvoorbeeld op https://www.provalu.nl/contact/ bij de tekst 'Samen maken we de waarde van werk mogelijk'.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/ staan video's met daarbij een tekst. Bijvoorbeeld 'Groenvoorziening'. Visueel is te herkennen dat deze begint met een kop, maar in HTML is deze niet als kop opgemaakt. Voor bezoekers die hulpsoftware gebruiken is deze tekst daardoor niet terug te vinden in de koppenstructuur. Zorg ervoor dat tekst die de functie van een kop heeft als daadwerkelijke kop op het juiste kopniveau wordt opgemaakt. Een soortgelijk probleem komt voor op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/ bij de kop 'Adviseurs ontvangen laptops van Randstad voor test en training. Deze tekst zou als h1-kop moeten worden opgemaakt. Een ander voorbeeld komt voor op pagina https://www.provalu.nl/waardemakers/ in de blokken, bijvoorbeeld 'Sportieve waardemaker'.

Indien men een pagina uit de navigatiebalk bezoekt, zoals https://www.provalu.nl/over-ons/, is dit visueel herkenbaar gemaakt doormiddel van styling van het menu item. Voor bezoekers die hulpsoftware zoals een screenreader gebruiken is deze informatie niet beschikbaar. Los dit bijvoorbeeld op door het aria-current="page" attribuut toe te voegen. Dit komt op meerdere pagina's voor.

Op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/ is een tekst visueel herkenbaar gemaakt als kop, door deze met het strong-element op te maken. Het strong-element is hiervoor niet geschikt, deze heeft een andere semantische betekenis dan een kop. Als een tekst een kop is, moet deze als zodanig worden opgemaakt zodat deze in de koppenstructuur terug komt. Het gaat om de tekst 'Social Return on Investment volledig benutten'. Maak de koppen op als kop op het juiste kopniveau. Dit probleem komt op meerdere plekken voor, bijvoorbeeld ook op pagina https://www.provalu.nl/waardemakers/ in de dialoogvensters die in de blokken (bijvoorbeeld 'Sportieve waardemaker') kunnen worden geopend (het gaat dan om de kop 'Sportief ondanks fysieke beperking'). Ook op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/ is meerdere keren het strong-element gebruikt voor de opmaak van koppen (bijvoorbeeld 'Vergaderdata' en 'Bezoekadres').

Op pagina https://www.provalu.nl/nieuws/ staat onder de kop 'Technisch talent met een doel voor ogen' een dikgedrukte tekst. Deze is met het strong-element opgemaakt. Omdat het strong-element semantische betekenis heeft, mag deze alleen in overeenstemming hiermee worden gebruikt. Dat houdt in bij enkele woorden die nadruk verdienen ten opzichte van omliggende tekst. Het strong-element is niet geschikt om een stuk tekst mee te stylen. Verwijder om dit op te lossen het strong-element en pas de styling eventueel aan in CSS. Ditzelfde artikel met hetzelfde probleem komt ook voor op andere pagina's, bijvoorbeeld https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/.

De PDF https://www.provalu.nl/assets/files/privacyverklaring-provalu.pdf is niet gecodeerd (van tags voorzien). Dit betekent dat de documentstructuur niet is te bepalen door hulpsoftware. Er kan daardoor bijvoorbeeld niet worden bepaald wat koppen zijn, wat de alternatieve tekst bij afbeeldingen en wat de leesvolgorde is. Omdat tags ontbreken kan de PDF niet volledig onderzocht worden (alle succescriteria met betrekking tot de PDF code laag zoals semantische koppen en alternatieve teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.

De PDF https://www.provalu.nl/assets/files/algemene-verkoopvoorwaarden-provalu-productie-en-detachering-def.pdf bevat meerdere lege tags in de codelaag. Zo zijn er op pagina 1 meerdere lege p-tags te vinden, op pagina 2 een lege H1-tag en op pagina 5 een lege H3-tag. Verwijder lege tags uit de codelaag.

Advies: In de footer van elke pagina staat informatie onder 'Adresgegevens'. Als scheidings-tekens is een stip gebruikt die door hulpsofware wordt voorgelezen als 'opsommingsteken'. Dit levert geen daadwerkelijk toegankelijkheidsprobleem op, maar omdat deze normaalgesproken alleen bij lijsten worden gebruikt kan het de indruk wekken dat een deel van de informatie in een lijst staat. Mogelijk is het beter om te kiezen voor een ander teken, bijvoorbeeld de horizontale balk '|', deze wordt niet door hulpsoftware voorgelezen. Dit komt ook voor op pagina https://www.provalu.nl/contact/ onder 'Route'.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staan citaten, bijvoorbeeld van 'Concierge Bob - basisschool de Egelantier'. Hierbij is 'Congierge' opgemaakt met kopniveau h3. Omdat het citaat bij deze kop hoort, is het belangrijk dat deze pas na de kop wordt voorgelezen door hulpsoftware. Als bezoekers die hiervan gebruik maken door de verschillende citaten navigeren, is het anders onduidelijk welk citaat bij welke persoon hoort. Pas bijvoorbeeld in HTML de volgorde aan, zodat eerst de kop en daarna de bijbehorende content en afbeelding worden voorgelezen. Visueel mag de huidige volgorde wel worden aangehouden.

Op pagina https://www.provalu.nl/over-ons/vacatures/ bestaat de vacature uit een afbeelding met daaronder tekst die begint met een kop. De afbeelding heeft een alternatieve tekst en wordt daardoor door hulpsoftware voorgelezen. Daarom is het belangrijk dat de afbeelding in HTML ná de kop wordt geplaatst. Anders is het niet duidelijk dat de afbeelding bij deze kop hoort. In dit geval valt te overwegen of het om een decoratieve afbeelding gaat, in dat geval kan de alternatieve tekst worden verwijderd en de afbeelding doormiddel van een leeg attribuut voor hulpsoftware worden verborgen. Dan hoeft de volgorde niet aangepast te worden. Een soortgelijk probleem doet zich voor op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/, bijvoorbeeld bij de foto voorafgaand aan 'Technisch talent met een doel voor ogen'.

Advies: Op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/ staan onder de kop 'Bestuursleden' portretfoto's met daaronder de naam, die als kop is opgemaakt. Voor bezoekers die niet kunnen zien en hier via hulpsoftware doorheen navigeren, kan onduidelijkheid ontstaan over welke foto waarbij hoort. Dit is niet afgekeurd op toegankelijkheid, omdat de alternatieve tekst de naam bevat van de persoon die ook in de tekst wordt beschreven. Hierdoor zal dit in de praktijk geen toegankelijkheidsprobleem opleveren. Om de structuur van de content voorspelbaarder te maken zou het wel goed zijn om in HTML de kop bovenaan te zetten en alle bijbehorende content eronder. De visuele volgorde hoeft niet te worden aangepast.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. In het veld 'Naam' kan de naam worden ingevuld, en in het veld 'E-mailadres' het e-mailadres. Het doel van deze en een aantal andere velden moet programmatisch kunnen worden bepaald, zodat velden automatisch kunnen worden ingevuld of extra hulp kan worden geboden bij het invullen. Dit kan door het autocomplete-attribuut aan de input-elementen toe te voegen. Bijvoorbeeld voor e-mailadres autocomplete="email". Een soortgelijk probleem komt voor bij de invoervelden in het inschrijfformulier voor de nieuwsbrief, deze kan worden gevonden door het dialoogscherm te openen via de link 'Aanmelden voor nieuwsbrief' in de footer. Ditzelfde komt voor op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/, bij het formulier 'Stel een vraag'.

Uitkomst: Onvoldoende

Bevindingen: Op verschillende pagina's, bijvoorbeeld https://www.provalu.nl, staan links die bij focus van kleur veranderen. Bijvoorbeeld de link 'Ik zoek medewerkers'. Als deze focus heeft is dat alleen aan kleur te herkennen. Voor bezoekers die geen kleuren kunnen onderscheiden, is het dan niet goed te zien waar de focus zich bevindt. Zorg dat informatie nooit alléén door kleur wordt overgebracht. Los dit bijvoorbeeld op door een focusrand toe te voegen, of door te kiezen voor een hoger kleurcontrast (hoger dan 3:1) zodat niet alleen kleur maar ook helderheid de informatie overbrengt.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op onder andere pagina https://www.provalu.nl/ is in het menu de knop 'Contact' te vinden, en in de footer de knop 'Aanmelden voor nieuwsbrief'. Voor beide knoppen geldt dat de witte tekst onvoldoende contrast heeft met beige (HEX #D4B075) achtergrondkleur. Hierdoor is de tekst voor sommige bezoekers lastig of niet te lezen. De contrastverhouding is 2:1 waar deze minimaal 4,5:1 moet zijn. Als op de pagina gescrolled wordt, komen sommige links (zoals 'Ik zoek werk') op een andere achtergrond terecht, waardoor ditzelfde kleurcontrast ontstaat. Deze knoppen en links komen ook op andere pagina's voor. Op andere pagina's komt ook een soortgelijk probleem voor bij andere elementen die deze kleurencombinatie gebruiken, bijvoorbeeld op pagina https://www.provalu.nl/contact/ bij de knop 'Versturen' en de tekst 'Samen maken we de waarde van werk mogelijk'. Een ander voorbeeld is op pagina https://www.provalu.nl/zoek/, hier gaat het om de koppen in de zoekresultaten.

Op pagina https://www.provalu.nl/over-ons/ staat de kop 'Werken bij Provalu'. De woorden 'bij Provalu' zijn beige (HEX #D4B075) en hebben onvoldoende contrast met de witte achtergrond. De contrastverhouding is 2:1. Omdat het om een groot en dikgedrukt lettertype gaat gelden andere contrasteisen, de contrastverhouding moet hier minimaal 3:1 zijn.

Als op onder andere pagina https://www.provalu.nl/contact/ de focus naar de links in het zij-menu wordt gebracht (bijvoorbeeld 'Ik zoek medewerkers'), wordt de tekstkleur beige (HEX #D4B075). Deze kleur heeft onvoldoende contrast met de donkergroene (HEX #336E70) achtergrond. De contrastverhouding is 2,8:1 waar deze minimaal 4,5:1 moet zijn.

Als op onder andere pagina https://www.provalu.nl/contact/ de focus naar de links in het zij-menu wordt gebracht (bijvoorbeeld 'Ik zoek medewerkers'), wordt de tekstkleur beige (HEX #D4B075). Als op de pagina gescrolled wordt, komen de links deels terecht op een achtergrond met diezelfde kleur. Als de focus dan naar de links wordt gebracht, ontstaat een kleurcontrast van 1:1 waardoor deze helemaal niet meer te zien is. Zorg dat het kleurcontrast minimaal 4,5:1 is.

In de footer staat een tekst met twee links, 'Provalu 2021 / privacyverklaring / verkoopvoorwaarden'. De tekstkleur (HEX #6D8182) heeft onvoldoende contrast met de donkergroene (HEX #0C2D2E) achtergrond. De tekstkleur heeft een transparantie van 0,4. De contrastverhouding is 3,5:1 waar deze minimaal 4,5:1 moet zijn. Wijzig de transparantie of kies voor een andere kleur (met voldoende contrast) om dit op te lossen.

Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. In de invoervelden is een placeholder met labeltekst geplaatst. De grijsgekleurde (HEX #9AA5B3) tekst heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 2,5:1 waar deze minimaal 4,5:1 moet zijn. In dit geval is het belangrijk dat er niet alleen voor een kleurencombinatie met voldoende contrast wordt gekozen, maar ook dat de labels buiten de velden worden geplaatst zodat deze zichtbaar blijven. Zie hiervoor succescriterium 3.3.2. Ditzelfde komt voor op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/ bij het formulier 'Stel een vraag'.

Op pagina https://www.provalu.nl/over-ons/ staan links met de tekst 'Meer lezen', bijvoorbeeld bij 'Ik zoek werk'. De beige (HEX #D4B075) tekstkleur heeft onvoldoende contrast met de grijze (HEX #EDF2F7) achtergrond. De contrastverhouding is 1,8:1 waar deze minimaal 4,5:1 moet zijn.

Op pagina https://www.provalu.nl/over-ons/ ontstaat bij inzoomen een contrast-probleem. Groene (HEX #336E70) tekst valt dan op groene (HEX #336E70) achtergrond, waardoor deze onzichtbaar wordt. De contrastverhouding is 1:1 waar deze minimaal 4,5:1 moet zijn.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staat de link 'Werkgeversservicepunt Holland Rijnland'. De donker-beige (HEX #D6B080) tekstkleur heeft onvoldoende contrast met de beige (HEX #F5E5CB) achtergrond. De contrastverhouding is 1,6:1 waar deze minimaal 4,5:1 moet zijn.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. In dit dialoogvenster staat de rode (HEX #E8412A) knop met witte tekst 'Inschrijven'. Het contrast is te laag. De contrastverhouding is 4:1 waar deze minimaal 4,5:1 moet zijn.

Op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/?page=2 staat een paginering, waarin de knop die bij de actieve pagina hoort de kleurencombinatie wit-beige (HEX #D4B075) voorkomt. De contrastverhouding is 2:1 waar deze minimaal 4,5:1 moet zijn. Dit komt ook voor op pagina https://www.provalu.nl/nieuws/ en https://www.provalu.nl/nieuwsberichten/werkbezoek-noordwijk-aan-provalu-innovatie-en-samenwerking-in-de-praktijk/ bij de paginering.

Op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/ staat een formulier onder 'Stel een vraag'. Als dit formulier wordt verzonden verschijnt de melding 'Het formulier is verzonden'. De groene (HEX #3F9160) tekstkleur heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 3,8:1 waar deze minimaal 4,5:1 moet zijn.

Uitkomst: Onvoldoende

Bevindingen: Als de pagina's (bijvoorbeeld https://www.provalu.nl/) worden bekeken bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd vanaf 175%, wordt een deel van de tekst in de header bedekt door andere content. Hierdoor is niet alle tekst leesbaar. Zorg dat bij het inzoomen alle tekst in beeld blijft.

Op elke pagina behalve de homepagina, bijvoorbeeld https://www.provalu.nl/contact/, verdwijnt het menu van de pagina als deze bekeken wordt bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd vanaf 175%. Op de homepagina verschijnt een hamburgermenuknop waaronder het menu is samengevouwen, maar dit is op de overige pagina's niet zo. Hier verschijnt de menuknop pas als er verder wordt ingezoomd naar 300%. Los dit bijvoorbeeld op door ook op deze pagina's een menuknop te plaatsen en te zorgen dat deze toegankelijk is (zie hiervoor ook succescriterium 4.1.2. met opmerkingen over de menuknop).

Als op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ bij een schermgrootte van 1280 bij 1024 pixels wordt ingezoomd vanaf 110%, verdwijnt een deel van de koptekst 'Werkgeversservicepunt Holland Rijnland' achter een afbeelding. Zorg dat de tekst zichtbaar blijft en dat content elkaar niet bedekt bij het inzoomen.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/404 staat een afbeelding met de tekst 'Oeps! De pagina bestaat niet'. Omdat de tekst op een afbeelding staat, is deze niet visueel aanpasbaar aan de eisen van de bezoeker, zoals dat met gewone tekst wel kan worden gedaan (tekstgrootte, regelafstand). Daardoor kan het voor bezoekers die bijvoorbeeld slechtziend zijn zo zijn dat deze informatie voor hen niet beschikbaar is. Een oplossing zou zijn om de tekst als gewone tekst op de pagina te zetten. Voor bezoekers die blind zijn wordt de tekst ook niet voorgelezen door hulpsoftware, omdat de afbeelding voor hulpsoftware wordt verborgen. Ook voor hen zou het een goede oplossing zijn om de informatie als gewone tekst op de pagina te plaatsen. Zie ook succescriterium 1.1.1.

Uitkomst: Onvoldoende

Bevindingen: Als de pagina's (bijvoorbeeld https://www.provalu.nl/) worden bekeken bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd tot 400%, valt een deel van de teksten uit beeld. Bijvoorbeeld de koptekst 'Meerwaarde door werk' en de tekst die hieronder staat, in de header. Zorg ervoor dat alle content meeschaalt en in beeld blijft bij het inzoomen, zonder dat er een scrollbalk in de leesrichting ontstaat. Een ander voorbeeld is pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/.

Op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/?page=2 komt er bij een schermgrootte van 1280 bij 1024 pixels als wordt ingezoomd vanaf 300%, een deel van het logo over de tekst 'Vind samen met Provalu werk dat bij je past' heen. Daardoor is de tekst niet meer goed te lezen. Zorg dat content elkaar niet gaat bedekken bij het inzoomen.

Op pagina https://www.provalu.nl/waardemakers/ kunnen dialoogschermen worden geopend, bijvoorbeeld bij 'Sportieve waardemaker'. Als de pagina wordt bekeken bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd tot 400%, valt een deel van de tekst op het dialoogscherm buiten beeld. Zorg dat bij het inzoomen geen content verloren gaat.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ staat onder de kop 'Samenwerkingspartners/netwerkorganisaties' een slider. Deze bevat twee knoppen (opgemaakt als links) waarmee de bezoeker de slider naar voren of achteren kan laten sliden. De grijsgekleurde (HEX #9AA5B1) knoppen hebben onvoldoende contrast met de beige (HEX F5E5CB) achtergrond. De contrastverhouding is 2:1 waar deze minimaal 3:1 moet zijn. Dit komt ook voor op pagina https://www.provalu.nl/over-ons/ik-wil-werk-uitbesteden/ onder de kop 'Wie gingen u voor?'.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staat een slider bij de kop 'Werkgeversservicepunt Holland Rijnland'. De knoppen (opgemaakt als links) waarmee de bezoeker de slider naar voren of achteren kan laten sliden hebben onvoldoende contrast en zijn daardoor slecht zichtbaar. Per afbeelding vallen deze op een andere achtergrondkleur. Een voorbeeld is wanneer de grijze (HEX #9AA5B1) knoppen vallen op een grijsbruine (HEX #A38F8C) achtergrond. De contrastverhouding is dan 1,2:1 waar deze minimaal 3:1 moet zijn.

Het inschrijfformulier voor de nieuwsbrief (te vinden via de link 'Aanmelden voor nieuwsbrief' in de footer) bevat invoervelden. Deze zijn witgekleurd en bevatten een lichtgrijze (HEX #CCCCCC) omranding. De kleur daaromheen is nog lichter dan deze grijstint. Voor bezoekers die slecht zicht hebben of kleurenblind zijn, is het hierdoor lastig te zien waar de invoervelden zich precies bevinden. De contrastverhouding tussen de omranding en het veld is 1,6:1 waar deze minimaal 3:1 moet zijn.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's, bijvoorbeeld https://www.provalu.nl/, kan via het menu-item 'Over ons' een submenu worden uitgevouwen via de muisaanwijzer. Via het toetsenbord is dat niet mogelijk. De submenu-items zijn daardoor niet beschikbaar voor bezoekers die navigeren via het toetsenbord. Zorg ervoor dat het submenu ook uitgevouwen kan worden via het toetsenbord, en dat correct wordt aangekondigd (aria-expanded) dat hier een submenu kan worden uitgevouwen.

Op pagina https://www.provalu.nl/zoek/ kan een zoekterm worden ingevuld in het zoekveld. Als dit wordt gedaan, verschijnt een lijst met zoekresultaten en in het zoekveld verschijnt een knop waarmee deze kan worden afgesloten (x). Deze knop is via het toetsenbord niet te bereiken en bedienen. De focus kan hier niet naartoe worden gebracht. Zorg dat deze functionaliteit ook beschikbaar is via het toetsenbord.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/over-ons/ wordt gebruikgemaakt van de videospeler van YouTube. Deze videospeler maakt gebruik van bediening door enkele tekentoetsen, bijvoorbeeld f voor fullscreen. Deze functionaliteit is iets wat mensen die afhankelijk zijn van hulpsoftware in de weg kan staan. Deze mensen zijn juist afhankelijk van die korte commando's om met hulpsoftware hun computer te bedienen. Op dit moment werkt de oplossing die we normaalgesproken zouden adviseren ('disablekb=1' toevoegen aan de URL) niet goed. De normale bediening gaat bij deze oplossing goed, maar zodra je instellingen wil aanpassen (zoals afspeelsnelheid) werkt dit niet via het toetsenbord. Daarom is een YouTube-videospeler (momenteel) niet goed toetsenbordtoegankelijk. Daarom adviseren we, tot dit probleem is opgelost, om andere videospeler te gebruiken. Dit komt ook voor bij de drie video's op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Bevindingen: Advies: Op pagina https://www.provalu.nl/over-ons/ staat een video die automatisch begint met afspelen als de pagina wordt geopend. Omdat het wel mogelijk is om de video te pauzeren, wordt dit niet op toegankelijkheid afgekeurd. Toch kan het voor sommige bezoekers lastig zijn snel naar de pauzeknop te navigeren, terwijl bewegend beeld voor hen bijvoorbeeld misselijkheid veroorzaakt. Daarom zou het beter zijn om de video niet automatisch te laten afspelen.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina ontbreekt een mechanisme waarmee content kan worden overgeslagen die op elke pagina terug komt, zoals het menu. Voor bezoekers die navigeren via het toetsenbord verloopt de navigatie efficiënter als zij deze onderdelen kunnen overslaan via een skiplink. Deze skiplink staat vooraan in de focusvolgorde, is niet standaard zichtbaar op de pagina maar wordt wel zichtbaar als de focus hierop valt. De skiplink leidt naar de eerste unieke content op de pagina. Voeg dit toe aan de pagina's.

Uitkomst: Onvoldoende

Bevindingen: De PDF https://www.provalu.nl/assets/files/privacyverklaring-provalu.pdf heeft in de documenteigenschappen als titel 'Microsoft Word - Privacyverklaring Provalu.docx'. Deze bevat de juiste titel, maar ook informatie die hier beter uit verwijderd kan worden. Pas de tekst aan. Daarnaast is de titel niet beschikbaar voor hulpsoftware, doordat is ingesteld wordt dat de bestandsnaam wordt getoond bij het openen. Wijzig dit, zodat de documenttitel wordt getoond.

Bij de PDF https://www.provalu.nl/assets/files/algemene-verkoopvoorwaarden-provalu-productie-en-detachering-def.pdf is in de documenteigenschappen op de juiste manier ingesteld dat de documenttitel wordt getoond bij het openen. Echter ontbreekt er een documenttitel. Voeg deze toe.

Uitkomst: Onvoldoende

Bevindingen: Als de pagina's (bijvoorbeeld https://www.provalu.nl/) worden bekeken bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd vanaf 175%, vouwt het menu samen onder een menuknop. Nadat deze is uitgevouwen is het mogelijk om de focus naar elementen te brengen buiten het menu, die op dat moment niet zichtbaar zijn omdat het menu er overheen staat. Voor bezoekers die navigeren via het toetsenbord is het op dat moment niet te zien waar zij zich bevinden op de pagina. Zorg dat de focus pas uit het menu kan worden gebracht nadat deze weer is ingevouwen.

Als op pagina https://www.provalu.nl/zoek/ een zoekterm wordt ingevoerd in de zoekfunctie, verschijnen de zoekresultaten in een lijst die wordt uitgevouwen. Het is mogelijk de focus te verplaatsen naar elementen op de pagina buiten deze lijst, terwijl de lijst op dat moment content bedekt. Zorgt ervoor dat de focus pas buiten de lijst kan worden gebracht nadat deze weer is afgesloten.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Na het openen gaat de focus eerst langs alle focusbare items in de footer, voordat deze in het dialoogscherm terecht komt. Dit is geen logische volgorde. Zorg ervoor dat na het openen van dit dialoogscherm, de focus hier gelijk in terecht komt.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Als de focus in het dialoogvenster is, komt deze eerst op een onzichtbaar invoerveld ('your e-mail here' terecht. Na de knop 'Inschrijven' komt dit veld nogmaals voor, en daarna nog een veld zonder label. Dit wekt verwarring, bezoekers die kunnen zien en navigeren via het toetsenbord weten dan niet waar de focus zich bevindt en bezoekers die een screenreader gebruiken krijgen hierdoor meerdere e-mail velden voorgelezen (waarvan de eerste en laatste dus Engelstalig). De oplossing is hier het verwijderen van de onzichtbare velden, zodat deze niet meer in de focusvolgorde voorkomen.

Als het dialoogvenster waarmee kan worden ingeschreven voor de nieuwsbrief is geopend (via de link 'Aanmelden voor nieuwsbrief' in de footer), is het mogelijk om de focus naar elementen te brengen elders op de pagina. Een groot deel van de pagina wordt op dat moment bedekt door het dialoogscherm, waardoor het niet zichtbaar is waar de focus zich bevindt en het lastig is om weer in het dialoogscherm terug te komen met de focus. Zorg ervoor dat de focus in het dialoogscherm blijft totdat deze is afgesloten.

Op pagina https://www.provalu.nl/waardemakers/ kan via de links in elk blok (bijvoorbeeld 'Sportieve waardemaker') een dialoogvenster worden geopend. De focus gaat vervolgens niet naar dit dialoogvenster, maar langs focusbare elementen op de pagina die op dat moment worden bedekt door het dialoogvenster. Het dialoogvenster staat achteraan in de focusvolgorde, pas als de bezoeker door de hele pagina heen is gegaan komt de focus in het dialoogvenster terecht. Ook is het mogelijk met de focus het dialoogscherm te verlaten terwijl deze nog is geopend. Zorg ervoor dat de focus in het dialoogvenster terecht komt zodra deze wordt geopend, en dat de focus deze pas kan verlaten nadat deze is afgesloten.

Uitkomst: Onvoldoende

Bevindingen: Op meerdere pagina's is een link te vinden die naar de homepagina leidt, hierin is een afbeelding met het logo te zien. De afbeelding waarop het logo staat heeft geen alternatieve tekst en de link heeft niet op andere wijze een toegankelijke naam gekregen, waardoor voor bezoekers die niet kunnen zien het doel van de link niet duidelijk is. Los dit op door een alternatieve tekst toe te voegen bij het alt-attribuut van de afbeelding. Dit komt ook voor bij het logo dat te vinden is in het dialoogscherm met het inschrijfformulier, deze is te vinden via de link 'Aanmelden voor nieuwsbrief' in de footer. Zie ook succescriterium 1.1.1. en 4.1.2.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staat de link 'Werkgeversservicepunt Holland Rijnland'. Deze heeft via een aria-label de toegankelijke naam 'kLIK HIER VOOR INFORMATIE HET HET wsp hr' gekregen. Deze tekst maakt onvoldoende duidelijk wat het doel van de link is. In dit geval maakt de content van de link het linkdoel wel voldoende duidelijk, dus kan het aria-label worden verwijderd om dit op te lossen. Een soortgelijk probleem doet zich voor bij de link 'Social return on investment', die via een aria-label de naam 'Klik hier voor SROI' heeft gekregen. Zie ook succescriterium 2.5.3.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/ komt meerdere keren een link voor met de tekst 'Meer lezen'. Bijvoorbeeld bij 'Groenvoorziening'. De linktekst maakt onvoldoende duidelijk wat het linkdoel is. Visueel is af te leiden waar de link bij hoort, maar voor bezoekers die hulpsoftware gebruiken en navigeren aan de hand van een lijst van links valt deze context weg. Voeg daarom de koptekst toe (bijvoorbeeld via een aria-label) aan de toegankelijke naam, bijvoorbeeld 'Meer lezen over Groenvoorziening'. Een soortgelijk probleem doet zich voor op pagina https://www.provalu.nl/over-ons/vacatures/ bij de link 'Lees verder', hier kan bijvoorbeeld van worden gemaakt 'Lees verder over Vakspecialist Schoonmaak'. Een ander voorbeeld doet zich voor op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/, bijvoorbeeld de linktekst 'Lees verder' waar aan toegevoegd zou kunnen worden 'over Technisch talent met een doel voor ogen'. Ook op pagina https://www.provalu.nl/nieuws/ doet dit probleem zich voor, in de nieuwsberichten staat de link 'Lees verder', voeg hier de koptekst aan toe.

Op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/ staat onder 'Bekijk ook deze berichten' een paginering. De links naar andere pagina's hebben enkel een cijfer als linktekst. Dit is voor bezoekers die niet kunnen zien onvoldoende beschrijvend. Voeg bijvoorbeeld het woord 'Pagina' toe, eventueel via een aria-label. De laatste link van de paginering heeft helemaal geen naam, zie hiervoor succescriterium 4.1.2. Ditzelfde komt voor op pagina https://www.provalu.nl/nieuws/ en https://www.provalu.nl/nieuwsberichten/werkbezoek-noordwijk-aan-provalu-innovatie-en-samenwerking-in-de-praktijk/ bij de paginering.

Op pagina https://www.provalu.nl/waardemakers/ staan blokken, bijvoorbeeld 'Sportieve waardemaker'. Per blok zijn meerdere links te vinden, de link met afbeelding en de link 'Lees het hele verhaal' hebben een linktekst die onvoldoende beschrijvend is. Voor de link met afbeelding kan dit worden opgelost door de afbeelding via het alt-attribuut een beter beschrijvende alternatieve tekst te geven. Voor de link 'Lees het hele verhaal' kan dit worden opgelost door bijvoorbeeld via een aria-label de tekst aan te vullen, bijvoorbeeld naar 'Lees het hele verhaal over Sportieve waardemaker'. Overigens zou het efficiënte navigatie bevorderen als binnen de blokken niet meermaals dezelfde link staat, dit kan worden verbeterd door bijvoorbeeld de links te verwijderen, de link 'Lees het hele verhaal' een betere toegankelijke naam te geven en het klikbare gebied van deze link te vergroten via CSS of JavaScript. Een soortgelijk probleem doet zich voor op pagina https://www.provalu.nl/nieuws/, bij de blokken met nieuwsberichten (bijvoorbeeld 'Technisch talent met een doel voor ogen'). Een ander voorbeeld doet zich voor op pagina https://www.provalu.nl/nieuwsberichten/werkbezoek-noordwijk-aan-provalu-innovatie-en-samenwerking-in-de-praktijk/ bij de blokken onder 'Bekijk ook deze berichten'.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op verschillende pagina's, zoals https://www.provalu.nl/, hebben de links en knoppen in het menu geen zichtbare focusindicator. Dit geldt ook voor alle links in de footer en op de pagina's. Dit is met name een probleem voor bezoekers die navigeren via het toetsenbord maar wel kunnen zien. Voor hen is op dat moment niet zichtbaar waar zij zich bevinden op de pagina. Dit maakt het navigeren lastig, en kan veroorzaken dat een verkeerd item wordt aangeklikt. Zorg ervoor dat het zichtbaar is als de focus op een element staat, bijvoorbeeld door een focusrand toe te voegen. Dit komt ook voor bij de menu-items binnen het hamburgermenu (zichtbaar als de pagina's op kleiner scherm of in ingezoomde weergave worden bekeken).

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. De knop 'Inschrijven', de link met het logo en de sluitknop hebben geen zichtbare focusindicator. Hierdoor is het niet te zien waar de focus zich bevindt en kan het lastig zijn het juiste element te vinden of kan het formulier per ongeluk worden verzonden. Zorg ervoor dat het zichtbaar is waar de focus zich bevindt, bijvoorbeeld door een focusrand toe te voegen. Dit komt voor op elke pagina waar een dialoogscherm geopend kan worden, bijvoorbeeld pagina https://www.provalu.nl/waardemakers/.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op de homepagina https://www.provalu.nl/ staat in de header een tekst met daaronder de link 'Lees verder'. Deze link heeft via een aria-label de toegankelijke naam 'Klik hier om naar de pagina Over ons te gaan'. De tekst die op de pagina zichtbaar is, komt hierin niet terug. Hierdoor is het voor bezoekers die gebruik maken van spraakgestuurde software niet mogelijk om deze link aan te spreken en te bedienen. Zorg ervoor dat de tekst die op de pagina zichtbaar is in de toegankelijke naam terugkomt, het liefst vooraan.

Op pagina https://www.provalu.nl/over-ons/ staan artikelen met daarbij een link met de tekst 'Meer lezen', zoals bij de kop 'Ik zoek werk'. Het is goed dat deze links via een aria-label een beter beschrijvende toegankelijke naam hebben gekregen, echter is de tekst in strijd met dit succescriterium. Deze wijkt af van de tekst die op de pagina te zien is, waardoor de link lastig aan te spreken en te bedienen is via spraakgestuurde software. Wijzig de tekst van het aria-label, bijvoorbeeld naar 'Meer lezen over Ik zoek werk'.

Op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/ staat de link 'Werkgeversservicepunt Holland Rijnland'. Deze heeft via een aria-label de toegankelijke naam 'kLIK HIER VOOR INFORMATIE HET HET wsp hr' gekregen. Deze tekst wijkt af van de tekst die op de pagina zichtbaar is en maakt het lastig deze te bedienen via spraakgestuurde software. De beste oplossing is in dit geval het verwijderen van het aria-label. Een soortgelijk probleem doet zich voor bij de link 'Social return on investment', die via een aria-label de naam 'Klik hier voor SROI' heeft gekregen. Zie ook succescriterium 2.4.4.

Advies: Op pagina https://www.provalu.nl/, staat in het menu een link die naar de zoekpagina leidt, te herkennen aan een afbeelding met een vergrootglas. Deze link heeft via een aria-label de naam 'Klik hier om iets op te zoeken' gekregen. Dit wordt niet op toegankelijkheid afgekeurd, omdat de term 'zoeken' hier wel in voorkomt. Voor bezoekers die spraakgestuurde software gebruiken is het hierdoor wel mogelijk de link aan te spreken. Toch kan dit lastig zijn, doordat de naam ook andere tekst bevat. Een term zoals 'Klik hier' is overbodig, omdat het element al wordt aangekondigd als link. Een betere naam zou zijn 'Zoeken'.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: De PDF https://www.provalu.nl/assets/files/privacyverklaring-provalu.pdf bevat Nederlandstalige content. Omdat in de documenteigenschappen geen taal is ingesteld voor het document, kan door hulpsoftware niet geïnterpreteerd worden in welke taal en dus met welke uitspraak dit voorgelezen moet worden. Zorg daarom dat de taal wordt ingesteld op Nederlands.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. Als het formulier wordt verstuurd terwijl verplichte velden niet zijn ingevuld, verschijnt een algemene foutmelding met de tekst 'Niet alle velden zijn correct ingevuld'. Deze tekst maakt voldoende duidelijk wat er mis is gegaan, maar niet bij welke velden dit precies mis is gegaan. Er verschijnt een rode omlijning bij de betreffende velden, maar dit is niet voldoende. Zorg ervoor dat bij elk veld een foutmelding komt te staan die voldoende identificeert wat er mis is gegaan en bij welk veld. Voeg hier ook een suggestie aan toe om de fout op te lossen, zie hiervoor succescriterium 3.3.3.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Het invoerveld 'E-mailadres' is een verplicht veld, als deze niet wordt ingevuld en het formulier wordt verzonden wordt dit veld rood. Dit betekent dat de invoerfout automatisch ontdekt wordt, en daarom aan de vereisten van dit succescriterium moet voldoen. Als er een foutief e-mailadres wordt ingevoerd verschijnt alleen een HTML5-melding, welke niet duidelijk genoeg is. Voeg een tekstuele foutmelding toe waarin duidelijk wordt beschreven wat er mis is gegaan en welk veld dit betreft. Voeg ook een foutsuggestie toe om aan succescriterium 3.3.3 te voldoen.

Uitkomst: Onvoldoende

Bevindingen: Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Bij het invoerveld 'E-mailadres' staat een asterisk (*), maar nergens wordt uitgelegd wat deze asterisk betekent. Voeg een verklaring toe boven het formulier, waaruit duidelijk wordt dat de asterisk inhoudt dat het om een verplicht veld gaat. Een andere oplossing zou zijn dat de asterisk wordt vervangen door bijvoorbeeld de tekst '(verplicht)'.

Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. Deze bevat invoervelden (bijvoorbeeld 'Bedrijfsnaam (optioneel)' die een label hebben in de vorm van een placeholder. Voor dit succescriterium voldoet een placeholder niet als label, omdat deze verdwijnt zodra de bezoeker begint te typen. Dit maakt het formulier voor sommige bezoekers lastig correct in te vullen. Los dit bijvoorbeeld op door labels toe te voegen die buiten de invoervelden worden geplaatst en zichtbaar blijven. Ditzelfde komt voor op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/, bij het formulier 'Stel een vraag'.

Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. Voordat de bezoeker het formulier verzend, is het niet duidelijk welke invoervelden verplicht zijn. Bij het veld 'Bedrijfsnaam (optioneel)' is het duidelijk dat deze niet verplicht is, maar een dergelijke toevoeging staat niet bij andere velden. Voor sommige bezoekers is een formulier lastig in te vullen als zij dit aan de hand van foutmeldingen moeten, doen omdat pas na het verzenden duidelijk wordt welke velden verplicht zijn. Overigens is het voor bezoekers die hulpsoftware gebruiken wel duidelijk, omdat het 'required' attribuut is gebruikt. Maar ook voor bezoekers die geen hulpsoftware gebruiken moet dit duidelijk zijn. Verschillende oplossingen zijn mogelijk. In het label van het invoerveld kan de term 'Verplicht' worden toegevoegd, of een asterisk (*) kan worden geplaatst bij elk verplicht veld en boven het formulier een verklaring dat de asterisk betekent dat het om een verplicht veld gaat.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. Als het formulier wordt verstuurd terwijl verplichte velden niet zijn ingevuld, verschijnt een algemene foutmelding met de tekst 'Niet alle velden zijn correct ingevuld'. De foutmelding bevat onvoldoende suggestie voor een oplossing, het wordt bijvoorbeeld niet duidelijk gemaakt dat de velden verplicht zijn of moeten worden ingevuld. Zorg ervoor dat bij elk veld een foutmelding komt te staan en dat hieruit ook duidelijk wordt hoe de fout opgelost kan worden. Bij het veld 'E-mailadres' kan een voorbeeld worden gegeven van het formaat waarin het e-mailadres moet worden ingevoerd.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Het invoerveld 'E-mailadres' is een verplicht veld, als deze niet wordt ingevuld en het formulier wordt verzonden wordt dit veld rood. Dit betekent dat de invoerfout automatisch ontdekt wordt, en daarom aan de vereisten van dit succescriterium moet voldoen. Als er een foutief e-mailadres wordt ingevoerd verschijnt alleen een HTML5-melding, welke niet duidelijk genoeg is. Voeg een tekstuele foutmelding toe waarin naast een foutidentificatie (zie succescriterium 3.3.1.) een goede suggestie toe voor het oplossen van het probleem. Omdat het om een e-mailadres gaat kan hieraan een voorbeeld worden toegevoegd, zodat het formaat duidelijk is.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op meerdere pagina's is een link te vinden die naar de homepagina leidt, hierin is een afbeelding met het logo te zien. De afbeelding waarop het logo staat heeft geen alternatieve tekst en de link heeft niet op andere wijze een toegankelijke naam gekregen, waardoor voor bezoekers die niet kunnen zien het doel van de link niet duidelijk is. Hulpsoftware zoals een screenreader gaat mogelijk zelf zoeken naar een linkdoel en leest dan soms een deel van de URL voor, wat onduidelijkheid kan scheppen over het linkdoel. Los dit op door een alternatieve tekst toe te voegen bij het alt-attribuut van de afbeelding. Dit komt ook voor bij het logo dat te vinden is in het dialoogscherm met het inschrijfformulier, deze is te vinden via de link 'Aanmelden voor nieuwsbrief' in de footer. Zie ook succescriterium 1.1.1. en 2.4.4.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/contact/, staat in het menu een link naar de zoekpagina. Te herkennen aan een icoon met een vergrootglas. Deze link heeft geen naam, waardoor hulpsoftware mogelijk een deel van de URL voorleest en het voor de bezoeker onduidelijk is waar de link naartoe leidt. Voeg een naam toe die het doel van de link beschrijft, bijvoorbeeld 'Zoeken'.

Als de pagina's (bijvoorbeeld https://www.provalu.nl/) worden bekeken bij een schermgrootte van 1280 bij 1024 pixels en er wordt ingezoomd vanaf 175%, vouwt het menu samen onder een menuknop (hamburgermenu). Dit element is via de muis als knop te bedienen, maar via het toetsenbord is het niet mogelijk om de focus hier naartoe te brengen. Via de pijltjestoetsen is de knop wel te bereiken en te bedienen. Bepaalde functionaliteit die bij een knop wel kan worden verwacht (zoals focusbaarheid) ontbreekt. Ook ontbreekt een naam. Daarnaast wordt niet aangekondigd wat de staat van het menu (ingevouwen of uitgevouwen) is. Voor hulpsoftware is lastig af te leiden wat de rol, naam, staat en functie van dit element is. Het is opgemaakt als div-element waaraan geen rol en functionaliteit is toegevoegd. Los dit bijvoorbeeld op door dit op te maken als knop met het button-element (op die manier is de functie en werking goed te interpreteren voor hulpsoftware), en een beschrijvende naam toe te voegen. Voeg ook het aria-expanded attribuut toe om duidelijk te maken of het menu is ingevouwen of uitgevouwen. Ditzelfde geldt voor de sluit-knop die zichtbaar wordt als het menu is opengevouwen.

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Het dialoogvenster staat in een iframe dat geen naam heeft. Voeg deze toe, bijvoorbeeld via een title-attribuut of een aria-label. Dit probleem doet zich ook voor op pagina https://www.provalu.nl/waardemakers/ bij de dialoogvensters die kunnen worden geopend (bijvoorbeeld 'Sportieve waardemaker').

Op meerdere pagina's, bijvoorbeeld https://www.provalu.nl/, staat in de footer de link 'Aanmelden voor nieuwsbrief'. Hiermee kan een dialoogvenster worden geopend waarin een inschrijfformulier te vinden is. Het dialoogvenster kan worden afgesloten via een sluitknop (x). Deze knop is opgemaakt als link en heeft geen naam. Hierdoor is de functionaliteit lastig af te leiden voor hulpsoftware. Los dit bijvoorbeeld op door role="button" toe te voegen en de knop een beschrijvende naam (zoals 'Sluiten') te geven. Ditzelfde komt voor op pagina https://www.provalu.nl/waardemakers/, waar via links in de blokken (bijvoorbeeld 'Sportieve waardemaker') een dialoogscherm kan worden geopend, hier staat dezelfde sluit-knop.

Op pagina https://www.provalu.nl/nieuwsberichten/adviseurs-ontvangen-laptops-van-randstad-voor-test-en-training/ staat onder 'Bekijk ook deze berichten' een paginering. De eerste en laatste link binnen deze paginering hebben geen naam. Hierdoor leest hulpsoftware soms een deel van de URL op, waardoor het linkdoel niet duidelijk is. Voeg een naam toe aan deze links, bijvoorbeeld 'Vorige pagina' en 'Volgende pagina'. Ditzelfde komt voor bij de paginering op pagina https://www.provalu.nl/nieuws/ en https://www.provalu.nl/nieuwsberichten/werkbezoek-noordwijk-aan-provalu-innovatie-en-samenwerking-in-de-praktijk/.

Op pagina https://www.provalu.nl/contact/ staat een formulier, 'Stel een vraag'. Hierin staat een visueel verborgen invoerveld dat geen naam heeft. Deze staat voorafgaand aan 'Bedrijfsnaam (optioneel)'. Bezoekers die navigeren via het toetsenbord komen dit veld wel tegen, omdat deze nog focusbaar is en voorgelezen wordt. Het veld heeft geen label, dus voor bezoekers die hulpsoftware zoals een screenreader gebruiken is het niet duidelijk om welk veld het gaat. Los dit bijvoorbeeld op door het invoerveld helemaal te verwijderen, of door het zichtbaar te maken op de pagina en een label toe te voegen.

Op pagina https://www.provalu.nl/zoek/ staat een zoekveld met daarbij een zoek-knop. Deze laatste heeft geen naam. Daardoor leest hulpsoftware zoals een screenreader alleen 'knop' voor, en is het voor bezoekers die niet kunnen zien niet bekend wat de knop doet. Voeg een naam toe die beschrijft wat de functie van de knop is.

Op pagina https://www.provalu.nl/over-ons/ staat een video waarvan het iframe geen titel heeft. Voor bezoekers die niet kunnen zien is deze belangrijk, omdat zij dan kunnen bepalen of zij de video willen kijken. Zorg voor een titel die beschrijft welke video zich hier bevindt. Dit doet zich ook voor bij de drie video's op pagina https://www.provalu.nl/over-ons/ik-zoek-werk/.

Op pagina https://www.provalu.nl/over-ons/ staat onder de kop 'Samenwerkingspartners/netwerkorganisaties' een slider. Deze bevat twee knoppen (opgemaakt als links) waarmee de bezoeker de slider naar voren of achteren kan laten sliden. Deze links hebben geen naam, waardoor de functionaliteit onduidelijk is voor bezoekers die niet kunnen zien. Ook kan het verwarrend zijn dat deze elementen zijn opgemaakt als links, omdat deze eigenlijk werken als knoppen. Een mogelijke oplossing zou zijn dat het attribuut role="button" wordt toegevoegd aan de links, en dat deze een naam krijgen die de functie beschrijft. Dit komt ook voor op pagina https://www.provalu.nl/over-ons/ik-wil-werk-uitbesteden/ onder de kop 'Wie gingen u voor?'. Een soortgelijk probleem doet zich voor op pagina https://www.provalu.nl/over-ons/ik-zoek-medewerkers/ik-zoek-medewerkers/, hier staat de slider bij de kop 'Werkgeversservicepunt Holland Rijnland'.

Op pagina https://www.provalu.nl/over-ons/gemeenschappelijke-regeling-kust-duin-en-bollenstreek/ staan elementen die de functionaliteit hebben van uitvouwbare knoppen, bijvoorbeeld 'Vergaderdata'. Hierbij mist functionaliteit zoals focusbaarheid. Ook is de functie en staat (ingevouwen of uitgevouwen) van de elementen niet af te leiden voor hulpsoftware. Dit maakt het lastig om deze elementen te vinden en bedienen. Los dit bijvoorbeeld op door native HTML te gebruiken, dit zorgt ervoor dat het element voorspelbaar werkt en de functionaliteit duidelijk is. In dit geval zou het kunnen worden opgemaakt als knop met het button-element, waar het aria-expanded attribuut aan wordt toegevoegd.

Uitkomst: Voldoende