Bevindingen voor je spreadsheet: Audit digitale toegankelijkheid van Werken bij gemeente Krimpenerwaard

Naam website	Werken bij gemeente Krimpenerwaard
Scope	Alles op werkenbijgemeentekrimpenerwaard.nl

`nr`	`Bevinding`	`WCAG SC`	`Mogelijk verantwoordelijk`	`Status`
`1`	`De video op pagina https://werkenbijgemeentekrimpenerwaard.nl mist een tekstalternatief. Los dit op door bij voorkeur direct boven de video een korte omschrijving van de inhoud van de video te plaatsen. Of plaats deze direct na de video. Deze video komt op meerdere pagina’s voor, onder andere op pagina https://werkenbijgemeentekrimpenerwaard.nl/de-organisatie. Controleer de hele site.`	`1.1.1`	`techniek, content, visuele vormgeving`
`2`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig staan onder "Details" een aantal SVG-afbeeldingen, onder ander van een huis en kantoor, locatie, geld en van een klok. Deze afbeeldingen hebben betekenis (thuiswerkmogelijkheid, salaris, standplaat) maar een tekstalternatief ontbreekt. Los dit op met role="img" en een title-element met een alternatieve tekst als eerste child-element in de svg-code toe te voegen. Verwijder tevens aria-hidden=true uit het span-element die om de svg-code staan. Hetzelfde probleem komt op meerdere plekken voor, onder andere op de pagina's: - https://werkenbijgemeentekrimpenerwaard.nl/vacatures - https://werkenbijgemeentekrimpenerwaard.nl/. Controleer de hele site.	`1.1.1`	`techniek, content, visuele vormgeving`
`3`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/contact is de tekst "stuur een e-mail naar" opgemaakt met het strong-element. Het strong-element is bedoeld om nadruk te geven aan een of enkele woorden, niet voor hele zinnen. Gebruik eventueel CSS om een bepaalde opmaak te realiseren. Ook op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig doet zich een vergelijkbaar probleem voor bij de tekst "Dit is geen standaard beleidsrol".`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`4`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/contact zijn visuele koppen opgemaakt met het strong-element. Het strong-element is bedoeld om nadruk te geven aan een of enkele woorden. Deze elementen mogen niet worden gebruikt als visuele kop, omdat ze niet dezelfde betekenis hebben als een kop (bijvoorbeeld h2 of h3). Verwijder daarom het strong-element en maak de visuele koppen "Kantoor Bergambacht", "Kantoor Lekkerkerk" etcetera op als echte kop. Dit probleem doet zich ook voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/over-krimpenerwaard.	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`5`	`Op https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig is de eerste alinea opgemaakt met het strong- en/of em-element. Het strong- en em-element zijn bedoeld om nadruk te geven aan een of enkele woorden, niet voor hele zinnen. Maak de zinnen op via de stylesheet.`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`6`	`Op de pagina's met een vacature zoals https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig zijn koppen aanwezig die zijn opgemaakt met strong. Haal strong overal weg. Sommige koppen (bijvoorbeeld 'Daarnaast' in sommige vacatures) zijn niet opgemaakt met een kop-element. Markeer deze alsnog met een <h2>, <h3> of <h4>. Pas dit op alle pagina's met een vacature aan.`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`7`	`In de footer staan een viertal links waaronder "Privacyverklaring" en "Contact". Deze links horen bij elkaar, zet ze daarom samen in een opsomming.`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`8`	`In de footer staat een viertal social media iconen. Deze horen bij elkaar, zet ze daarom samen in een opsomming.`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`9`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/wat-vinden-wij-belangrijk staat een opsomming van zeven speerpunten, elk met een vinkje ervoor. Deze horen bij elkaar, zet ze daarom samen in een opsomming. ![screenshot opsomming](screenshot01.png)`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`10`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staan opsommingen van kenmerken van de betreffende vacature, zoals de werkplek en het salaris. Deze horen bij elkaar, zet ze daarom bij elkaar in een opsomming. Vergelijkbare problemen doen zich voor op onder andere pagina's zoals: - https://werkenbijgemeentekrimpenerwaard.nl/ - https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`11`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staan de Uitgelichte vacatures en Alle vacatures. Elke vacature staat in een blok en begint met de functienaam in een groter en vetter lettertype. Deze zien eruit al koppen maar zijn niet gemarkeerd als kop. Markeer deze functies met een <h3>.`	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`12`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig/c/new staat een sollicitatieformulier met onderaan de checkbox “Ik ga akkoord met de bewaartermijn van 6 maanden en het privacybeleid”. Als deze niet wordt aangevinkt en het formulier vervolgens wordt verzonden, dan verschijnt de foutmelding “Dit veld is verplicht en kan niet leeg blijven.” onder dit veld. Dit wordt niet voorgelezen als de toetsenbordfocus erop komt. Dit komt omdat de checkbox en de foutmelding niet gekoppeld zijn. Dit kan worden opgelost door het attribuut ‘aria-describedby’ op de checkbox te plaatsen met daarin de waarde van het het id-attribuut op het div-element waarin zich de foutmelding bevindt. Dit probleem doet zich voor op alle vacature-pagina’s, waaronder pagina https://werkenbijgemeentekrimpenerwaard.nl/o/consulent-inkomen-1/c/new.	`1.3.1`	`techniek, interactieontwerp, content, visuele vormgeving`
`13`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/arbeidsvoorwaarden staan iconen bij de arbeidsvoorwaarden. Deze iconen hebben een tekstalternatief, bijvoorbeeld "icoon stapel munten". Deze afbeeldingen staan zowel visueel als in de code boven de kop waar ze bij horen, en dat is niet correct. Dit kan voor bezoekers die gebruikmaken van hulpsoftware verwarrend zijn. Zet de afbeeldingen daarom in de code onder de kop, visueel mogen de iconen boven de bijbehorende koppen blijven staan. Als de iconen puur decoratief bedoeld zijn kan het tekstalternatief ook worden leeg gelaten, dan is het probleem ook opgelost.	`1.3.2`	`content, visuele vormgeving`
`14`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new staat bij verplichte velden een rode asterisk op een witte achtergrond. Deze asterisk heeft een te laag contrast. De contrastverhouding is 4,0:1 waar dit 4,5:1 moet zijn. vergelijkbare problemen komen ook voor op: - https://werkenbijgemeentekrimpenerwaard.nl/vacatures - https://werkenbijgemeentekrimpenerwaard.nl/ ![screenshot formulier](screenshot02.png)`	`1.4.3`	`interactieontwerp`
`15`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staat onder de kop "Alle vacatures" een invoerveld met als placeholdertekst "Vacatures zoeken...". Deze tekst heeft een contrast van 4,0:1 ten opzichte van de achtergrond, en dat is te weinig. Zorg hier voor een minimaal contrast van 4,5:1.`	`1.4.3`	`interactieontwerp`
`16`	Als op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures de knop Delen wordt geactiveerd opent er een dialoogvenster. In het dialoogvenster staan onderin een aantal links met social media iconen. Het contrast van een aantal van deze iconen is niet voldoende. Als dat de originele kleur is, is dat geen probleem. Bij het logo met de letter X van Twitter / X is dat wel een probleem. De originele achtergrondkleur is zwart. Dit is hier aangepast en daardoor is het contrast van de blauwe achtergrond en de witte letter X met 2,8:1 onvoldoende. Dit moet minimaal 3,0:1 zijn. Controleer dit ook voor de overige logo’s.	`1.4.3`	`interactieontwerp`
`17`	`Wanneer bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% zijn in het cookievenster delen van de content en functionaliteit onzichtbaar. Het gaat onder andere om de onderdelen "Noodzakelijke cookies" en "Functionele cookies". Zorg ervoor dat alle content en functionaliteit ook op lage resolutie beschikbaar blijft.`	`1.4.10`	`interactieontwerp, content`
`18`	`Wanneer bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% is het logo linksbovenaan iedere pagina niet geheel zichtbaar, de laatste twee letters vallen buiten beeld. Zorg ervoor dat alle content en functionaliteit ook op lage resolutie beschikbaar blijft. ![screenshot opsomming](screenshot03.png)`	`1.4.10`	`interactieontwerp, content`
`19`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staan onder de kop "Alle vacatures" filters. Wanneer bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% is de placeholdertekst in de velden slechts deels zichtbaar. Zo is bijvoorbeeld van de tekst "Alle dienstverbanden" alleen "Alle di..." leesbaar. Zorg ervoor dat alle content en functionaliteit ook op lage resolutie beschikbaar blijft.`	`1.4.10`	`interactieontwerp, content`
`20`	Als op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures de knoppen om de keuzemenu’s te openen worden geactiveerd dan vouwt een listbox open. Het gaat om de knoppen “Alle afdelingen”, “Alle dienstverbanden” en “Werkmodel”. Als deze knoppen vervolgens nog een keer worden geactiveerd met Enter, dan gebeurt er niets. Dat is niet correct. De keuzelijst moet dan weer dichtvouwen. Het betreft hier namelijk een toggle mechanisme. Dit doet zich op meerdere pagina’s voor, waaronder op pagina https://werkenbijgemeentekrimpenerwaard.nl/ met de knop “Alle afdelingen” onder het label “Voorkeursafdeling”.	`2.1.1`	`techniek, content`
`21`	`Bij een vacature waar meerdere locaties voor zijn, bijvoorbeeld de functie van Wegbeheerder, verschijnt een pop-up als de focus daarop komt. Deze tekst, in dit geval de tekst “Lekkerkerk” is alleen beschikbaar voor ziende mensen, maar niet voor mensen die gebruikmaken van voorleessoftware. Zorg ervoor dat deze tekst ook beschikbaar is voor blinde mensen. Zie pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures bij de vacature voor wegbeheerder.`	`2.1.1`	`techniek, content`
`22`	`Op alle pagina’s staat in het hoofdmenu de knop “Over Krimpenerwaard” die een submenu toont als deze wordt geactiveerd met de Enter-toets. Als er vervolgens weer op Enter wordt gedrukt gebeurt er niets, Dat is niet correct, het submenu moet dan weer sluiten. Het betreft hier namelijk een toggle-mechanisme.`	`2.1.1`	`techniek, content`
`23`	Bij het versturen van de aanmelding voor een JobAlert op pagina https://werkenbijgemeentekrimpenerwaard.nl/ verschijnt een Captcha in een canvas-element. Er verschijnt een puzzeltje waar een ontbrekend stukje van een puzzel moet worden gekozen en op de juiste plaats gezet. Dit kan alleen met behulp van de muis, toetsenbordgebruikers kunnen de aanmelding niet afronden. Zorg ervoor dat alle functionaliteit ook met het toetsenbord te bedienen is. Het zelfde probleem doet zich voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures en op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new.	`2.1.1`	`techniek, content`
`24`	Bij het versturen van de aanmelding voor een JobAlert op pagina https://werkenbijgemeentekrimpenerwaard.nl/ verschijnt een Captcha in een canvas-element. Voor niet ziende bezoekers is hier een mogelijkheid om een Toegankelijkheidscode op te halen. Deze werkt echter niet waardoor deze bezoekers hun aanmelding niet kunnen afronden. Het zelfde probleem doet zich voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures en op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new.	`2.1.1`	`techniek, content`
`25`	Bij het versturen van de aanmelding voor een JobAlert op pagina https://werkenbijgemeentekrimpenerwaard.nl/ verschijnt een Captcha in een canvas-element. Er verschijnt een puzzeltje waar een ontbrekend stukje van een puzzel moet worden gekozen en op de juiste plaats gezet. Dit verdwijnt na ongeveer 20 seconden zonder dat de mogelijkheid wordt geboden om de sessieduur te verlengen. Het zelfde probleem doet zich voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures en op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new.	`2.2.1`	`techniek, content`
`26`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/ staat bovenaan de pagina een video die automatisch begint af te spelen na het laden van de webpagina. Er is geen mechanisme beschikbaar, of makkelijk bereikbaar, om de content te laten stoppen, te pauzeren of te verbergen. Voeg een mechanisme toe waarmee de gebruiker dat kan, of verwijder de content om dit probleem op te lossen. Zorg ervoor dat deze functionaliteit zowel met toetsenbord als met de muis bedienbaar is.`	`2.2.2`	`techniek, content`
`27`	`Advies: De paginatitel van pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new is "Gemeente Krimpenerwaard - Open sollicitatie - Sollicitatie". Overigens heet de tabknop om naar 'Sollicitatie' te gaan 'Solliciteren', wellicht is dat ook een betere naam. Deze titel is onderscheid zich niet erg met de titel "Gemeente Krimpenerwaard - Open sollicitatie" van pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie.`	`2.4.2`	`content, visuele vormgeving`
`28`	`Advies: Het volgende wordt niet afgekeurd, maar kan wel verbeterd worden. Het is aan te bevelen om de naam van de organisatie op te nemen in de titel van de pagina. De titel van bijvoorbeeld de Contactpagina wordt dan "Contact \| Werken bij Krimpenerwaard".`	`2.4.2`	`content, visuele vormgeving`
`29`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl staat een video. Over de video staat een knop “Play”. Als deze geactiveerd wordt start de video en de toetsenbord-focus gaat dan naar het body-element. Pas als er nog een keer wordt getabd, komt de focus op het iframe-element waarin de video staat. Dit is geen logische volgorde. Zorg ervoor dat de focus eerst op het iframe-element komt en pas daarna op de afspeelknop. Deze video komt op meerdere pagina’s voor, onder andere op pagina https://werkenbijgemeentekrimpenerwaard.nl/de-organisatie. Controleer de hele site.	`2.4.3`	`techniek, content`
`30`	De eerste keer dat een bezoeker de website bezoekt, verschijnt er een cookiemelding over de pagina heen (ook wel popup, modal of lightbox genoemd). Deze popup komt voor de pagina te staan. Het openen van een popup heeft bepaalde eisen met betrekking tot de toetsenbordfocus. Zolang de popup open staat mag de toetsenbordfocus niet teruggaan naar de pagina op de achtergrond. Dat is nu wel mogelijk waardoor je de focus achter de popup niet meer kunt zien. Zorg dat je het dialoogvenster pas kan verlaten als dit gesloten wordt. Zorg dat de onderliggende content niet actief is ("inert"). Geef dit popup-venster in de html de rol "dialog" en plaats er het attribuut aria-modal=”true”. Zie ook SC 4.1.2.	`2.4.3`	`techniek, content`
`31`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/ staan links met de linktekst “Bekijk vacature” en “Lees meer”. Vermijd linkteksten als ‘Lees meer’ en ‘Klik hier’, zulke teksten beschrijven het linkdoel niet. Zorg dat linkteksten duidelijk beschrijven waar de link naartoe gaat, bijvoorbeeld door de tekst aan te vullen met de titel van het bericht of pagina waarnaar gelinkt wordt. Als visueel duidelijk is waar de link bij hoort hoeft deze aanvullende tekst niet visueel zichtbaar te zijn. Op onder andere pagina https://werkenbijgemeentekrimpenerwaard.nl/de-organisatie doet zich het zelfde probleem voor bij de links “Lees verder”. En op pagina https://werkenbijgemeentekrimpenerwaard.nl/arbeidsvoorwaarden bij de link "Meer informatie".	`2.4.4`	`techniek, interactieontwerp, content, visuele vormgeving`
`32`	`Op https://werkenbijgemeentekrimpenerwaard.nl/contact is de “W” van “Wie zijn wij?” klikbaar. Er opent dan een mogelijkheid om te mailen. Dit hoort bij het mail-adres er direct boven. Verwijder de mogelijkheid om de "W" aan te klikken. Een vergelijkbaar probleem doet zich voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie en op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/open-sollicitatie/c/new bij de ”o” van “Zie ook".`	`2.4.4`	`techniek, interactieontwerp, content, visuele vormgeving`
`33`	`In de footer staan vier social-media links. Het linkdoel van deze links is "Facebook", "LinkedIn" etcetera. Dit is niet voldoende duidelijk, omdat niet vermeld wordt dat het gaat om de social media pagina's van de gemeente Krimpenerwaard. Pas dit aan naar bijvoorbeeld "Facebook van de gemeente Krimpenerwaard".`	`2.4.4`	`techniek, interactieontwerp, content, visuele vormgeving`
`34`	`Er is maar één manier om alle pagina's binnen deze website te vinden en dat is door het volgen van links. Zorg dat er nog een manier is om elke pagina te kunnen bereiken. Dit kan bijvoorbeeld een zoekfunctie zijn of een sitemap.`	`2.4.5`	`techniek, interactieontwerp, visuele vormgeving`
`35`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl staat een video in een iframe. Het title-attribuut op het iframe-element bevat alleen de beschrijving van de video, maar niet het type content. Dat is niet voldoende, geef ook aan te dat het om een video gaat. Deze video komt op meerdere pagina’s voor, onder andere op pagina https://werkenbijgemeentekrimpenerwaard.nl/de-organisatie. Controleer de hele site.`	`2.4.6`	`techniek, visuele vormgeving`
`36`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl staat een video met daaroverheen de knop “Play”. Dit beschrijft onvoldoende de functie van de knop. Verander de naam van deze knop daarom bijvoorbeeld in “Speel video Werken bij de gemeente Krimpenerwaard”, zodat duidelijk is wat er afgespeeld wordt. Deze video komt op meerdere pagina’s voor, onder andere op pagina https://werkenbijgemeentekrimpenerwaard.nl/de-organisatie. Controleer de hele site.`	`2.4.6`	`techniek, visuele vormgeving`
`37`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/o/kwaliteitsadviseur-sociaal-veilig staan de koppen "Dus". Deze kop beschrijft de content die er onder staat niet voldoende. Zorg hier daarom voor een meer beschrijvende kop.`	`2.4.6`	`techniek, visuele vormgeving`
`38`	`De eerste keer dat een bezoeker de website bezoekt, verschijnt er een cookiemelding over de pagina heen. In dit venster staat de knop “Meer opties”. Als deze knop wordt geactiveerd verandert de tekst op de knop in “Opties verbergen”. De focus op deze knop is dan niet meer zichtbaar. Zorg ervoor dat het element dat de focus heeft altijd zichtbaar is. Hetzelfde doet zich voor met de knop “Toon meer”, waarvan na activering de tekst op de knop verandert in “Toon minder”.`	`2.4.7`	`interactieontwerp, content`
`39`	`Bovenaan iedere pagina staat het logo van de gemeente Krimpenerwaard, dat fungeert als een link naar de homepage. Als hier met het toetsenbord naartoe wordt genavigeerd en vervolgens de tabtoets wordt gebruikt, is de toetsenbordfocus niet zichtbaar. Onderliggend is de focus dan op een tweede link naar de homepage, wat niet de bedoeling is. Verwijder deze daarom en zorg dat de toetsenbordfocus altijd zichtbaar blijft.`	`2.4.7`	`interactieontwerp, content`
`40`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/over-krimpenerwaard staat een kaart. Als de focus op het div-element komt dat de kaart omvat dan is de blauwe focusrand slechts even zichtbaar. Deze moet zichtbaar blijven zolang het element focus heeft. Dit probleem doet zich ook voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/contact.`	`2.4.7`	`interactieontwerp, content`
`41`	Op alle pagina’s doet zich het volgende voor. Nadat de skiplink is geactiveerd en er verder wordt getabd is er geen focus zichtbaar op het eerste focusbare element. Als er weer verder wordt getabd en weer terug wordt getabd naar het betreffende element is de focus wel zichtbaar. Dat is niet voldoende, de focus moet ook de eerste keer zichtbaar zijn. Zie bijvoorbeeld de link “14 0182” op pagina https://werkenbijgemeentekrimpenerwaard.nl/contact en de link “Beleidsadviseur Elektriciteit” op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures.	`2.4.7`	`interactieontwerp, content`
`42`	`Als op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures de knop "Delen" wordt geactiveerd opent er een dialoogvenster. Als dit venster opent staat de focus op de knop "Sluiten" (x), maar de focus is dan niet zichtbaar. De tweede keer en volgende keren is de focus in de vorm van een blauwe rand wel zichtbaar. Dat is niet voldoende. Zorg ervoor dat de focus de eerste keer ook zichtbaar is.`	`2.4.7`	`interactieontwerp, content`
`43`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staat onder de kop “Alle vacatures” de knop “Alle afdelingen”, die een listbox uitvouwt. Deze knop heeft als zichtbaar label “Alle afdelingen”. Dit wijkt af van de toegankelijke naam van de knop, deze is “Selecteer vacatures om op te filteren”. Doordat het zichtbare label en de toegankelijke naam van deze knop niet overeenkomen, is de knop niet of moeilijk te bedienen door bezoekers die gebruikmaken van spraaksoftware. Zorg ervoor dat het visueel zichtbare label van deze knop in de toegankelijke naam voorkomt, het liefst vooraan. Hetzelfde doet zich voor met de knoppen “Alle dienstverbanden” en “Werkmodel”. Dit doet zich op meerdere pagina’s voor, waaronder op pagina https://werkenbijgemeentekrimpenerwaard.nl/ met de knop met het zichtbare label “Alle afdelingen”, dat afwijkt van de toegankelijke naam “Voorkeursafdeling”.	`2.5.3`	`techniek, interactieontwerp, content`
`44`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staat een zoekveld met de placeholdertekst “Vacatures zoeken”. De toegankelijke naam van het veld luidt “Voer een zoekopdracht in om vacatures op te filteren” maar heeft geen zichtbaar label. Voorzie in een visueel zichtbaar label dat overeenkomt met de toegankelijke naam. Dat houdt in dat de visuele naam in de toegankelijke naam aanwezig is, liefst vooraan.`	`2.5.3`	`techniek, interactieontwerp, content`
`45`	Op de pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staat onder de kop "Alle vacatures" de knop "Delen". Als deze wordt aangeklikt verschijnt een pop-up met de tekst "Share filtered jobs list". Deze tekst is in een andere taal. Hiervoor moet in de code een taalwisseling aangegeven worden. Dit kan door op de omliggende html-code een lang="en" toe te voegen. Het probleem kan ook worden opgelost door de Engelse tekst te vervangen door de tekst "Deel vacature" zoals die op andere plaatsen op de site wordt gebruikt.	`3.1.2`	`visuele vormgeving`
`46`	Op pagina https://werkenbijgemeentekrimpenerwaard.nl/ kan een gebruiker zich aanmelden voor een JobAlert. Als de verplichte velden niet of niet correct worden ingevuld en op "Versturen" wordt geklikt, dan verschijnt in Chrome een browserafhankelijke foutmelding, bijvoorbeeld “Vul dit veld in”. Dit soort browserafhankelijke foutmeldingen veroorzaken meerdere toegankelijkheidsproblemen. Zo is de melding "Vul dit veld in" geen duidelijke foutmelding, maar een instructie. Een goede foutmelding geeft aan waar de fout zit en bevat tekst die aangeeft dat er een fout is gemaakt. In de meeste gevallen bevat een foutmelding een ontkenning. Een voorbeeld van een goede foutmelding is "Het veld is niet of niet goed ingevuld". Ook verschijnt er nu als er fouten zijn gemaakt in meerdere velden, telkens maar één melding in beeld. Dit is niet voldoende, omdat alle fouten tegelijk getoond moeten worden. Daarnaast verdwijnt de melding als de focus van het veld wordt gehaald. Dit is niet correct, de melding moet in beeld blijven. Dit probleem doet zich voor bij alle verplichte invoervelden in dit formulier. Los dit op door correcte foutmeldingen zoals "Het veld is niet (goed) ingevuld" bij alle betreffende invoervelden tegelijkertijd te tonen. Dit probleem doet zich ook voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures.	`3.3.1`	`techniek`
`47`	`Als op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures één van de knoppen “Alle afdelingen”, “Alle dienstverbanden” of “Werkmodel” wordt geactiveerd dan verschijnt er een listbox. Wanneer hier een optie wordt geselecteerd, dan krijgt de knop waarmee de listbox geopend wordt dezelfde tekst als deze optie. Het label is daardoor visueel niet meer zichtbaar. Zorg ervoor dat de dat altijd duidelijk is dat de filters over afdelingen, dienstverbanden en werkmodellen gaat.`	`3.3.2`	`techniek`
`48`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/vacatures staat onder de kop “Alle vacatures” een zoekveld. Deze heeft geen zichtbaar label maar wel een placeholdertekst. De placeholder-tekst is niet voldoende, want die verdwijnt zodra de bezoeker begint met typen. Voor sommige mensen kan het moeilijk zijn om te onthouden wat ze moeten invullen als dat er niet duidelijk bij staat. Voeg een label toe dat altijd zichtbaar blijft om dit probleem op te lossen.`	`3.3.2`	`techniek`
`49`	De eerste keer dat een bezoeker de website bezoekt, verschijnt er een cookiemelding over de pagina heen (ook wel popup, modal of lightbox genoemd). Deze popup komt voor de pagina te staan. Het openen van een popup heeft bepaalde eisen met betrekking tot de toetsenbordfocus. Zolang de popup open staat mag de toetsenbordfocus niet teruggaan naar de pagina op de achtergrond. Dat is nu wel mogelijk. Het aria-attribuut aria-modal ontbreekt. Zorg dat de onderliggende content niet actief is ("inert"). Geef dit popup-venster in de html de rol "dialog" en plaats er het attribuut aria-modal=”true”. Zie ook SC 2.4.3.	`4.1.2`	`techniek, content, visuele vormgeving`
`50`	`De eerste keer dat een bezoeker de website bezoekt, verschijnt er een cookiemelding over de pagina heen. Deze popup komt voor de pagina te staan. Dit popup-venster heeft in de html de rol "dialog" gekregen, maar mist het attribuut aria-modal=”true”. Voeg dit alsnog toe.`	`4.1.2`	`techniek, content, visuele vormgeving`
`51`	`Op pagina https://werkenbijgemeentekrimpenerwaard.nl/over-krimpenerwaard staat een kaart. Het omvattende div-element is focusbaar gemaakt doordat het attribuut tabindex=”0” eraan is toegevoegd. Dit is nu een interactief element, maar mist een rol en een naam. Een geschikte rol zou zijn “application” en een geschikte naam bijvoorbeeld “kaart locaties gemeente Krimpenerwaard”. Dit probleem doet zich ook voor op pagina https://werkenbijgemeentekrimpenerwaard.nl/contact.`	`4.1.2`	`techniek, content, visuele vormgeving`
`52`	ADVIES: Op alle pagina’s bevindt zich de knop “Over Krimpenerwaard” in de hoofdnavigatie. Als deze wordt geactiveerd verschijnt er subnavigatie. Dit overzicht is opgemaakt met het attribuut role=”menu”. Voor websites is het ongebruikelijk ongebruikelijk om rollen die bedoeld zijn voor een applicatie te gebruiken. Dit kan verwarrend zijn voor bezoekers die het toetsenbord gebruiken en gewend zijn met bepaalde toetsen door en (echte) menu te navigeren. Gebruik hier bij voorkeur de html-code ` ` en ` `.	`4.1.2`	`techniek, content, visuele vormgeving`

Bevindingen voor je spreadsheet:
Audit digitale toegankelijkheid van Werken bij gemeente Krimpenerwaard

Scope van de evaluatie

Uitgebreide toetsresultaten

Onderbouwing van de evaluatie

Steekproef getoetste webpagina's

Ondersteunende technieken

Webbrowsers (useragents) en andere software

Bronnen