Issues:
Audit digitale toegankelijkheid website Werken bij de Rechtspraak
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Werken bij de Rechtspraak |
---|---|
Datum | 20 augustus 2023 |
Scope van de website |
Binnen de scope van het onderzoek valt:
|
Conformiteitsdoel | WCAG 2.1 niveau AA |
Uitgebreide toetsresultaten
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: Bovenaan iedere pagina staat het logo van de Rechtspraak. Dit logo heeft geen alternatieve tekst. De alternatieve tekst van een logo moet ten minste de naam van de organisatie bevatten, en overige tekst in het logo wanneer het een link betreft. Overweeg daarnaast om een beschrijvend linkdoel toe te voegen, naast de naam van de organisatie. Bijvoorbeeld 'De Rechtspraak - ga naar de homepage'. Het logo in de footer is geen link, maar heeft idealiter ook een alternatieve teks waarin de naam van de organisatie voorkomt.
Bevinding 2: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verschijnt een formulier. In het formulier kunnen bezoekers op het oog-icoon klikken om het wachtwoord te bekijken. Dit icoon heeft geen alternatieve tekst. Bezoekers die het scherm niet kunnen zien, weten daarom niet waar deze knop voor dient. Dit probleem komt op meerdere pagina's voor, waaronder op:
Bevinding 3: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staat onder 'Actieve filters' de tekst 'Junior' met daar achter een kruisje waarmee bezoekers het filter kunnen verwijderen. Voor deze functie is geen alternatieve tekst beschikbaar. Zorg ervoor dat bezoekers die het scherm niet kunnen zien ook weten wat er gebeurt als zij de link activeren.
Bevinding 4: Op meerdere plaatsen, waaronder op pagina https://werkenbijderechtspraak.nl/vacature/bi-specialist-back-end-etl-ontwikkelaar-1017832/ worden iconen gebruikt om aan te geven dat het om bijvoorbeeld een locatie of e-mailadres gaat. Deze iconen zijn op de pagina geplaatst met CSS. Wanneer bezoekers een eigen CSS bestand inladen, bijvoorbeeld om automatisch de tekstafstand of contrast te wijzigen, vallen deze iconen weg. Gebruik daarom nooit CSS om informatieve iconen op de pagina te plaatsen, maar bijvoorbeeld het img-element.
1.2 Op tijd gebaseerde media
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 5: Op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ komen meerdere video's voor. Aan het begin en aan het eind van de video wordt de afzender, het logo van de Rechtspraak, gepresenteerd. In de video 'De Rechter' komt de vraag 'Wat doet een rechter' alleen in beeld, niet gesproken. Voor al deze informatie is geen audiodescriptie of media-alternatief aanwezig. Voeg bij voorkeur sowieso een transcript toe als media-alternatief, zodat doofstomme bezoekers ook toegang hebben tot de informatie in de video. Om ook aan succescriterium 1.2.5 is enkel een media-alternatief niet voldoende, voeg daarom audiodescriptie toe aan de video.
1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 6: Op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ komen meerdere video's voor. Aan het begin en aan het eind van de video wordt de afzender, het logo van de Rechtspraak, gepresenteerd. In de video 'De Rechter' komt de vraag 'Wat doet een rechter' alleen in beeld, niet gesproken. Voor al deze informatie is geen audiodescriptie. Zorg er daarom voor dat deze informatie als audiodescriptie wordt toegevoegd.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 7: De tekst 'Uitgelichte vacatures' is visueel een kop voor de onderstaande content (de vacatures), maar is dat in de code niet. Bezoekers die gebruik maken van voorleessoftware kunnen aan de hand van een koppenlijst of sneltoets door de koppen op een pagina navigeren. Dat kan alleen als de visuele koppen opgemaakt zijn met kop-elementen, zoals het h2-element. Maak de tekst op als kop om dit probleem op te lossen.
- Dit geldt ook voor de kop 'Actieve filters' op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior.
Bevinding 8: De tekst 'Wie zijn we' op pagina https://werkenbijderechtspraak.nl/vacature/senior-administratief-medewerker-team-administratie-handel-kanton-1017123/ is opgemaakt met het strong-element in plaats van met een kop-element. Bezoekers die gebruik maken van voorleessoftware kunnen aan de hand van een koppenlijst of sneltoets door de koppen op een pagina navigeren. Dat kan alleen als de visuele koppen opgemaakt zijn met kop-elementen, zoals het h3-element. Het strong-element geeft aan dat tekst relatief aan de tekst eromheen, bijvoorbeeld in dezelfde paragraaf, belangrijker is. Het is daarom niet puur voor opmaak bedoelt. Verwijder het strong-element en maak de tekst op met een h-element om dit probleem op te lossen. Dit probleem kan ook op andere pagina's voorkomen.
Bevinding 9: Op pagina https://werkenbijderechtspraak.nl/vacature/senior-administratief-medewerker-team-administratie-handel-kanton-1017123/ is de tekst 'Binnen de Rechtspraak weten we heel goed zelf onze kandidaten te bereiken...' opgemaakt met het em-element. Het em-element geeft gesproken nadruk aan een woord of korte zin en mag daarom niet puur voor opmaak gebruikt worden. Gebruik het i-element of CSS om een vergelijkbaar effect te creëren zonder de semantische waarde van het em-element. Dit probleem kan op meerdere pagina's voorkomen.
Bevinding 10: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staat een slider. Het visuele label 'Max afstand woon-werk' is niet gekoppeld aan het input-element. Hierdoor is er geen toegankelijke naam beschikbaar voor de slider. Koppel een label met for en id aan het input-element om dit probleem op te lossen. Ook de tekst eronder 'Maximaal 25km' moet worden gekoppeld aan het invoerveld. Dit laatste kan door middel van aria-describedby. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina:
Bevinding 11: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staan in het blok 'Filters' uitklapbare menu items, die wanneer ze geopend zijn meerdere selectievakjes tonen. De selectievakjes hebben een label, maar zijn niet gekoppeld aan hun overkoepelde visuele label, zoals 'Functiegroep'. Koppel de input-elementen met een fieldset en legend aan het visuele label. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina:
Bevinding 12: Wanneer bezoekers documenten toevoegen aan een sollicitatie, verschijnen die op https://werkenbijderechtspraak.nl/kandidatenportaal/ onder 'Documenten'. Visueel staat deze opmaak in een tabelopmaak. Het is voor ziende bezoekers dan ook duidelijk waar de knop 'Bestand downloaden' bij hoort. Voor bezoekers die het scherm niet kunnen zien is dat niet duidelijk. Maak de gegevens op als tabel, met tabelkoppen, zodat bij iedere knop wordt voorgelezen bij welk bestand de knop hoort. Dit geldt ook voor de gegevens onder 'Sollicitaties'.
Bevinding 13: Er zijn verschillende toegankelijkheidsfouten gevonden in de PDF op pagina https://werkenbijderechtspraak.nl/wp-content/uploads/2023/07/Senior-rechter.pdf:
- Het document mist een document-tag.
- Het logo bovenaan het document is niet gecodeerd en mist een alternatieve tekst.
- Meerdere path-objecten in het document zijn ongecodeerd. Codeer deze als artefact.
- In de PDF's komen visueel geneste opsommingen voor (bijvoorbeeld op pagina 6) die niet als zodanig zijn gecodeerd.
- Op meerdere pagina's komen tabellen voor, waar de kolomkop niet gekoppeld is aan een kolom. Daarnaast hebben meerdere tabellen helemaal geen tabelkoppen. Daarnaast lijkt er hier alleen voor opmaakredenen gekozen te zijn voor tabelopmaak, niet vanwege een benodigde tabelstructuur. Overweeg daarom de teksten gewoon als platte tekst aan te bieden en maak daarbij gebruik van normale heading-tags.
- De 'tabel' 'Preambule' wordt in het kader van bovenstaande wel afgekeurd omdat hier zowel geen visuele als gecodeerde tabelkop aanwezig is. De tekst 'Preambule' staat in de dezelfde datacel als de overige tekst. Verwijder de tabelstructuur en maak de koptekst op als kop.
Bevinding 14: Advies: Onder 'Nieuwsgierig naar de verhalen van onze medewerkers?' op de homepage staan tekstblokken die zijn opgemaakt met het h1-element. Hou bij voorkeur een logische koppenstructuur aan, door een h2-element op te volgen met een kopniveau lager (het h3-element) in plaats van een kopniveau hoger.
Bevinding 15: Advies: Op pagina https://werkenbijderechtspraak.nl/bestaatniet worden 3 kopniveaus overgeslagen. Hou bij voorkeur een logische koppenstructuur aan, door een h1-element op te volgen met één kopniveau lager.
Bevinding 16: Advies: Op pagina https://werkenbijderechtspraak.nl/veelgestelde-vragen/ komt onderstreepte tekst voor. Universeel is onderstreepte tekst in een lopende tekst herkenbaar als linktekst, dat is hier niet het geval. Overweeg om de onderstreping te verwijderen.
Bevinding 17: Advies: Op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ komt informatie voor die visueel een descriptionlist is, bijvoorbeeld 'Naam: XXXX'. Een HTML descriptionlist maakt deze informatie ook ordelijker voor bezoekers die het scherm niet kunnen zien.
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 pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ kan de bezoeker het e-mailadres wijzigen. De invoervelden voor het e-mailadres hebben geen autocomplete-attribuut. HMTL5 invoervelden die informatie over de gebruiker vragen, zoals naam/achternaam, adres en geboortedatum, moeten een juist autocomplete attritbuut hebben. Lees meer over autocomplete-attributen op pagina https://www.w3.org/TR/WCAG21/#input-purposes. Dit geldt ook voor de optie om het wachtwoord te wijzigen/toe te voegen.
Bevinding 19: Als de bezoeker op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ zijn wachtwoord wilt resetten, opent een nieuw scherm. Het invoerveld waarin het e-mailadres moet worden ingevuld mist een autocomplete-attribuut.
1.4 Onderscheidbaar
1.4.1 Gebruik van kleur (Niveau A)
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevinding 20: Op pagina https://werkenbijderechtspraak.nl/contact/ komen linkteksten voor die alleen herkenbaar zijn als link doordat deze teksten een andere kleur hebben dan de omliggende tekst. Bij hover verschijnt er een onderstreping, maar omdat de linkteksten niet voldoende herkenbaar zijn op basis van kleur alleen (de contrastratio tussen de linktekst en de paragraaftekst is lager dan 3:1) is dit niet voldoende. Gebruik minimaal één andere methode, bijvoorbeeld het permanent onderstrepen van de linkteksten of het verhogen van de contrastratio van de linkteksten. Dit probleem doet zich op alle pagina's met vacatureteksten voor.
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 21: Op de homepage staat een afbeelding van zes personen, met daarop links naar verschillende pagina's. Op deze afbeelding staat ook de tekst 'Werken bij de Rechtspraak'. De contrastratio tussen de witte tekst en de grijs/blauwe achtergrond (HEX #C9D2DB) is 1,5:1 waar dat minimaal 3:1 moet zijn. Dit komt op meerdere pagina's voor, waaronder op pagina:
Bevinding 22: Op de homepage staat onder 'Vind hier jouw baan' een zoekfunctie. De contrastratio tussen de placeholdertekst 'Zoeken...' (HEX #95B4C5) en de blauwe achtergrond (HEX #085079) is 3,9:1 waar dat minimaal 4,5:1 moet zijn.
Bevinding 23: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staan filters die geen resultaten hebben. Deze categorieën zijn te herkennen aan een lichtgrijze tekst en een (0). Alle tekst van deze grootte moet minimaal contrast hebben van 4,5:1 tenzij het bij een input met een attribuut ‘disabled’ hoort. Hier worden geen standaard checkboxen voor de aankruisvakjes gebruikt waardoor het toevoegen van disabled attribuut geen waarde heeft. Deze tekst dient voldoende contrast te hebben omdat het informatie biedt over de aanwezige categorieën. Het ontbreken van zoekresultaten in een bepaalde categorie is ook informatie. Zorg voor een minimaal contrast van 4,5:1.
Bevinding 24: Wanneer bezoekers een sollicitatie hebben ingestuurd en documenten hebben ingestuurd, komt er op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ lichtgrijze tekst voor (HEX #999999). De contrastratio op de witte achtergrond is 2,8:1 waar dat minimaal 4,5:1 moet zijn.
Bevinding 25: Wanneer bezoekers op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ bij 'Sollicitaties' op 'Toon alle' klikken, verschijnt een dialoogvenster met een overzicht van huidige en verlopen sollicitaties. De datum van de sollicitatie staat in grijze tekst (HEX #999999) op een lichtblauwe achtergrond (HEX #F0F5FF). De contrastratio is hier 2,6:1 waar dat minimaal 4,5:1 moet zijn.
Bevinding 26: Op meerdere plekken, waaronder op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/, staan dialoogvensters met daarin formulieren. Boven het formulier staat de tekst 'Velden gemarkeerd met een * zijn verplicht.'. De contrastratio van de roze asterisk (HEX #D52B1E) op de blauwe achtergrond (HEX #D9EBF7) is 4,1:1 waar dat minimaal 4,5:1 moet zijn.
Bevinding 27: Op pagina https://werkenbijderechtspraak.nl/vacature/bi-specialist-back-end-etl-ontwikkelaar-1017832/ valt een deel van het e-mailadres van een medewerker buiten het blauwe blok, waardoor de contrastratio tussen de witte tekst en de witte achtergrond 1:1 is waar dat minimaal 4,5:1 moet zijn. Zie ook succescriterium 1.4.4.
Bevinding 28: Advies: In de datumkiezer bij het aanpassen van de persoonsgegevens op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ komen contrastproblemen voor. Er is een toegankelijk alternatief (bezoekers kunnen zelf een datum intypen en verder navigeren), maar idealiter zijn alle aangeboden opties toegankelijk.
1.4.4 Herschalen van tekst (Niveau AA)
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Onvoldoende
Bevinding 29: Wanneer bezoekers op de homepage inzoomen in stappen van 125% tot 250% inzoomen, vallen verschillende teksten op de afbeelding van zes personen over elkaar en zijn daardoor niet meer (geheel) leesbaar. Zorg ervoor dat het vergroten van de tekst op de pagina niet leidt tot verlies van informatie of functionaliteit. Dit komt ook voor op pagina:
Bevinding 30: Wanneer de bezoekers op vacaturepagina's inzoomen, bijvoorbeeld https://werkenbijderechtspraak.nl/vacature/bi-specialist-back-end-etl-ontwikkelaar-1017832/, verdwijnt een deel van een e-mailadres in de zijkolom. Zie het kopje 'Weten of een vacature bij jou past?'
1.4.10 Reflow (Niveau AA)
Informatie over succescriterium 1.4.10 Reflow
Uitkomst: Onvoldoende
Bevinding 31: Wanneer bezoekers met schermgrootte 1280 bij 1024 inzoomen naar 400% op pagina https://werkenbijderechtspraak.nl/toegangkelijkheid/, verschijnt een horizontale scrollbalk om alle tekst op de pagina te kunnen lezen. Zorg ervoor dat inzoomen niet leidt tot verlies van informatie en functionaliteit en vermijdt daarbij horizontaal scrollen. Een vergelijkbaar probleem komt voor op pagina:
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 32: Op de homepage staat een afbeelding van zes personen, met daarop links naar verschillende pagina's, zoals 'Juristen'. De achtergrond van deze afbeelding is blauw/grijs (HEX #C9D2DB). Wanneer de links op de afbeelding focus hebben, is dat zichtbaar door een witte focusrand. Wanneer de focusrand overlapt met de achtergrond, is de contrastratio slechts 1,5:1 waar dat minimaal 3:1 moet zijn. Daarnaast is de focusrand ook op andere delen van de afbeelding niet voldoende zichtbaar, waaronder op de witte trui bij de mevrouw bij de link 'Administratie' en op de beige trui van de meneer bij de link 'Juristen'. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
Bevinding 33: Op de homepage staat onder 'Vind hier jouw baan' een zoekfunctie. Wanneer de knop met het vergrootglas icoon focus heeft, kleurt het icoon van wit naar zwart. De contrastratio tussen het zwarte vergrootglas en de blauwe achtergrond (HEX #085079) is 2,4:1 waar dat minimaal 3:1 moet zijn.
Bevinding 34: Op de homepage staan tekstblokken met vacatureteksten. Bij muishover verschijnt onder alle teksten een blauwe focusstijl (HEX #000FFF). Op meerdere achtergrondkleuren is het contrast hiervan te laag, bijvoorbeeld op de roodbruine achtergrond (HEX #9F2E12). De contrastratio is hier 1,1:1 waar dat minimaal 3:1 moet zijn. Een vergelijkbaar probleem komt voor op de andere achtergrondkleuren van de vacatureblokken. Dit probleem doet zich alle pagina's met vacatureteksten voor.
Bevinding 35: Op de homepage staat een carrousel, met daaronder knoppen om naar een andere slide te navigeren. De niet-actieve slide hebben roze bolletjes (HEX #BB3381). De contrastratio hiervan op de donkerroze achtergrond (HEX #AA0061) is 1,3:1 waar dat minimaal 3:1 moet zijn.
Bevinding 36: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verschijnt een dialoogvenster, met daarin onder andere een knop om het venster te sluiten. Bij muishover heeft de knop een te lage contrastratio. De contrastratio tussen de grijze knop (HEX #999999) en de witte achtergrond is 2,8:1 waar dat minimaal 3:1 moet zijn.
Bevinding 37: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staat een zoekfunctie met daarin een roze vergrootglas (HEX #D580B0) op een donkerroze achtergrond (HEX #AA0061). De contrastratio is hier 2,6:1 waar dat minimaal 3:1 moet zijn. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina:
Bevinding 38: Op pagina Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior staat een slider met een donkerblauwe knop (HEX #085079) op een donkerroze achtergrond (HEX #AA0061). De contrastratio is hier 1,1:1 waar dat minimaal 3:1 moet zijn. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina:
Bevinding 39: Op meerdere pagina's, waaronder op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/, komen blauwe link/knoppen voor, bijvoorbeeld 'Bekijk direct de vacatures'. Bij toetsenbordfocus verschijnt daar een zwarte focusrand omheen. De contrastratio tussen de blauwe achtergrond van de link (HEX #151F6D) en de zwarte focusrand is 1,4:1 waar dat minimaal 3:1 moet zijn.
Bevinding 40: Wanneer aangevinkte selectievakjes, zoals op pagina https://werkenbijderechtspraak.nl/apply/?web_page_id=1011915 focus hebben, is dat zichtbaar door een donkerblauwe focusrand (HEX #005FCC). De contrastratio op de blauwe achtergrond van het selectievakje (HEX #0075FF) is 1,4:1 waar dat minimaal 3:1 moet zijn.
Bevinding 41: Op meerdere plekken, waaronder op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ bij het aanmaken van een vacature-alert, staan selectievakjes. De contrastratio tussen de grijze omranding (HEX #AEAEAE) en de witte achtergrond is 2,2:1 waar dat minimaal 3:1 moet zijn.
Bevinding 42: Op meerdere plekken, waaronder op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/, staat iconen waarmee bezoekers een bestand kunnen downloaden of wijzigen. De contrastratio tussen de grijze iconen (HEX #999999) en de witte achtergrond is 2,8:1 waar dat minimaal 3:1 moet zijn.
1.4.13 Content bij hover of focus (Niveau AA)
Informatie over succescriterium 1.4.13 Content bij hover of focus
Uitkomst: Onvoldoende
Bevinding 43: Als de bezoeker op de homepage over het hoofdmenu met de muis hovert, verschijnt er aanvullende content. De bezoeker kan deze content niet weghalen zonder de muis te bewegen of de focus met het toetsenbord te verplaatsen. De bezoeker moet dit bijvoorbeeld met de escape toets kunnen doen.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.1 Toetsenbord (Niveau A)
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevinding 44: Wanneer bezoekers inzoomen verandert het navigatiemenu bovenaan iedere pagina in een hamburgermenu. Niet alle menu-items in de uitgeklapte menu-items zijn niet met het toetsenbord bereikbaar en bedienbaar. Zorg ervoor dat bezoekers die met het toetsenbord navigeren deze items ook kunnen bedienen.
Bevinding 45: Advies: De kaartweergave op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior is niet toegankelijk voor toetsenbordgebruikers. Aangezien de vacatures zelf voldoende alternatief zijn, is dit niet afkeurbaar. Bij voorkeur zijn alle aangeboden methoden van informatievoorziening natuurlijk toegankelijk. Dit probleem komt ook voor op pagina https://werkenbijderechtspraak.nl/juristen/.
2.1.4 Enkel teken sneltoets (Niveau A)
Informatie over succescriterium 2.1.4 Enkel teken sneltoets
Uitkomst: Onvoldoende
Bevinding 46: De videospelers op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ zijn te bedienen met sneltoetsen, zoals f voor fullscreen. Sneltoetsen mogen de werking van screenreaders niet in de weg zitten. Daarom moet de bezoeker ze kunnen uitzetten, aanpassen, of moeten ze alleen actief zijn als de bezoeker focust op het object waarop de sneltoetsen van toepassing zijn. In Youtube kunnen de sneltoetsen uitgeschakeld worden door in de URL van de ingebedde video de parameter 'disablekb=1' toe te voegen.
2.4 Navigeerbaar
2.4.1 Blokken omzeilen (Niveau A)
Informatie over succescriterium 2.4.1 Blokken omzeilen
Uitkomst: Onvoldoende
Bevinding 47: Op de website is er een manier om herhalende content over te slaan, maar de skiplink werkt niet op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/. Zorg ervoor dat bezoekers op alle pagina's herhalende blokken content over kunnen slaan.
Bevinding 48: Advies: Iedere pagina heeft nu twee 'Skip to content' skiplinks. Eén is voldoende.
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 49: De titel van pagina https://werkenbijderechtspraak.nl/apply/?web_page_id=1011915 is 'Apply'. Naast dat dit een Engelstalige titel is, is de tekst ook onvoldoende beschrijvend. Voeg bijvoorbeeld de naam van de functie toe waar bezoekers op reageren. Dit probleem komt op alle 'apply' pagina's voor.
Bevinding 50: De PDF op pagina https://werkenbijderechtspraak.nl/wp-content/uploads/2023/07/Senior-rechter.pdf heeft wel een titel, maar de titel wordt niet getoond bij openen. Verander deze instelling.
2.4.3 Focus volgorde (Niveau A)
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevinding 51: Wanneer bezoekers inzoomen verandert het navigatiemenu bovenaan iedere pagina in een hamburgermenu. Na het doorlopen van de gesloten items in het menu gaat de focus verder op de achterliggende pagina, terwijl het menu geopend over de pagina blijft staan. Terwijl het mobiele menu geopend is, komt een skiplink in beeld. Zorg ervoor dat het menu sluit na het laatste item, of zorg dat de focus pas verder kan zodra bezoekers het menu zelf handmatig sluiten.
Bevinding 52: Wanneer bezoekers op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ bij 'Sollicitaties' op 'Toon alle' klikken, verschijnt een dialoogvenster met een overzicht van huidige en verlopen sollicitaties. Na het doorlopen van alle interactieve opties in het dialoogvenster gaat de focusvolgorde verder op de achterliggende pagina. Zorg ervoor dat de focus in het dialoogvenster blijft en dat bezoekers het venster zelf sluiten met de sluit-knop. Dit geldt ook voor het dialoogvenster 'Alle documenten' (wanneer de uitklapbare knop dichtgeklapt is) op dezelfde pagina.
Bevinding 53: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verspringt de focusvolgorde naar het invoerveld 'Voornaam' in het dialoogvenster. Bezoekers die gebruik maken van voorleessoftware missen hierdoor de informatie die boven dit invoerveld staat. Zorg ervoor dat bezoekers op een logische volgorde door de informatie kunnen navigeren, door bijvoorbeeld de focus eerst op de sluitknop te plaatsen en daarna pas naar de interactieve elementen.
- Dit geldt ook voor de dialoogvensters 'Inloggen' en 'Wachtwoord vergeten'.
- Dit geldt ook voor alle dialoogvensters op https://werkenbijderechtspraak.nl/kandidatenportaal/.
Bevinding 54: Op pagina https://werkenbijderechtspraak.nl/juristen/ staat een carrousel met verhalen van medewerkers. In de carrousel krijgen de twee knoppen om terug en verder te scrollen tegelijkertijd zichtbare focus (dat werkt niet). Vervolgens krijgen onzichtbare links focus, daarna de verhalen die in beeld staan (eerst de koptekst, dan de 'Lees meer' link) en vervolgens de links die visueel disabled zijn (lichtere tekst en foto). Zorg ervoor dat items die niet in beeld zijn geen focus krijgen, dat de 'back' en 'next' knoppen op een logisch moment afzonderlijk focus krijgen en dat items geen dubbele links hebben. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
Bevinding 55: Op meerdere pagina's, waaronder op pagina https://werkenbijderechtspraak.nl/juristen/, komt een iframe met een kaartapplicatie voor. Het iframe is verborgen voor hulpsoftware met aria-hidden, maar meerdere interactieve items krijgen wel toetsenbordfocus. Dit is verwarrend. Dit komt op meerdere pagina's, waaronder op pagina:
- https://werkenbijderechtspraak.nl/de-organisatie/
- https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/
Bevinding 56: In de PDF op pagina https://werkenbijderechtspraak.nl/wp-content/uploads/2023/07/Senior-rechter.pdf wordt gebruik gemaakt van annotaties en de 'note' tag, maar de leesvolgorde waarin deze worden gepresenteerd zijn niet logisch. Zorg ervoor dat de bezoeker ook in de leesvolgorde de note na de annotatie tegenkomt en daarna weer verder gaat op de oorspronkelijke plaats in de tekst.
Bevinding 57: Advies: Op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ staat een contactformulier. De verzendknop is uitgeschakeld tot alle verplichte velden zijn ingevuld, maar dat is niet zichtbaar. Geef de knop een ander uiterlijk zolang de knop disabled is, zodat bezoekers weten waarom de knop overgeslagen wordt in de focusvolgorde.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 58: Bovenaan iedere pagina staat het logo van de Rechtspraak. Deze afbeelding is ook een link. Er is geen toegankelijk linkdoel beschikbaar voor bezoekers die gebruik maken van hulpsoftware, zoals voorleessoftware. Zorg ervoor dat bezoekers weten waar een link naar verwijst door in dit geval een beschrijvende alternatieve tekst toe te voegen aan het logo. Zie ook succescriterium 1.1.1.
Bevinding 59: Op pagina https://werkenbijderechtspraak.nl/juristen/ komen lege links voor in de carrousel. De afbeelding van ieder content blok is een link, maar heeft geen alternatieve tekst en heeft daardoor geen toegankelijke naam. Zorg ervoor dat bezoekers weten waar een link naar verwijst door in dit geval de overbodige links van de afbeelding en de header te verwijderen en het klikgebied van de 'Lees meer' link te vergroten. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
Bevinding 60: Advies: De linkteksten van de vacatures op de homepage bevatten de gehele tekst in het tekstblok. Voor bezoekers die gebruik maken van voorleessoftware is dit onprettig. Overweeg de linkteksten in te korten, bijvoorbeeld naar 'Lees meer over de vacature XXXXX'. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
- https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior (en de algemene vacaturepagina).
- https://werkenbijderechtspraak.nl/juristen/
- https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/
- https://werkenbijderechtspraak.nl/campus-recruitment/
2.4.5 Meerdere manieren (Niveau AA)
Informatie over succescriterium 2.4.5 Meerdere manieren
Uitkomst: Onvoldoende
Bevinding 61: Pagina's moeten op minimaal twee manieren te bereiken zijn op een website. Eén van die manieren is het doorlinken naar een pagina vanaf een andere pagina. Voeg daarnaast minimaal één van de volgende manieren toe: een sitemap, een website-brede zoekfunctie, een linklijst op de homepage of een navigatiemenu waarin alle pagina's op de website voorkomen. In het geval van deze website is een zoekfunctie of sitemap het meest praktisch.
2.5 Input modaliteiten
2.5.3 Label in naam (Niveau A)
Informatie over succescriterium 2.5.3 Label in naam
Uitkomst: Onvoldoende
Bevinding 62: Op de homepage staat onder 'Vind hier jouw baan' een zoekfunctie. Met een placeholder is de visuele naam 'Zoeken' toegevoegd, maar de toegankelijke naam van het invoerveld is 'Search'. Hierdoor is de zoekfunctie niet of moeilijker te bedienen door bezoekers die gebruik maken van spraakgestuurde navigatie. Zorg ervoor dat het visuele label en de toegankelijke naam overeen komen.
Bevinding 63: Op pagina https://werkenbijderechtspraak.nl/juristen/ staan visueel 'Lees meer' linksteksten. Deze links hebben een aria-label 'Read more about XXX'. Omdat de visuele naam niet voorkomt in de toegankelijke naam, zijn de links niet of moeilijker te bedienen door bezoekers die gebruik maken van spraakgestuurde navigatie.
3. Begrijpelijk
3.1 Leesbaar
3.1.1 Taal van de pagina (Niveau A)
Informatie over succescriterium 3.1.1 Taal van de pagina
Uitkomst: Onvoldoende
Bevinding 64: De hoofdtaal die is aangegeven in de HTML code van de website is Amerikaans Engels. De inhoud van de website is echter Nederlandstalig. Afhankelijk van de instellingen van de voorleessoftware van een bezoeker, wordt de tekst daardoor onverstaanbaar uitgesproken. Zorg ervoor dat de taalinstelling overeenkomt met de inhoud van de pagina's.
Bevinding 65: Er is geen taal ingesteld voor de PDF op pagina https://werkenbijderechtspraak.nl/wp-content/uploads/2023/07/Senior-rechter.pdf. Zorg ervoor dat PDF documenten een taalinstelling hebben die overeenkomt met de hoofdtaal van het document, in dit geval Nederlands.
3.1.2 Taal van onderdelen (Niveau AA)
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Onvoldoende
Bevinding 66: Er is een manier aanwezig om herhalende content over te slaan, maar de skiplink is Engelstalig ('Skip to content'). Biedt interactieve elementen aan in een taal die aansluit bij de inhoud van de pagina, in dit geval Nederlands. Een vergelijkbaar probleem komt voor bij:
- Het invoerveld van de zoekfunctie op de homepage, dat de toegankelijke naam 'Search' heeft. Dit geldt ook voor de knop van het vergrootglasicoon.
- Wanneer bezoekers inzoomen verandert het navigatiemenu bovenaan iedere pagina in een hamburgermenu. De toegankelijke naam van de knop om het menu te openen en te sluiten is 'Menu toggle'.
- De carrousel op de homepage heeft als toegankelijke naam ' "Carousel | Horizontal scrolling: Arrow Left & Right"'.
- Het invoerveld 'Enter location' op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior en op de algemene vacaturepagina.
- Op pagina https://werkenbijderechtspraak.nl/juristen/ staan visueel 'Lees meer' linksteksten. Deze links hebben een aria-label 'Read more about XXX'.
- Op pagina https://werkenbijderechtspraak.nl/juristen/ staat een carrousel met verhalen van medewerkers. De knoppen en slides in de carrousel hebben Engelstalige toegankelijke namen. Dit doet zich op alle pagina's met deze carrousel voor.
- Engelstalige foutmeldingen in het formulier op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/.
- De linktekst 'Older' op pagina https://werkenbijderechtspraak.nl/nieuws/locaties/rechtbank-den-haag/.
- De titel van pagina https://werkenbijderechtspraak.nl/apply/?web_page_id=1011915 is 'Apply'.
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevinding 67: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verschijnt een formulier. Wanneer bezoekers het wachtwoord veld niet goed invullen en het formulier versturen, verschijnt de melding 'Het wachtwoord moet bestaan uit minimaal 8 tekens waarvan 2 niet-alfabetische.' Dit is een foutsuggestie zoals bedoeld bij succescriterium 3.3.3. De bezoeker moet een foutmelding krijgen wanneer een invoerveld niet goed is ingevuld of het formulier niet goed verzonden kan worden. De foutmelding moet beschrijven welke fout is gemaakt en wáár die is gemaakt, bijvoorbeeld: 'Het veld Wachtwoord is niet goed ingevuld'. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
Bevinding 68: Advies: Op pagina https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ staat een contactformulier zonder foutvalidatie maar met een disabled verzendknop. Omdat de knop nu geheel niet beschikbaar is voor hulpsoftware, is dit verwarrend voor meerdere groepen bezoekers. Overweeg het attribuut disabled te verwijderen en een goede foutidentificatie toe te voegen, ook wanneer er nog niets is ingevuld in verplichte velden.
4. Robuust
4.1 Compatibel
4.1.1 Parsen (Niveau A)
Informatie over succescriterium 4.1.1 Parsen
Uitkomst: Onvoldoende
Bevinding 69: Op de website, waaronder op de homepage, komt een groot aantal niet-unieke id's voor, die onder andere worden gebruikt in onder aria-controls en aria-labelledby attributen, maar ook in reguliere for en id attributen. Dit veroorzaakt mogelijk toegankelijkheidsproblemen, bijvoorbeeld voor bezoekers die gebruik maken van voorleessoftware. Gebruik unieke id's om dit probleem te voorkomen. Dit probleem doet zich op iedere onderzochte pagina voor.
Bevinding 70: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verschijnt een formulier. In het formulier kunnen bezoekers op het oog-icoon klikken om het wachtwoord te bekijken. Op dit element is de aria-rol 'switch' geplaatst, en het aria-pressed attribuut. Aria-pressed mag niet gebruikt worden op een element met de rol 'switch', gebruik hier aria-checked.
4.1.2 Naam, rol, waarde (Niveau A)
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 71: Bovenaan iedere pagina staat het logo van de Rechtspraak. Deze afbeelding is ook een link. Er is geen toegankelijke naam voor bezoekers die gebruik maken van hulpsoftware, zoals voorleessoftware. Los dit op door een beschrijvende alternatieve tekst toe te voegen aan het logo.
Bevinding 72: Wanneer bezoekers op 'Registreren' in het navigatiemenu bovenaan iedere pagina klikken, verschijnt een formulier. In het formulier kunnen bezoekers op het oog-icoon klikken om het wachtwoord te bekijken. Deze knop heeft geen toegankelijke naam. Voeg een naam of alternatieve tekst toe om dit probleem op te lossen. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina.
Bevinding 73: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior en op de algemene vacaturepagina staat een slider zonder een toegankelijke naam. Koppel een label met for en id aan het input-element om dit probleem op te lossen.
Bevinding 74: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior en op de algemene vacaturepagina staat in het blok 'Filters' het uitklapbare menu item 'Locatie'. Dit is een interactief item, maar er wordt geen rol gecommuniceerd. Geef het element een rol, zoals 'button'. Daarnaast is het voor bezoekers die het scherm kunnen zien duidelijk of het item in- of uitgeklapt is, maar deze informatie is niet beschikbaar voor hulpsoftware. Gebruik aria-expanded of een vergelijkbare techniek om dit probleem op te lossen.
Bevinding 75: Op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior en op de algemene vacaturepagina staan in het blok 'Filters' uitklapbare items. Wanneer de focus hierop wordt geplaatst wordt er aan hulpsoftware gecommuniceerd dat dit klikbare items zijn, wat niet zo is. Zorg er daarom ook voor dat er geen focusrand omheen geplaatst wordt.
Bevinding 76: Op pagina https://werkenbijderechtspraak.nl/job-alert/ staan uitklapbare knoppen. Hierbinnen zijn select-elementen genest, maar die werken niet omdat de role=button op het parent div element dit overschrijft. Maak de items op als reguliere select-elementen om dit probleem op te lossen. Aria-expanded is hierbij ook niet nodig. Dit probleem komt ook voor op pagina https://werkenbijderechtspraak.nl/apply/?web_page_id=1011915 en op pagina https://werkenbijderechtspraak.nl/kandidatenportaal/ (met name bij het aanmaken van een vacature-alert).
Bevinding 77: Op meerdere pagina's, waaronder op pagina https://werkenbijderechtspraak.nl/juristen/, komt een iframe met een kaartapplicatie voor. Het iframe is verborgen met aria-hidden, en het div-element heeft geen rol. Er is een roledescription aanwezig, maar dat heeft niet dezelfde functie. Hierdoor wordt er geen toegankelijke naam en rol gecommuniceerd aan hulpsoftware. Dit probleem doet zich op meerdere pagina's voor, waaronder op pagina:
https://werkenbijderechtspraak.nl/de-organisatie/
Bevinding 78: Op pagina https://werkenbijderechtspraak.nl/juristen/ komen lege links voor in de carrousel. De heading van ieder blok content is klikbaar gemaakt, maar de link zelf is niet gekoppeld aan de headingtekst en heeft daardoor geen toegankelijke naam. Dit probleem komt op meerdere pagina's voor, waaronder op pagina:
4.1.3 Statusberichten (Niveau AA)
Informatie over succescriterium 4.1.3 Statusberichten
Uitkomst: Onvoldoende
Bevinding 79: Wanneer bezoekers op pagina https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior op 'Alles wissen' klikken verandert de pagina naar https://werkenbijderechtspraak.nl/vacatures/ en worden de actieve filters verwijderd. Deze verandering wordt echter niet gecommuniceerd aan bezoekers die gebruik maken van voorleessoftware. Aangezien de focusvolgorde ook vanaf hetzelfde punt verder gaat, is er geen indicatie voor de bezoekers om te vermoeden dat de pagina verandert is. Zorg ervoor dat deze informatie beschikbaar is voor hulpsoftware. Dit geldt ook voor de link 'Bekijk kaart' op dezelfde pagina.
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
- Home:
https://werkenbijderechtspraak.nl/ - Contact:
https://werkenbijderechtspraak.nl/contact/ - Veel gestelde vragen:
https://werkenbijderechtspraak.nl/veelgestelde-vragen/ - Niet bestaande pagina:
https://werkenbijderechtspraak.nl/bestaatniet - Toegankelijkheid:
https://werkenbijderechtspraak.nl/toegangkelijkheid/ - Zoekresultaten:
https://werkenbijderechtspraak.nl/vacatures/?_keyword_search=junior - Job alert:
https://werkenbijderechtspraak.nl/job-alert/ - Vakgebieden:
https://werkenbijderechtspraak.nl/vakgebieden/ - Juristen:
https://werkenbijderechtspraak.nl/juristen/ - De organisatie:
https://werkenbijderechtspraak.nl/de-organisatie/ - Medewerker:
https://werkenbijderechtspraak.nl/nieuws/collegas/marlies-wolfrat-vreemdelingenrechter/ - Vacatures:
https://werkenbijderechtspraak.nl/vacatures/ - Vacature:
https://werkenbijderechtspraak.nl/vacature/bi-specialist-back-end-etl-ontwikkelaar-1017832/ - Video:
https://werkenbijderechtspraak.nl/rechter-of-raadsheer-worden/ - PDF rechter:
https://werkenbijderechtspraak.nl/wp-content/uploads/2023/07/Senior-rechter.pdf - Kandidatenportaal:
https://werkenbijderechtspraak.nl/kandidatenportaal/ - Locatie Den Haag:
https://werkenbijderechtspraak.nl/nieuws/locaties/rechtbank-den-haag/ - Solliciteren:
https://werkenbijderechtspraak.nl/apply/?web_page_id=1011915 - Stage overzicht:
https://werkenbijderechtspraak.nl/campus-recruitment/ - Vacature:
https://werkenbijderechtspraak.nl/vacature/senior-administratief-medewerker-team-administratie-handel-kanton-1017123/
Ondersteunende technieken
Bronnen
-
Evaluatiedocument WCAG 2.0
www.drempelvrij.nl/over-het-waarmerk -
Web Content Accessibility Guidelines (WCAG) 2.0 (Geautoriseerde Nederlandse vertaling)
www.w3.org/Translations/WCAG20-nl -
Website Accessibility Conformance Evaluation Methodology (WCAG-EM)
www.w3.org/WAI/eval/conformance -
Web Content Accessibility Guidelines (WCAG)
www.w3.org/WAI/intro/wcag -
How to Meet WCAG 2.1 Quick Reference
www.w3.org/WAI/WCAG21/quickref/
Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.