Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website Gemeente Tynaarlo

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Gemeente Tynaarlo
Datum 14 januari 2025
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op tynaarlo.nl
  • Pagina op subdomein ontdek.tynaarlo.nl
  • Alle stappen van het proces op afspraken.tynaarlo.nl
  • Alle stappen binnen de formulieren op tynap.mozardsaas.nl
  • Formulieren op gemeente-tynaarlo.email-provider.eu
  • Alle PDF's op tynaarlo.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: 61

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: Op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx (formulier Nieuwsbrief) is het logo voor hulpsoftware verborgen door middel van een leeg alt-attribuut. Het logo brengt visueel informatie over over bij welke gemeente het formulier hoort. Het is daarom belangrijk dat deze informatie ook beschikbaar is voor bezoekers die niet kunnen zien. Los dit op door een beschrijvende tekst toe te voegen in het alt-attribuut, bijvoorbeeld 'Logo Gemeente Tynaarlo'.

Bevinding 2: Op pagina https://ontdek.tynaarlo.nl staan in de legenda twee afbeeldingen die elkaar overlappen, beide afbeeldingen hebben als alternatieve tekst 'Ontdek Gemeente Tynaarlo'. Dit beschrijft niet wat er op de afbeeldingen te zien is. De afbeelding waarop het logo te zien is heeft een alternatieve tekst nodig waaruit blijkt welk logo hier staat. De afbeelding waarop een boerderij te zien is moet ook een alternatieve tekst krijgen die beschrijft wat op de afbeelding te zien is, waaronder de tekst 'Drenthe'.

Bevinding 3: Op pagina https://ontdek.tynaarlo.nl staan meerdere svg-elementen die 'role="img" bevatten maar geen titel hebben. Hierdoor worden deze elementen door hulpsoftware herkend en voorgelezen als afbeelding, maar zonder een beschrijvende tekst. Een voorbeeld is het icoon bij 'Deel kaart'. Als de iconen decoratief zijn kunnen deze worden verborgen voor hulpsoftware, bijvoorbeeld door 'aria-hidden="true" aan het svg-element toe te voegen.

Bevinding 4: Op pagina https://www.tynaarlo.nl/afval/bladhekken staat een kaart waarop via de muis kan worden ingezoomd, uitgezoomd en de kaart kan worden verplaatst. De elementen waaraan deze functionaliteit visueel te herkennen is, bevatten afbeeldingen die geen alternatieve tekst hebben maar ook niet voor hulpsoftware zijn verborgen. Voeg een alt-attribuut toe met tekst die beschrijft wat de functie van het element is (zie ook succescriterium 2.1.1), of geef het element op andere wijze een toegankelijke naam en verberg de afbeeldingen voor hulpsoftware middels een leeg alt-attribuut. Ditzelfde probleem komt voor bij de kaart op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.

Bevinding 5: Op pagina https://www.tynaarlo.nl/afval/bladhekken kan op de kaart visueel afgeleid worden waar bladbakken staan. Deze informatie is niet beschikbaar voor bezoekers die niet kunnen zien. Voeg een toegankelijk alternatief toe aan de pagina, bijvoorbeeld een lijst met adressen. Een soortgelijk probleem komt voor bij de kaart op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding. Hier kan een lijst van de straten waar het om gaat als tekst aan de pagina toegevoegd worden als toegankelijk alternatief voor de informatie op de kaart.

Bevinding 6: Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf bevat afbeeldingen die geen alternatieve tekst hebben. Deze afbeeldingen worden wel als zodanig voorgelezen doordat deze een figure-tag hebben in de codelaag. Maar voor bezoekers die niet kunnen zien is niet duidelijk welke informatie de afbeeldingen overbrengen. Waar dit decoratieve afbeeldingen betreft kan dit worden opgelost door deze als artifact te taggen. Bij informatieve afbeeldingen moet een beschrijvende alternatieve tekst worden toegevoegd. Het gaat bijvoorbeeld om de scheidingsstreep boven de kop '1. Inleiding' en de footer op pagina 1. Een ander voorbeeld is de afbeelding 'Afbeelding 1, Globale ligging rondweg Zuidlaren' op pagina 2.

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 7: Nieuwe bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/werkenbij komt een video voor die tekst bevat die niet in het audiospoor voorkomt, namelijk 'Maak er werk van' aan het einde van de video. Zorg ervoor dat deze informatie voorkomt in het audiospoor. Overweeg daarnaast een transcript toe te voegen voor de video, zodat ook doofblinde bezoekers toegang hebben tot de informatie in de video. In de video komt verder veel visuele informatie voor waar nu geen ruimte voor is dit op te nemen in het audiospoor. Houdt in de toekomst rekening met audiodescriptie door in het videoscript van te voren al voldoende ruimte te laten voor meer informatie in het audiospoor.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 8: Nieuwe bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/werkenbij komt een video voor die tekst bevat die niet in het audiospoor voorkomt, namelijk 'Maak er werk van' aan het einde van de video. Zorg ervoor dat deze informatie voorkomt in het audiospoor. In de video komt verder veel visuele informatie voor waar nu geen ruimte voor is dit op te nemen in het audiospoor. Houdt in de toekomst rekening met audiodescriptie door in het videoscript van te voren al voldoende ruimte te laten voor meer informatie in het audiospoor.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 9: Op pagina https://www.tynaarlo.nl/duurzaamheid bevat de kop 'Direct (samen) aan de slag' geen content, omdat deze zonder onderliggende content direct wordt opgevolgd door een kop op hetzelfde kopniveau ('Advies van een energiecoach'). De functie van een kop is het beschrijven van bijbehorende content. In dit geval beschrijft de kop de subkoppen die hierna komen. Daarom kan dit opgelost worden door de subkoppen op te maken op kopniveau h3. Een soortgelijk probleem doet zich voor bij de kop 'Duurzaam beleid en aanvullende informatie'.

Bevinding 10: Op pagina onder andere https://www.tynaarlo.nl/afval/afvalinzameling-1-januari-2025-0 staat boven de footer de vraag 'Heeft u gevonden wat u zocht?'. De bezoeker kan hierop antwoorden door het keuzerondje 'Ja' of 'Nee' aan te klikken. Doordat de vraag niet op de juiste wijze programmatisch aan de keuzerondjes is gekoppeld, is deze niet te horen als een bezoeker die niet kan zien de focus naar de keuzerondjes brengt. Er is een combinatie van technieken gebruikt om de vraag goed te koppelen, maar dit veroorzaakt dat hulpsoftware dit niet goed kan interpreteren. Er is gebruik gemaakt van het fieldset- en legend-element, waarbij het legend-element geen direct child-element van het fieldset-element is (terwijl dit wel zou moeten). De keuzerondjes zijn geplaatst in een div-element als child-element van het fieldset-element, met het attribuut role="radiogroup" welke niet op correcte wijze een naam heeft gekregen. Los dit bijvoorbeeld op door alléén gebruik te maken van fieldset- en legend en deze op juiste wijze te nesten, of door het div-element met role="radiogroup" via aria-label of aria-labelledby een naam te geven. Dit komt op meerdere pagina's voor.

Bevinding 11: Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) is de vraag 'Waarover gaat uw vraag? *' niet programmatisch gekoppeld aan bijbehorende keuzerondjes. Daarom is voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader mogelijk onduidelijk op welke vraag antwoord gegeven kan worden. Er is gebruik gemaakt van een combinatie van het fieldset- en legend-element, maar het legend-element is geen direct child-element van het fieldset-element. Hierdoor kan hulpsoftware dit niet goed interpreteren. Los dit op door het legend-element te verplaatsen in HTML, zodat deze een direct child-element is van het fieldset-element. Ditzelfde komt voor bij 'Heeft u een tweede vraag?'. Ook bij de volgende stap in het formulier, 'Aanvrager', komt dit voor bij 'Geslacht'. Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y (Contactformulier, toegankelijke versie) komt hetzelfde voor bij 'Geslacht'.

Bevinding 12: Op pagina https://ontdek.tynaarlo.nl/ wordt via de knop '+ Plek voorstellen' een dialoogvenster geopend waarin invoervelden staan. De velden hebben tekstlabels, maar doordat deze niet aan de invoervelden verbonden zijn wordt dit niet goed voorgelezen door hulpsoftware zoals een screenreader. Los dit bijvoorbeeld op door de tekstlabels expliciet te associëren met de invoervelden, door gebruik te maken van het for-attribuut bij het label-element die verwijst naar een id-attribuut bij het invoerveld.

Bevinding 13: Nieuwe bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/export-ponys-und-pferde komen twee tabellen voor. Deze tabellen bevatten geen koppen. Echter, in de eerste rij van iedere tabel staat het doel van de tabel aangegeven, bijvoorbeeld 'Exporttarife:'. Deze informatie doet visueel wel dienst als kop, en zou dus ook als tabelkop opgemaakt moeten worden. Een andere optie is om deze tekst opgemaakt als heading bóven de tabel te plaatsen.

Bevinding 14: Nieuwe bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/afval/afvalinzameling-1-januari-2025-0 komen visueel koppen voor, die met het strong-element in plaats van met een heading element zijn opgemaakt. Hierdoor zijn deze teksten niet herkenbaar en bereikbaar als kop voor bezoekers die gebruik maken van hulpsoftware. Maak gebruik van een h4-element om deze teksten correct op te maken

Bevinding 15: Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/2024-04-22_-_aantekeningen_interne_stuurgroep_geanonimiseerd_0.pdf is niet gecodeerd (van tags voorzien). Dit betekent dat de documentstructuur niet is te bepalen. Software kan daardoor bijvoorbeeld niet bepalen wat koppen zijn, 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 ALT-teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan. Dit geldt ook voor de PDF op pagina https://www.tynaarlo.nl/sites/default/files/documents/route_ro.pdf.

Bevinding 16: Aangepaste bevinding naar aanleiding van de hercontrole:
Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf bevat content die niet de juiste tag heeft gekregen in de codelaag, waardoor de structuur van het document lastig te bepalen is voor hulpsoftware. De koppen zijn bijvoorbeeld opgemaakt als kop, maar de structuur klopt niet omdat koppen van hetzelfde niveau elkaar opvolgen, zonder tussenliggende content. Daarnaast bevatten enkele teksten helemaal geen tagging. Zie ook succescriterium 1.3.2.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 17: Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf bevat content die in de codelaag niet in de juiste volgorde staat, waardoor de structuur van de content niet goed te begrijpen is. Ook gaat hierdoor de betekenis van bepaalde informatie verloren. Bezoekers die gebruik maken van hulpsoftware zoals een screenreader, komen de content tegen in de volgorde waarin deze in de codelaag staat. Een voorbeeld van waar het mis gaat bevindt zich op pagina 1, waar de bezoeker eerst de footer tegenkomt, dan het logo bovenaan de pagina, daarop volgt de tekst '1,9 km' die op de afbeelding op pagina 5 te zien is, waarna weer content op pagina 1 volgt. Ook zijn de afbeeldingen uit het hele document in de codelaag tussen de tekst van pagina 1 te vinden. Zorg ervoor dat de content in de codelaag in de juiste volgorde wordt geplaatst.

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevinding 18: Op pagina https://ontdek.tynaarlo.nl staan op de kaart verschillende locaties aangegeven. Waar dit via een icoon gebeurt, is aan het symbool te herkennen om welke soort locatie dit gaat. Maar er staan ook locaties aangegeven met alleen een gekleurde stip. Hier is alleen aan de kleur te herkennen om welke soort locatie het gaat, waardoor dit voor bezoekers die de kleuren niet goed kunnen onderscheiden niet af te leiden is. Zorg dat informatie niet alleen door kleur wordt overgebracht maar ook op andere wijze, bijvoorbeeld met iconen zoals dat bij de andere locaties is gedaan.

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 19: Aangepaste bevinding naar aanleiding van de hercontrole:
Op de homepagina https://www.tynaarlo.nl/staan onder de header vijf links zoals bijvoorbeeld 'Welzijn, wonen, zorg'. Bij toetsenbordfocus wijzigt de achtergrondkleur naar lichter groen (HEX #248F84). Het contrast met de witte linktekst is dan te laag, waardoor deze mogelijk niet meer goed te lezen is voor sommige bezoekers. De contrastverhouding is 3,9:1 waar deze minimaal 4,5:1 moet zijn. Ditzelfde komt voor op pagina https://www.tynaarlo.nl/sociaalteam, bijvoorbeeld bij 'Sport, gezondheid en welzijn'.

Bevinding 20: Op pagina https://ontdek.tynaarlo.nl staat in de legenda achter de items (bijvoorbeeld 'Dagcreatie') een cijfer ('7'). Omdat het contrast tussen het grijze (HEX #C8C4D2) cijfer en de witte achtergrond te laag is, is dit niet voor iedereen goed te lezen. De contrastverhouding is 1,7:1 waar dit minimaal 4,5:1 moet zijn.

Bevinding 21: Als op pagina https://ontdek.tynaarlo.nl/ de focus via het toetsenbord naar de kaart wordt gebracht, kan een locatie gekozen worden, bijvoorbeeld 'Camping 't Veenmeer'. Er opent zich dan een dialoogvenster waarop extra informatie over de locatie te zien is. Hierin doen zich contrastproblemen voor, waarbij de contrastverhouding minimaal 4,5:1 zou moeten zijn:

Bevinding 22: Op pagina https://ontdek.tynaarlo.nl/ wordt via de knop '+ Plek voorstellen' een dialoogvenster geopend waarin invoervelden staan. De velden 'Naam' en 'Omschrijving' bevatten grijsgekleurde (HEX #A69EB7) placeholdertekst (in browser Chrome), welke een contrastverhouding van 2,5:1 heeft met de witte achtergrond. In browser Firefox is de tekst lichter grijs (HEX #CDC9D7) en heeft een contrastverhouding van 1,6:1. Zorg dat de contrastverhouding overal minimaal 4,5:1 is.

Bevinding 23: Op pagina https://ontdek.tynaarlo.nl/ wordt via de knop '+ Plek voorstellen' een dialoogvenster geopend waarin invoervelden staan. Bij sommige invoervelden (bijvoorbeeld 'Omschrijving') staat de grijze (HEX #A29AB4) tekst 'Optioneel'. Deze heeft onvoldoende contrast met de lichtgrijze (HEX #F8F8F8B) achtergrond. De contrastverhouding is 2,5:1 waar deze minimaal 4,5:1 moet zijn.

Bevinding 24: Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y (Contactformulier, toegankelijke versie) staan twee keuzemogelijkheden, 'burger' en 'medewerker van een bedrijf of instelling'. De groene (HEX 00838F) tekstkleur heeft onvoldoende contrast met de lichtgroene (HEX #E6EFF0) achtergrond. De contrastverhouding is 3,8:1 waar deze minimaal 4,5:1 moet zijn. Deze kleurencombinatie komt ook voor op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij de volgende stappen, zoals bijvoorbeeld 'Samenvatting'.

Bevinding 25: Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y (Contactformulier, toegankelijke versie) verschijnt na het aanklikken van een antwoord op de vraag 'Ik vul dit formulier in als' een formulier. Als hierin een verplicht leeg gelaten wordt en het formulier wordt verzonden, verschijnt een foutmelding. Boven het formulier komt de tekst 'Er zijn fouten opgetreden. Zie onder voor de meldingen' te staan in een groen (HEX #00838F) lettertype op roze (HEX #DBD4D5) achtergrond. De contrastverhouding is hier 3,1:1 waar deze minimaal 4,5:1 moet zijn. Ditzelfde komt voor op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij de stap 'Aanvrager'.

Bevinding 26: Als pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij een schermgrootte van 1280 bij 1024 pixels wordt ingezoomd vanaf 200%, komt een deel van de links in de footer (bijvoorbeeld 'Archief website') op lichtgrijze (HEX #EDEDED) achtergrond te staan. De witte tekst heeft hiermee onvoldoende contrast. De contrastverhouding is 1,1:1 waar deze minimaal 4,5:1 moet zijn.

Bevinding 27: Als pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) op een kleiner scherm of in ingezoomde weergave wordt bekeken kan het menu uitgevouwen worden. Als de focus via het toetsenbord op de menu-items valt, is dat te zien doordat deze van kleur wijzigen. Doordat het contrast tussen de letters (HEX #128F9A) en de achtergrond (HEX #00838F) te laag is, is het betreffende menu-item bijna niet te lezen. De contrastverhouding is 1,1:1 waar deze minimaal 4,5:1 moet zijn.

Bevinding 28: Nieuwe bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/werkenbij komen links voor: 'Bekijk de (x aantal) vacatures'. Wanneer deze focus hebben kleurt de tekst blauw. Op de blauwe (HEX #3067C1) achtergrond onder 'Maak er werk van' heeft deze tekst een contrastratio van 4,1:1 waar dat minimaal 4,5:1 moet zijn.

Bevinding 29: In het PDF document https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf staat op elke pagina witte tekst in de footer. Deze tekst heeft onvoldoende contrast met de donkergele (HEX #B78E00) achtergrond. De contrastverhouding is 3:1 waar deze minimaal 4,5:1 moet zijn.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 30: Als onder andere de homepagina https://www.tynaarlo.nl/ wordt bekeken bij een schermgrootte van 1280 bij 1024 pixels en wordt ingezoomd vanaf 150%, is het menu samengevouwen onder een knop (hamburgermenu). Nadat deze wordt uitgevouwen zijn twee menu-items te zien, waaronder het item 'Onderwerpen'. In het menu dat bij normale weergave te zien is, is het mogelijk dit menu uit te vouwen. Binnen het hamburgermenu is dit echter zowel via het toetsenbord als met de muis niet mogelijk. Zorg dat het hamburgermenu dezelfde functionaliteit bevat als het menu bij normale weergave.

Bevinding 31: Op onder andere de homepagina staat in het menu de link 'English'. Deze link verdwijnt van de pagina als bij een schermgrootte van 1280 bij 1024 pixels wordt ingezoomd vanaf 150%. Zorg dat alle content op de pagina blijft staan bij inzoomen.

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 pagina https://www.tynaarlo.nl/afval/bladhekken hebben meerdere elementen die op de kaart staan een focusrand die door een te laag contrast voor sommige bezoekers nauwelijks zichtbaar is. Bijvoorbeeld de zoekknop. De focusrand is lichtblauw (HEX #D6E2ED) op een lichtgrijze (HEX #F5F5F5) achtergrond, de contrastverhouding is 1,2:1. De selectievakjes met label 'Bladbakken' en 'bladbak' hebben een blauwe (HEX #67A7DF) focusrand op witte achtergrond, de contrastverhouding is hier 2,5:1. Deze laatste contrastverhouding komt ook voor op dezelfde plek bij de selectievakjes en uitvouwbare knop. Zorg dat de contrastverhouding overal minimaal 3:1 is.

Aangepaste bevinding naar aanleiding van de hercontrole:

Op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding komen in de kaart verschillende contrastproblemen voor. Zorg ervoor dat de contrastverhouding overal minimaal 3:1 is. Een aantal voorbeelden:

Bevinding 33: Op pagina https://ontdek.tynaarlo.nl staat een zoekveld waarbij de zoekknop te herkennen is aan een icoon van een grijs (HEX #A29AB4) vergrootglas. Doordat deze te weinig contrast heeft met de witte achtergrond is de knop voor sommige bezoekers slecht te zien. De contrastverhouding is 2,6:1 waar deze minimaal 3:1 moet zijn.

Bevinding 34: Op pagina https://ontdek.tynaarlo.nl staan in de legenda bij de verschillende items iconen waarop een symbool te zien is. Op de kaart komen deze iconen weer terug. Aan het symbool is voor de bezoeker te herkennen om welk item het gaat. Omdat de kleur van het witte symbool bij sommige iconen onvoldoende contrast heeft met de achtergrondkleur, is voor sommige bezoekers mogelijk lastig af te leiden om welk item het gaat. Zorg ervoor dat de contrastverhouding overal minimaal 3:1 is. Een aantal voorbeelden zijn:

Bevinding 35: Als pagina https://ontdek.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken, is de focusrand van de zoekknop grijs (HEX C6C1D1) en heeft deze onvoldoende contrast met de witte achtergrond. De contrastverhouding is 1,7:1 waar deze minimaal 3:1 moet zijn.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 36: Op pagina https://www.tynaarlo.nl/afval/bladhekken staat een kaart waarop via de muis kan worden ingezoomd, uitgezoomd en de kaart kan worden verplaatst. Deze functionaliteit is niet beschikbaar via het toetsenbord. Zorg dat de knoppen die hiertoe dienen focusbaar zijn en kunnen worden bediend via het toetsenbord, en geef de knoppen een beschrijvende naam. Een soortgelijk probleem komt voor bij de kaart op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.

Bevinding 37: Aangepaste bevinding naar aanleiding van de hercontrole:
Op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding staat een kaart. Meerdere opties in deze kaart zijn niet bereikbaar en bedienbaar met het toetsenbord, waaronder het selecteren van een weg en het openen van de informatie. Zorg ervoor dat de informatie in de kaart ook op een alternatieve manier beschikbaar is, bijvoorbeeld door de informatie ook in een uitklapbare lijst aan te bieden op de pagina. Een soortgelijk probleem komt voor op alle pagina's waar deze functionaliteit voorkomt.

Bevinding 38: Als pagina https://ontdek.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken, is een menuknop (hamburgermenu) te zien. Deze is via het toetsenbord lastig te vinden en te bedienen. De knop is opgemaakt als link met role="button", maar een href en functionaliteit ontbreekt. Zorg dat het element goed wordt opgemaakt, zodat de focus naar de menuknop gebracht kan worden en het menu vervolgens geopend kan worden.

Bevinding 39: Als op pagina https://ontdek.tynaarlo.nl/ de focus via het toetsenbord naar de kaart wordt gebracht, kan een locatie gekozen worden. Er opent zich dan een dialoogvenster waarop extra informatie over de locatie te zien is. Bijvoorbeeld 'Camping 't Veenmeer'. Bovenaan kan naar een volgende of vorige pagina gebladerd worden via knoppen die te herkennen zijn aan witte driehoekjes. Doordat deze niet als knoppen zijn opgemaakt, is voor hulpsoftware niet goed te herkennen wat de rol en functionaliteit van deze elementen is. Ook is het hierdoor niet mogelijk de focus hier naartoe te brengen. Dit maakt dat deze elementen moeilijk te vinden en te bedienen zijn via het toetsenbord. Los dit bijvoorbeeld op door deze in HTML met het button-element op te maken.

Bevinding 40: Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y (Contactformulier, toegankelijke versie) verschijnt na het aanklikken van een antwoord op de vraag 'Ik vul dit formulier in als' een formulier. In dit formulier moet de vraag 'Geslacht' beantwoord worden door een keuzerondje te selecteren. Voor bezoekers die navigeren via het toetsenbord is het lastig om de keuzerondjes te bereiken, omdat de focus hier niet naartoe gebracht kan worden. Zorg dat de focus via het toetsenbord naar het eerste keuzerondje gebracht kan worden, en dat met de pijltjestoets tussen de keuzerondjes genavigeerd kan worden.

Bevinding 41: Pagina https://afspraken.tynaarlo.nl/Afspraken (formulier Afspraak maken) bevat een afbeelding met het logo, deze staat in een link naar de homepagina. Op deze link staat het attribuut tabindex="-1", waardoor het niet mogelijk is om de focus naar deze link te brengen. Voor bezoekers die navigeren via het toetsenbord kan het hierdoor lastig zijn om deze link te vinden. Los dit op door tabindex="-1" te verwijderen.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 42: Het PDF document /https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf heeft geen documenttitel in de eigenschappen. Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond. Dit geldt ook voor de PDF op pagina https://www.tynaarlo.nl/sites/default/files/documents/route_ro.pdf.

Bevinding 43: Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/2024-04-22_-_aantekeningen_interne_stuurgroep_geanonimiseerd_0.pdf heeft als paginatitel 'Untitled'. Uit deze titel kan de bezoeker niet afleiden om welk document het gaat. Ook wordt de bestandsnaam getoond in plaats van de documenttitel. Los dit op door de titel aan te passen en te zorgen dat niet de bestandsnaam maar de titel van het document wordt getoond.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 44: Als op onder andere de homepagina het menu-item 'Onderwerpen' wordt uitgevouwen via het toetsenbord, verschijnt een lijst met links. Als een bezoeker via de tab-toets voorwaarts navigeert, is het mogelijk om de lijst te verlaten zonder dat deze wordt ingevouwen. Het is dan niet te zien waar de focus zich bevindt, omdat de onderliggende pagina door het opengevouwen menu-item wordt bedekt. De invouwbare menuknop 'Onderwerpen' is alleen terug te vinden door de hele pagina door te tabben, of door achteruit te navigeren. Los dit op door te zorgen dat het menu niet verlaten kan worden voordat deze weer is ingevouwen. Een soortgelijk probleem komt voor bij het uitgevouwen hamburgermenu dat te vinden is als de pagina op een kleiner scherm of in ingezoomde weergave wordt bekeken.

Bevinding 45: Als op pagina https://ontdek.tynaarlo.nl/ de focus via het toetsenbord naar de kaart wordt gebracht, kan een locatie gekozen worden. Er opent zich dan een dialoogvenster waarop extra informatie over de locatie te zien is. Een bezoeker die navigeert via het toetsenbord moet om bij deze informatie te komen eerst door alle andere focusbare elementen van de kaart heen, voordat de focus naar het dialoogvenster gaat. Zorg ervoor dat de focus na het openen van een locatie als eerste naar de extra informatie over deze locatie gaat.

Bevinding 46: Als op pagina https://ontdek.tynaarlo.nl/ de focus via het toetsenbord naar de kaart wordt gebracht, kan een locatie gekozen worden. Er opent zich dan een dialoogvenster waarop extra informatie over de locatie te zien is. Het is mogelijk om via de tabtoets uit het venster te gaan, de focus gaat dan langs onderliggende elementen op de pagina en het is niet te zien waar deze zich bevindt. Zorg ervoor dat de focus het venster pas kan verlaten nadat deze is afgesloten.

Bevinding 47: Als op pagina https://ontdek.tynaarlo.nl/ op de knop 'Mijn locatie' wordt gedrukt terwijl de eigen locatie niet beschikbaar is, verschijnt het dialoogvenster 'Je locatie is niet beschikbaar'. Het bericht dat te zien is wordt wel meteen voorgelezen, maar als via het toetsenbord de focus verplaatst wordt gaat deze eerst langs de knop 'Plek voorstellen' voordat deze naar het dialoogvenster gaat en deze afgesloten kan worden. Ook is het mogelijk om via de tabtoets uit het dialoogvenster te gaan, de focus gaat dan langs onderliggende elementen op de pagina en het is niet te zien waar deze zich bevindt. Ook komt de focus niet op een logische plek terecht als het dialoogvenster via de knop 'Terug naar de kaart' wordt afgesloten. Los dit op door te zorgen dat de focus naar het dialoogvenster gaat nadat deze is geopend, dat dit venster pas verlaten kan worden nadat deze is afgesloten, en dat de focus dan terecht komt op de plek waar het dialoogvenster was geopend (de knop 'Mijn locatie').

Bevinding 48: Als pagina https://ontdek.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken, is het voor een bezoeker die navigeert via het toetsenbord lastig om te weten waar de focus zich bevindt. Dit komt doordat de focus langs alle items van de navigatie (legenda) gaat, terwijl deze niet zichtbaar zijn op de pagina zolang de menuknop niet is uitgevouwen. Zorg dat de focus eerst op de menuknop komt (zie hiervoor succescriterium 2.1.1) en alleen langs focusbare items gaat die zichtbaar zijn op de pagina.

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 49: Aangepaste bevinding naar aanleiding van de hercontrole:
Pagina https://www.tynaarlo.nl/english bevat Engelstalige content. Doordat de taal van de pagina is ingesteld op Nederlands, kan hulpsoftware zoals een screenreader de tekst niet met de juiste uitspraak voorlezen. Ook worden bijvoorbeeld cijfers in het Nederlands voorgelezen. Dit maakt de tekst lastig te begrijpen voor Engelstalige bezoekers die dit voorgelezen krijgen. Los dit op door de taalcode aan te passen naar 'lang="en"'. Let hierbij op dat de tekst in het menu en in de footer Nederlandstalig zijn, voor Engelstalige bezoekers is het beter als deze tekst op deze pagina naar het Engels vertaald wordt. Een soortgelijk probleem doet zich voor op pagina https://www.tynaarlo.nl/export-ponys-und-pferde, waar de taal van de pagina Duits is en de taalcode naar 'lang="de"' gewijzigd moet worden. Een andere optie is om voor de inhoud van het artikel een taalwissel aan te geven, bijvoorbeeld door de inhoud in een span-element te plaatsen en dáár het lang-attribuut met de juiste taalcode op te plaatsen.

Bevinding 50: Nieuwe bevinding naar aanleiding van de hercontrole:
De PDF op pagina https://www.tynaarlo.nl/sites/default/files/documents/route_ro.pdf heeft geen ingestelde taal. Hierdoor wordt de inhoud mogelijk verkeerd voorgelezen, afhankelijk van de gekozen taal van bijvoorbeeld voorleessoftware. Zorg er daarom voor dat er een taal ingesteld is, zodat de voorleessoftware in deze taal kan voorlezen.

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 51: Op pagina https://www.tynaarlo.nl/afval/bladhekken staat een kaart waarop de knop 'Collapse panel/Expand panel' staat. Deze tekst beschrijft wat de functionaliteit van de knop is, maar niet in de juiste taal. Wijzig de tekst naar een Nederlandse tekst. Een soortgelijk probleem komt voor bij de kaart op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.

3.2 Voorspelbaar

3.2.2 Bij input (Niveau A)

Informatie over succescriterium 3.2.2 Bij input

Uitkomst: Onvoldoende

Bevinding 52: Op pagina https://ontdek.tynaarlo.nl/ kan de bezoeker selecteren welke locaties op de kaart getoond worden, door deze in de legenda aan te klikken. De items zijn opgemaakt als selectievakjes en deze staan standaard allemaal aangevinkt als de bezoeker op deze pagina komt. Als een bezoeker die niet kan zien en de focus verplaatst naar bijvoorbeeld het item 'Dagrecreatie', leest hulpsoftware zoals een screenreader voor dat deze aangevinkt is. Hierdoor verwacht de bezoeker dat het drukken op dit selectievakje zal veroorzaken dat deze uitgevinkt wordt. Dit is echter niet zo, visueel is af te leiden dat door op een item te drukken alle selectievakjes behalve het selectievakje waarop gedrukt is, worden uitgevinkt en hiermee van de kaart verwijderd worden. Een bezoeker die niet kan zien, weet niet welke actie via het selectievakje veroorzaakt wordt. Zorg dat de functionaliteit voorspelbaar is, zodat van tevoren bekend is wat er gebeurt.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 53: Op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y (Contactformulier, toegankelijke versie) verschijnt na het aanklikken van een antwoord op de vraag 'Ik vul dit formulier in als' een formulier. Als hierin een verplicht leeg gelaten wordt en het formulier wordt verzonden, verschijnt een foutmelding. Boven het formulier komt de tekst 'Er zijn fouten opgetreden. Zie onder voor de meldingen', en bij het betreffende veld komt de tekst 'Fout: Dit veld is verplicht en moet ingevuld worden'. Deze tekst biedt een goede suggestie voor het oplossen van de fout, maar maakt onvoldoende duidelijk wat er mis is gegaan. Vul de tekst aan om dit op te lossen, bijvoorbeeld met de tekst 'Het veld 'e-mailadres is niet ingevuld', zodat bezoekers weten welke fout zij hebben gemaakt. Ditzelfde komt voor op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij de stap 'Aanvrager'.

3.3.2 Labels of instructies (Niveau A)

Informatie over succescriterium 3.3.2 Labels of instructies

Uitkomst: Onvoldoende

Bevinding 54: Op pagina https://ontdek.tynaarlo.nl/ verschijnt na het klikken op de knop '+ Plek voorstellen' een dialoogvenster met invoervelden. Het veld 'Naam' bevat als placeholdertekst de aanvullende instructie 'Wat is de naam van de locatie?' Zonder deze instructie is het mogelijk onduidelijk welke naam hier ingevoerd moet worden. De placeholdertekst is niet voor iedereen altijd leesbaar, doordat deze onvoldoende contrast heeft en verdwijnt als de bezoeker begint te typen. Zorg er daarom voor dat de tekst goed en blijvend zichtbaar is, door deze als zichtbaar label buiten het veld toe te voegen. Een soortgelijk probleem komt voor bij het veld 'Omschrijving'.

3.3.3 Foutsuggestie (Niveau AA)

Informatie over succescriterium 3.3.3 Foutsuggestie

Uitkomst: Onvoldoende

Bevinding 55: Op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx (formulier Nieuwsbrief) staat een formulier. Als in het verplichte veld 'E-mailadres *' een onjuist e-mailadres wordt ingevuld en het formulier wordt verzonden, verschijnt boven het formulier de melding 'Nog niet alles is in orde'. Bij het betreffende formulierveld komt de melding 'Dit is geen geldig e-mailadres (E-mailadres)' te staan. De teksten van deze meldingen geven onvoldoende suggestie voor hoe de bezoeker de fout kan oplossen. Vul de tekst aan, bijvoorbeeld 'Vul een correct e-mailadres in' en noem eventueel een voorbeeld e-mailadres.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Uitkomst: Onvoldoende

Bevinding 56: Op pagina https://www.tynaarlo.nl/zoekresultaten?zoekwoord=zuidlaardermarkt staat onder de kop 'Zoekresultaten' een zoekfunctie met twee keuzevakjes ('Pagina's' en 'Bestanden'). Visueel is af te leiden dat hier keuzevakjes staan en of deze geselecteerd zijn, omdat hierin dan een vinkje te zien is. Hulpsoftware zoals een screenreader leest dit echter niet voor, waardoor voor bezoekers die niet kunnen zien niet duidelijk is welke functionaliteit hier te vinden is. Het input-element is via CSS onzichtbaar gemaakt voor hulpsofware, waardoor alleen het label voorgelezen wordt. Zorg dat voor hulpsoftware ook de rol (keuzevakje) en de staat (aangevinkt of uitgevinkt) van dit element kan worden voorgelezen.

Bevinding 57: Op pagina https://www.tynaarlo.nl/evenementen kan de bezoeker onder de kop 'Evenementenkalender' een datum opzoeken. Naast 'Juni 2024' staat een uitvouwbare knop waarmee een maand geselecteerd kan worden. Via 'aria-expanded' en 'aria-labelledby' zou de staat (ingevouwen of uitgevouwen) en de naam ('Kies een maand') van de knop voorgelezen moeten worden, maar doordat deze attributen op het verkeerde element zijn geplaatst gaat dit niet goed. Los dit op door deze attributen te verplaatsen naar het button-element.

Bevinding 58: Op pagina https://www.tynaarlo.nl/afval/bladhekken staat een kaart waarop een zoekknop (vergrootglas) staat. Deze knop heeft geen naam, waardoor voor bezoekers die niet kunnen zien niet af te leiden is wat de functionaliteit van de knop is. Geef de knop een naam, bijvoorbeeld 'Zoek'.

Bevinding 59: Op pagina https://www.tynaarlo.nl/afval/bladhekken staan in de kaart in het tabblad 'Lagen' focusbare elementen (selectievakjes 'Bladbakken' en 'Bladbak') genest in elementen die voor hulpsoftware zijn verborgen met role="presentation" en 'aria-hidden="true"'. Hierdoor zijn deze elementen lastig te vinden en te bedienen via het toetsenbord, de labels en functionaliteit kunnen door hulpsoftware niet worden herkend en voorgelezen. Zorg dat elementen die voor hulpsoftware zijn verborgen, geen focusbare elementen bevatten.

Bevinding 60: Het formulier op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx (formulier Nieuwsbrief) bevat een invoerveld dat visueel niet zichtbaar is op de pagina. Met het tabindex="-1" is ervoor gezorgd dat dit veld ook niet focusbaar is. Toch komen bezoekers die via het toetsenbord met de pijltjestoetsen over de pagina navigeren dit veld tegen. Omdat het gaat om een invoerveld dat geen functie heeft en niet zichtbaar is op de pagina, kan dit het beste opgelost worden door het te verwijderen.

Bevinding 61: Nieuwe bevinding naar aanleiding van de hercontrole:
Als pagina https://ontdek.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken, is er een menuknop (hamburgermenu) te zien. Deze knop had eerder de naam 'Open navigation', maar nu heeft de knop géén toegankelijke naam. Zorg ervoor dat interactieve items een naam en rol hebben.

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-02-05 10:48:37 v2.4-011