Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website gemeentepanel.nl

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Gemeentepanel
Datum 7 april 2025
Scope van de website Binnen de scope van het onderzoek valt
Alle pagina's op gemeentepanel.nl
Buiten de scope van het onderzoek valt:
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
  • Alle externe systemen en websites waar via het onderzochte domein met een link naar wordt verwezen.
Conformiteitsdoel WCAG 2.1 niveau AA

Uitgebreide toetsresultaten

Aantal bevindingen: 24

1. Waarneembaar

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 1: Op alle pagina's van de website staat in de footer, onder het kopje "Contact" een blok tekst (het adres en de link) dat visueel uit 2 alinea's bestaat, maar in de HTML ten onrechte gemarkeerd als een enkel <div>-element, gescheiden door <br>-elementen.
De structuur die op de pagina te zien is, moet ook in de code staan. Haal het a-element (de link) uit het <address>-element.

Bevinding 2: Op pagina https://gemeentepanel.nl/barneveld/project/afvalbeleid wordt een kop van niveau 2 onmiddellijk gevolgd door een andere kop van hetzelfde niveau. Zie "Onderzoek is afgerond." en "Resultaten". Als twee koppen van hetzelfde niveau (bijvoorbeeld h2) direct onder elkaar staan zonder inhoud ertussen, dan is één van de koppen niet op de goede manier gebruikt.
Dit komt ook op andere pagina’s voor: op pagina https://gemeentepanel.nl/hilversum/project/tijdelijk-terrassen en op pagina https://gemeentepanel.nl/eemnes/project/besluiten-gemeente in de volgende koppen: “Onderzoek is afgerond.”, “Resultaten” en “Uitleg over het onderzoek”.

Bevinding 3: Op pagina https://gemeentepanel.nl/barneveld/project/afvalbeleid staan veel teksten waarin het strong-element wordt gebruikt voor stylingdoeleinden. Lange delen van zinnen in verschillende teksten zijn opgenomen in het strong-element om ze vet te maken. Zie bijvoorbeeld lijsten onder de kop "Verbeteringen voor de toekomst" en andere langere vetgedrukte teksten op de pagina. Het strong-element heeft een semantische waarde: het geeft een bepaalde betekenis aan de tekst die erin staat. Dit element geeft aan dat de tekst extra nadruk moet krijgen. Om die reden mag dit element niet gebruikt worden om alleen een visueel effect te bereiken (vetgedrukte tekst). Gebruik hiervoor CSS.
Zie ook pagina’s https://gemeentepanel.nl/hilversum/project/tijdelijk-terrassen en https://gemeentepanel.nl/eemnes/project/besluiten-gemeente.

Bevinding 4: Op pagina https://gemeentepanel.nl/barneveld/vragen onder het kopje "Vraag en antwoord", in de sectie met verborgen inhoud, missen de elementen die verborgen inhoud openen en sluiten de rol van een koptekst. De teksten waarmee je delen van een accordeon kunt inklappen en uitklappen, doen dienst als koppen voor die delen. Daarom moeten deze teksten ook de rol van kop hebben. Het gaat verkeerd als deze teksten niet in de code als kop zijn gemarkeerd met een h-element zoals h2 of h3. Markeer deze teksten als kop of zorg dat de bestaande rol van kop niet wordt overschreven.

Bevinding 5: Op pagina https://gemeentepanel.nl/barneveld/aanmelden zorgt het verzenden van het formulier met lege gegevens voor de foutmelding "Dit veld is verplicht". Schermlezers in de formuliermodus echter vaak inhoud tussen invoervelden over, waardoor de foutmelding niet wordt voorgelezen. Dit komt doordat de relatie tussen de foutmelding en het veld ontbreekt. Hierdoor kan hulpsoftware deze informatie niet doorgeven aan de bezoeker. Dit kan opgelost worden door bij het input-element een aria-describedby-attribuut te gebruiken dat verwijst naar het id van de foutmelding.

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 6: Op pagina https://gemeentepanel.nl/barneveld/aanmelden staat een formulier met invoervelden voor persoonlijke gegevens (bijvoorbeeld e-mailadres). Het veld "E-mail" mist het attribuut autocomplete. Invoervelden voor persoonlijke informatie zoals achternaam, e-mailadres of telefoonnummer moeten het autocomplete-attribuut hebben. Hierdoor kunnen browsers en hulpsoftware helpen bij het invoeren. Bijvoorbeeld door de velden al automatisch in te vullen. Gebruik het autocomplete-attribuut voor alle velden waar persoonlijke informatie in moet worden gevuld. Voor het e-mailadres moet bijvoorbeeld autocomplete="email" worden gebruikt. Op deze pagina staat meer informatie over autocomplete en welke waardes verplicht gebruikt moeten worden: https://www.w3.org/Translations/WCAG22-nl/#input-purposes.
Ditzelfde probleem doet zich voor op pagina https://gemeentepanel.nl/barneveld/contact met de velden "Naam", "Telefoon" en "E-mail".

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevinding 7: Op pagina https://gemeentepanel.nl/barneveld/contact wordt na het verzenden van een formulier met lege of ongeldige velden alleen in het eerste veld een tekstueel foutbericht weergegeven. En op andere velden worden fouten alleen aangegeven door de kleur van de rand van het invoerveld te wijzigen. Dit is niet toegankelijk voor bezoekers die de kleur helemaal niet kunnen zien of die kleurenblind zijn. Zorg ervoor dat informatie niet alleen met kleur wordt overgedragen. Gebruik daarnaast nog andere manieren om fouten of ontbrekende informatie door te geven, bijvoorbeeld met tekst of iconen.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 8: Als pagina https://gemeentepanel.nl/barneveld/project/afvalbeleid wordt bekeken met een schermresolutie van 1280 bij 1024 en wordt ingezoomd tot 400%, verschijnt er een scrollbalk in de leesrichting. Horizontaal scrollen is niet toegestaan, ook niet als de viewport is ingesteld of ingezoomd op 320 CSS-pixels breed (voor verticale inhoud) of 256 CSS-pixels hoog (voor horizontale inhoud). Zorg ervoor dat de tekst binnen het scherm past. Alleen als scrollen in beide richtingen echt nodig is voor de betekenis of het gebruik van de inhoud mag het wel. Uitzonderingen zijn tabellen, betekenisvolle afbeeldingen en kaarten. Deze moeten leesbaar blijven, dus binnen deze elementen mag je wel scrollen.
Vergelijkbare kwestie is te zien op pagina's https://gemeentepanel.nl/hilversum/project/tijdelijk-terrassen en https://gemeentepanel.nl/barneveld/privacy.

Bevinding 9: Wanneer wordt ingezoomd tot 400%, bedekt de sticky header de pagina waardoor een kleine strook onder de header overblijft om de informatie op de pagina te lezen. De pagina kan niet worden gelezen of bediend. Zie alle pagina’s van de website, bijvoorbeeld https://gemeentepanel.nl/barneveld.

Bevinding 10: Op pagina https://gemeentepanel.nl/barneveld/toegankelijkheidsverklaring, wanneer de pagina bekeken wordt op 320px, is het woord "Toegankelijkheidsverklaring" te breed en niet afgebroken, waardoor het aan beide kanten buiten de viewport komt. Hierdoor moeten gebruikers horizontaal scrollen om het hele woord te kunnen lezen. Als een lang woord niet binnen beeld past bij een scherm van 320 pixels, moet het worden afgebroken. Er mag geen horizontale scrollbar komen. Los dit bijvoorbeeld op met de CSS-eigenschap word-break.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 11: Op pagina https://gemeentepanel.nl/barneveld/contact staat een formulier. De contrastverhouding tussen de grijze rand (HEX #CBD5E1) van een invoerveld en de witte achtergrond van de pagina is 1,5:1. De randen van interactieve elementen zoals invoervelden moeten minimaal een contrast van 3,0:1 hebben met de achtergrond.
Ditzelfde probleem doet zich voor op pagina https://gemeentepanel.nl/barneveld/aanmelden met het invoerveld "E-mail".

Bevinding 12: Op pagina https://gemeentepanel.nl/barneveld/aanmelden, onder het label "Toestemming", heeft een selectievakje een grijze rand (HEX #CBD5E1). De achtergrondkleur is wit, wat resulteert in een kleurcontrastverhouding van 1,5:1.
Het kleurcontrast tussen de randkleur en de achtergrondkleur van interactieve elementen zoals deze filteropties moet minimaal 3,0:1 zijn.

Bevinding 13: Op pagina https://gemeentepanel.nl/barneveld/aanmelden staan keuzelijsten "Geboortejaar" en "In welke kern (postcodegebied) woon je". De grijze pijlpictogrammen (HEX #94A3B8) die worden gebruikt om aan te geven dat het om keuzelementen gaat, hebben onvoldoende contrast tegen de witte achtergrond, die momenteel 2,6:1 is.
Dit moet minimaal 3,0:1 zijn.

Bevinding 14: Als op pagina https://gemeentepanel.nl/barneveld/contact het formulier wordt verzonden met lege of onjuiste velden, wordt de foutmelding getoond als een verandering van de randkleur van het invoerveld in rood (HEX #F87171). Deze kleur heeft onvoldoende kleurcontrast tegen de witte achtergrond: 2,8:1.

2. Bedienbaar

2.2 Genoeg tijd

2.2.1 Timing aanpasbaar (Niveau A)

Informatie over succescriterium 2.2.1 Timing aanpasbaar

Uitkomst: Onvoldoende

Bevinding 15: Op pagina https://gemeentepanel.nl/barneveld/contact is een formulier alleen HTML5-validatie gebruikt in de invoervelden "Naam", "E-mail", "Onderwerp" en "Bericht".
Deze foutmeldingen worden niet door alle browsers en schermlezers even goed ondersteund. Elke browser toont de meldingen anders, en niet altijd op een toegankelijke manier: de melding blijft te kort staan. Voeg daarom altijd zelf foutmeldingen toe aan het formulier. Controleer of er nog meer formulieren zijn die dit probleem hebben.

Bevinding 16: Op pagina https://gemeentepanel.nl/barneveld/aanmelden resulteert het verzenden van het formulier met de juiste gegevens in een succesbericht dat begint met "Dank je wel. Je bent nu lid van het inwonerspanel..." dat verschijnt en na korte tijd weer verdwijnt.
Hierdoor hebben sommige bezoekers niet de tijd om het bericht op hun gemak te lezen of erop te reageren. Dit kan opgelost worden door een manier toe te voegen waarmee bezoekers de tijdslimiet kunnen verwijderen of verlengen tot maximaal 20 uur.
Zie ook de pagina https://gemeentepanel.nl/barneveld/contact.

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Onvoldoende

Bevinding 17: Op pagina https://gemeentepanel.nl/huizen/project/duurzaamheid verwijst de skiplink naar de kop "Duurzaamheid", maar er staat meer unieke inhoud boven deze kop. Zie de tekst begint met "Duurzaamheid - Vul de vragenlijst in...". De skiplink moet verwijzen naar (het begin van) de unieke inhoud op de pagina. Zorg dat de skiplink naar de juiste plek verwijst.
Zie ook dezelfde issue op https://gemeentepanel.nl/barneveld, https://gemeentepanel.nl/diemen/project/ombuigingen-en-besparingen en https://gemeentepanel.nl/404.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 18: Veel pagina's van deze website hebben dezelfde tekst in het <title>-element van de pagina. Bijvoorbeeld pagina https://gemeentepanel.nl/barneveld/project/afvalbeleid, https://gemeentepanel.nl/barneveld en https://gemeentepanel.nl/barneveld/contact hebben allemaal de volgende titel: "Barneveld - Inwonerspanel". Dit is niet de bedoeling. In het title-element van elke pagina moet een unieke tekst staan die de inhoud van de pagina beschrijft, bij voorkeur gevolgd door de naam van de organisatie. Staat hier bij twee of meer pagina’s dezelfde tekst? Dan kan dit verwarrend zijn voor de bezoeker. De navigatie tussen pagina’s wordt dan ook lastiger. Verander de tekst in het title-element, zodat elke pagina een unieke title-tekst heeft die de inhoud van de pagina nauwkeurig beschrijft.
Zie andere pagina's van de website voor dezelfde kwestie.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 19: Op pagina https://gemeentepanel.nl/barneveld/vragen onder de kop "Vraag en antwoord" hebben secties met verborgen inhoud een probleem met de volgorde van focus. Elementen binnen ingeklapte blokken krijgen nog steeds toetsenbordfocus, ook al zijn ze niet zichtbaar. Dit zijn enkele voorbeelden: "aanmelden" links in "Wie kan meedoen?" en "Hoe werkt meedoen?" secties, "contact" link in "Heeft u nog vragen?" sectie, "afmelden" in "Ik wil mij afmelden" sectie. Dit is verwarrend voor bezoekers die met het toetsenbord navigeren en daarbij naar het scherm kijken. Zorg dat elementen die niet zichtbaar zijn geen toetsenbordfocus krijgen.

2.4.5 Meerdere manieren (Niveau AA)

Informatie over succescriterium 2.4.5 Meerdere manieren

Uitkomst: Onvoldoende

Bevinding 20: Er is geen tweede manier om de pagina's van deze website te vinden. Pagina's van de website kunnen alleen worden gevonden via een enkele link op een andere pagina.
Alle pagina’s die op de website staan moeten op meerdere manieren gevonden kunnen worden. Dat mag via een zoekveld, een sitemap of een inhoudsopgave.

2.4.6 Koppen en labels (Niveau AA)

Informatie over succescriterium 2.4.6 Koppen en labels

Uitkomst: Onvoldoende

Bevinding 21: In de footer op pagina https://gemeentepanel.nl/barneveld/contact staat een kopje “Snel naar”. Teksten zoals “Snel naar”, “Direct naar”, en “Ga naar” zijn te algemeen: links leiden in principe altijd naar een andere pagina, dit weet iemand ook al zonder dat er bijvoorbeeld “Direct naar” boven staat. Zo’n soort kop geeft dus geen extra informatie of context. Dat is vooral voor bezoekers die schermlezers gebruiken een probleem. Zij laten de koppen voorlezen om snel de structuur van een pagina te begrijpen, en de inhoud te vinden die voor hen relevant is. Gebruik daarom een meer specifieke kop, die duidelijk maakt wat voor soort inhoud of functionaliteit erna komt. Bijvoorbeeld door context te geven aan de links die volgen. Denk aan een kop als “Populaire pagina’s” of “Belangrijke onderwerpen”.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 22: Bovenaan de pagina https://gemeentepanel.nl/barneveld/contact staat in het logo de tekst: "gemeente Barneveld". De toegankelijke naam van deze link is "Home". De toegankelijke naam van de link is dus niet hetzelfde als de zichtbare tekst in het logo. Daardoor werkt de link niet goed als deze met een stemgestuurd systeem wordt geactiveerd. Daarvoor spreekt de bezoeker de tekst uit die zichtbaar is in het logo. Als de toegankelijke naam anders is, zal het systeem de link niet herkennen. Zorg daarom dat de tekst die in het logo zichtbaar is voorkomt in de toegankelijke naam, het liefst vooraan.
Een soortgelijk probleem staat op pagina https://gemeentepanel.nl/diemen/project/ombuigingen-en-besparingen.

3. Begrijpelijk

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 23: Op pagina https://gemeentepanel.nl/barneveld/contact maakt een formulier gebruik van HTML5-validatie, waarbij standaard HTML5-foutberichten worden weergegeven wanneer het formulier wordt ingediend met lege of onjuiste gegevens. Deze foutmeldingen worden niet door alle browsers en schermlezers even goed ondersteund. Elke browser toont de meldingen anders, en niet altijd op een toegankelijke manier: de melding is soms kortaf en onvolledig. Voeg daarom altijd zelf foutmeldingen toe aan het formulier. Controleer of er nog meer formulieren zijn die dit probleem hebben.
Een soortgelijk probleem staat op pagina https://gemeentepanel.nl/barneveld/aanmelden in het “E-mail” veld.

Bevinding 24: Op pagina https://gemeentepanel.nl/barneveld/aanmelden bevat een formulier foutmeldingen die de problemen bij het invoeren van gegevens niet adequaat beschrijven. In de volgende invoervelden ("Geboortejaar", "In welke kern (postcodegebied) woon je") en het selectievakje "Toestemming" ontbreken goede foutmeldingen. De huidige foutmeldingen zijn vaak instructies (“dit veld is verplicht”) in plaats van uitleg over wat er fout is gegaan (“dit veld is niet ingevuld”). Foutmeldingen moeten specifieker zijn en de aard van de fout uitleggen. Verander de teksten van de foutmeldingen, zodat bezoekers weten wat zij niet goed hebben gedaan.

Onderbouwing van de evaluatie

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

Steekproef getoetste webpagina's

Ondersteunende technieken

Bronnen

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

Geprint: 2025-05-12 12:15:39 v2.4-011