Rapport:
Audit digitale toegankelijkheid website Gemeente Tynaarlo
- Onderzoeker
- Mirjam, Swink; Sophie, Swink
- Datum
- 27 juni 2024
- Opdrachtgever
- Gemeente Tynaarlo
Samenvatting onderzoeksresultaat
De website Gemeente Tynaarlo voldoet nog niet aan WCAG 2.1 niveau AA. Er zijn 23 van de 50 succescriteria waar één of meer fouten zijn gevonden. In dit document is vastgelegd in hoeverre de website voldoet aan de toegankelijkheidseisen die vastgelegd zijn in WCAG, de Web Content Accessibility Guidelines.
De website tynaarlo.nl is onderzocht tussen 5 juni en 25 juni 2024. Het onderzoek is uitgevoerd aan de hand van de evaluatiemethode WCAG-EM. Doel van dit rapport is om de vervolgstappen te bepalen om tot een toegankelijke website te komen.
De meest opvallende bevindingen uit dit onderzoek zijn:
- Verschillende afbeeldingen hebben geen (goed beschrijvende) alternatieve tekst. Hierdoor is de informatie die op deze afbeeldingen staat niet beschikbaar voor sommige bezoekers.
- Op meerdere pagina's kan het voor bezoekers die gebruik maken van hulpsoftware lastig zijn om de structuur van de informatie op de pagina te bepalen, bijvoorbeeld doordat labels niet goed aan invoervelden zijn gekoppeld, en de koppenstructuur niet overal helemaal correct is.
- Er zijn meerdere teksten en elementen gevonden die te weinig contrast hebben. Hierdoor zijn deze mogelijk lastig te zien voor mensen die slecht zicht hebben of kleurenblind zijn.
Het onderzoek richt zich specifiek op de toegankelijkheid van de website voor mensen met een functiebeperking, zoals mensen die blind, doof, laaggeletterd zijn of andere functieproblemen hebben. Voor hen is het van belang dat de website technisch en inhoudelijk zo is ingericht dat de site voor hen goed bruikbaar is. Een website optimaliseren voor toegankelijkheid heeft meer voordelen; het maakt de website beter bruikbaar voor iedereen (bijvoorbeeld ook voor mensen die op hun mobieltje kijken in een zonnige omgeving) en het maakt de site beter vindbaar in zoekmachines.
Scope van de evaluatie
Naam website | Gemeente Tynaarlo |
---|---|
Scope van de website |
Binnen de scope van het onderzoek valt:
|
Conformiteitsdoel | WCAG 2.1 niveau AA |
Basisniveau van toegankelijkheid ondersteund | Gangbare browsers en hulpsoftware. |
Overzicht toetsresultaat
Principe | Voldoende | Onvoldoende | Onbekend |
---|---|---|---|
1 Waarneembaar | 9 | 11 | 0 |
2 Bedienbaar | 12 | 5 | 0 |
3 Begrijpelijk | 4 | 6 | 0 |
4 Robuust | 2 | 1 | 0 |
Totaal | 27 | 23 | 0 |
Leeswijzer
Dit onderzoek is een momentopname. De website kan inmiddels veranderd zijn. De gevonden problemen zijn slechts voorbeelden. Ga daarom bij elk probleem de gehele website na of dit ook op andere plaatsen voorkomt. Dit onderzoek is slechts een steekproef van een aantal pagina's. Er zijn zo veel mogelijk verschillende type pagina's opgenomen in de sample om zo een goede indruk te krijgen van de toegankelijkheid. Let op! Bij het aanbrengen van verbeteringen of wijzigingen op de website/app kunnen nieuwe problemen ontstaan. Succescriteria gemarkeerd met "Niet aanwezig" worden automatisch goedgekeurd. Succescriteria gemarkeerd met "Onbekend" worden niet goedgekeurd.
Uitgebreide toetsresultaten
1. Waarneembaar
1.1 Tekstalternatieven
1.1.1 Niet-tekstuele content (Niveau A)
Alle niet-tekstuele content die aan de gebruiker wordt gepresenteerd, heeft een tekstalternatief dat een gelijkwaardig doel dient, behalve voor de hierna vermelde situaties.
- Bedieningselementen, invoer: Als niet-tekstuele content een bedieningselement is of gebruikersinvoer accepteert, dan heeft ze een naam die het doel ervan beschrijft. (We verwijzen naar succescriterium 4.1.2 voor aanvullende eisen over bedieningselementen en content die gebruikersinvoer accepteren.)
- Op tijd gebaseerde media: Als niet-tekstuele content op tijd gebaseerde media is, dan leveren tekstalternatieven ten minste een beschrijving van de niet-tekstuele content. (We verwijzen naar Richtlijn 1.2 voor aanvullende eisen ten aanzien van media.)
- Test: Als niet-tekstuele content een test of oefening is die, als ze door middel van tekst gepresenteerd wordt onjuist zou zijn, dan leveren tekstalternatieven ten minste een beschrijving van de niet-tekstuele content.
- Zintuiglijk: Als niet-tekstuele content primair is bedoeld om een specifieke zintuiglijke ervaring te creëren, dan leveren tekstalternatieven ten minste een beschrijving van de niet-tekstuele content.
- CAPTCHA: Als het doel van niet-tekstuele content is om te bevestigen dat content wordt gebruikt door een persoon in plaats van een computer, dan worden tekstalternatieven geleverd die het doel van de niet-tekstuele content identificeren en beschrijven. En er worden alternatieve vormen van CAPTCHA aangeboden gebruikmakend van uitvoermodes voor verschillende soorten van zintuiglijke perceptie om tegemoet te komen aan verschillende functiebeperkingen.
- Decoratie, opmaak, onzichtbaar: Als niet-tekstuele content puur decoratief is, slechts voor visuele opmaak wordt gebruikt, of niet aan gebruikers wordt gerepresenteerd, dan wordt het op zo'n manier geïmplementeerd dat het genegeerd kan worden door hulptechnologie.
Informatie over succescriterium 1.1.1 Niet-tekstuele content
Uitkomst: Onvoldoende
Bevindingen: Op onder andere de homepagina https://www.tynaarlo.nl/ staat het logo in een link naar de homepagina. De afbeelding met het logo heeft een correcte alternatieve tekst, 'Logo Gemeente Tynaarlo'. Maar dit wordt overschreven door het aria-label dat op de link staat. Daardoor is voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader alleen de tekst 'Naar de homepage' te horen en missen zij welk logo hier staat. Los dit op door deze informatie aan het aria-label toe te voegen, of door het aria-label te verwijderen en informatie over het linkdoel toe te voegen in het alt-attribuut van de afbeelding.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet staat onder de kop 'Video met uitleg over het nieuwe stembiljet' een video. Bezoekers die gebruik maken van hulpsoftware zoals een screenreader komen boven het video-element de tekst 'Filmbestand' tegen. Dit beschrijft de video onvoldoende. Vervang de tekst door een tekst die beschrijft welk filmbestand zich hier bevindt.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers is in de header een afbeelding te zien met het logo van het COA. Deze heeft als alternatieve tekst 'Website banner opvang asielzoekers'. Dit beschrijft de afbeelding onvoldoende. Het is belangrijk om te beschrijven dat hier een logo te zien is en van welke organisatie deze is. Ook aanvullende tekst die te zien is moet terugkomen in de alternatieve tekst. Wijzig de tekst in het alt-attribuut, bijvoorbeeld naar 'Logo COA, Centraal Orgaan opvang asielzoekers'.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers/documenten-wva zijn onder de uitvouwbare kop 'Voorlopige schets en kaart Woonplan Vries' twee afbeeldingen te vinden waarop informatie overgebracht wordt via een kaart. De afbeeldingen hebben een alternatieve tekst die beschrijft welke kaart te zien is, maar hieruit kan een bezoeker die niet kan zien niet alle informatie halen die visueel overgebracht wordt. Deze informatie is waarschijnlijk te veel om als alternatieve tekst toe te voegen, daarom kan deze beter op andere wijze toegankelijk overgebracht worden. Bijvoorbeeld door in gewone tekst een beschrijving toe te voegen waaruit duidelijk wordt om welke locatie het gaat en hoe het woonproject eruit ziet.
Op meerdere pagina's, bijvoorbeeld https://www.tynaarlo.nl/afval-en-milieu/afvalinzameling, staat voor sommige links een icoon (vierkant met pijl die naar rechtsboven wijst) dat visueel overbrengt dat de link waar deze in staat naar een externe website leidt. De iconen zijn voor hulpsoftware verborgen. Bij sommige links is dat correct, deze iconen kunnen als decoratief gezien worden als uit de linktekst kan worden begrepen dat het om een andere website gaat (bijvoorbeeld bij de link 'Meteen naar de afvalkalender op Mijnafvalwijzer.nl'). Waar deze URL niet in de linktekst genoemd wordt is het icoon wel de enige manier om meteen te begrijpen dat het een externe website is, en is deze informatie niet beschikbaar voor bezoekers die niet kunnen zien. Het is beter om hier consistent in te zijn en op plekken waar dit icoon staat een tekst zoals 'Externe website' toe te voegen.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads staat in de header een afbeelding van het logo of de leus 'Samen Werken Zuidlaren'. Deze is middels een leeg alt-attribuut verborgen voor hulpsofware. Daardoor is voor bezoekers die niet kunnen zien niet af te leiden welke tekst het logo of de leus bevat. De afbeelding is niet puur decoratief en heeft daarom een alternatieve tekst nodig. Los dit bijvoorbeeld op door deze toe te voegen in het alt-attribuut.
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 mag als deze als decoratief gezien wordt worden verborgen voor hulpsoftware middels een leeg alt-attribuut, maar mag ook een alternatieve tekst krijgen die beschrijft wat op de afbeelding te zien is.
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. Dit komt ook voor bij de svg-afbeeldingen op de kaart op pagina https://www.tynaarlo.nl/afval-en-milieu/bladhekken en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/bladhekken staat een iframe waarin een kaart te zien is. Het iframe heeft een naam die bestaat uit een URL. Dit beschrijft onvoldoende welke content in het iframe te zien is. Los dit op door de tekst van het title-element van het iframe aan te passen. Een soortgelijk probleem komt voor bij het iframe van de kaart op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/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.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/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.
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'.
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.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) (Niveau A)
Voor media met vooraf opgenomen louter-geluid en vooraf opgenomen louter-videobeeld is het volgende waar, behalve als de audio of video een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld:
- Vooraf opgenomen louter-geluid: Er wordt een alternatief geleverd voor op tijd gebaseerde media dat equivalente informatie geeft voor vooraf opgenomen louter-geluid content.
- Vooraf opgenomen louter-videobeeld: Er wordt een alternatief geleverd voor op tijd gebaseerde media of een geluidsspoor dat equivalente informatie geeft voor vooraf opgenomen louter-videobeeld content.
Informatie over succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen)
Uitkomst: Niet aanwezig
1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)
Er worden ondertitels voor doven en slechthorenden geleverd voor alle vooraf opgenomen audiocontent in gesynchroniseerde media, behalve als het mediabestand een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld.
Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)
Uitkomst: Voldoende
1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)
Er wordt een alternatief geleverd voor op tijd gebaseerde media of audiodescriptie van de vooraf opgenomen videocontent geleverd voor gesynchroniseerde media, behalve als het mediabestand een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld.
Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet is er in de video onder de kop 'Video met uitleg over het nieuwe stembiljet' op verschillende plaatsen tekst in beeld, bijvoorbeeld in de eerste en de laatste seconden. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Daardoor kunnen bezoekers die niet kunnen zien niet weten wat er wordt getoond in de video. Zet deze informatie in een transcript om te voldoen aan dit succes criterium. Of maak gebruik van een extra audiospoor om ook te voldoen aan succescriterium 1.2.5.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers staat de video 'Uitleg over Woonvorm Voor Asielzoekers..'. In deze video komen vragen en stellingen in beeld, waarop in gesproken vorm gereageerd wordt. Doordat uitgeschreven tekst en audiodescriptie ontbreekt is voor bezoekers die niet kunnen zien niet af te leiden op elke vraag of stelling gereageerd wordt. Ook komt de naam en functie van de spreker in beeld op tijdstip 0:05 en 1:27, deze wordt niet uitgesproken. Zet deze informatie in een transcript om te voldoen aan dit succes criterium. Of maak gebruik van een extra audiospoor om ook te voldoen aan succescriterium 1.2.5.
1.2.4 Ondertitels voor doven en slechthorenden (live) (Niveau AA)
Er worden ondertitels voor doven en slechthorenden geleverd voor alle live audiocontent in gesynchroniseerde media.
Informatie over succescriterium 1.2.4 Ondertitels voor doven en slechthorenden (live)
Uitkomst: Niet aanwezig
1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)
Er wordt een audiodescriptie geleverd voor alle vooraf opgenomen videocontent in gesynchroniseerde media.
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet is er in de video onder de kop 'Video met uitleg over het nieuwe stembiljet' in de eerste en laatste seconden tekst in beeld te zien. Bij deze video ontbreekt audiodescriptie, waardoor deze informatie niet beschikbaar is voor bezoekers die niet kunnen zien. Audiodescriptie is een (extra) audiospoor waarin verteld wordt wat er in beeld te zien is. Voeg een extra audiospoor toe waarin audiodescriptie te horen is.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers staat de video 'Uitleg over Woonvorm Voor Asielzoekers..'. In deze video komen vragen en stellingen in beeld, waarop in gesproken vorm gereageerd wordt. Doordat uitgeschreven tekst en audiodescriptie ontbreekt is voor bezoekers die niet kunnen zien niet af te leiden op elke vraag of stelling gereageerd wordt. Ook komt de naam en functie van de spreker in beeld op tijdstip 0:05 en 1:27, deze wordt niet uitgesproken. Maak de informatie beschikbaar door een extra audiospoor toe te voegen waarin audiodescriptie te horen is.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie, structuur en relaties overgebracht door presentatie kunnen door software bepaald worden of zijn beschikbaar in tekst.
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevindingen: Op onder andere de homepagina https://www.tynaarlo.nl/ zijn in de footer de contactgegevens verdeeld onder verschillende visuele koppen, bijvoorbeeld 'Bezoekadres'. Deze koppen zijn opgemaakt met het strong-element, waardoor ze visueel als kop herkenbaar zijn. Voor hulpsoftware is deze tekst echter niet als kop te herkennen. Los dit op door de opmaak aan te passen en het juiste kopniveau te kiezen (bijvoorbeeld h3). Ook op andere plekken komt een soortgelijk probleem voor, bijvoorbeeld op pagina https://www.tynaarlo.nl/afval-en-milieu/afvalinzameling onder de uitvouwbare knop 'Afval bij chronische ziekte' waar de visuele kop 'Aanvraag' te zien is.
Op de homepagina https://www.tynaarlo.nl/ staat in de header de visueel verborgen h2-kop 'Kruimelpad'. Op deze pagina is geen kruimelpad te vinden, en wordt de kop zonder content opgevolgd door de eveneens visueel verborgen h1-kop 'Home'. Het doel van een kop is het beschrijven van bijbehorende content, voor bezoekers die navigeren aan de hand van de koppenstructuur is het daarom belangrijk dat er geen koppen zonder content voor komen. Los dit op door de h2-kop 'Kruimelpad' te verwijderen.
Op pagina https://www.tynaarlo.nl/english is de kop 'Change of address' opgemaakt op kopniveau h3, en de subkoppen die te zien zijn als de kop wordt uitgevouwen zijn opgemaakt op kopniveau h2. Dit kan onduidelijkheid geven over de structuur van de tekst. Los dit op door de kop 'Change of address' op te maken op kopniveau h2, en de subkoppen op kopniveau h3. Ditzelfde doet zich voor bij de kop 'Waste', let hierbij ook op het kopniveau van de sub-subkoppen. Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-deutsch doet zich een soortgelijk probleem voor in de koppenstructuur (bijvoorbeeld bij 'Informationen für Händler').
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'.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers staat onder de video de visueel verborgen kop 'Underlying tasks'. Deze kop bevat geen content, en lijkt ook geen verband te hebben met de content op deze pagina. Los dit op door deze kop te verwijderen. Dezelfde kop komt voor op pagina https://www.tynaarlo.nl/duurzaamheid.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-english is na het uitvouwen van 'List of attractions' een tabel te zien. Visueel zijn hier twee koppen in te zien, maar deze zijn met het strong-element opgemaakt en niet als tabelkoppen. Ook zijn deze niet aan de datacellen gekoppeld. Bezoekers die de tabel voorgelezen krijgen door hulpsoftware zoals een screenreader, weten daardoor niet wat de relatie is tussen de kopcellen en de datacellen. Gebruik het th-element om de koppen op te maken, en plaats hierin het scope-attribuut om de kopcellen met de datacellen te associëren.
Op pagina https://www.tynaarlo.nl/bestuur-en-organisatie/adviesraden/adviesraad-sociaal-domein staat een afbeelding waaronder een bijschrift te zien is. Dit bijschrift is niet programmatisch gekoppeld aan de afbeelding, waardoor de relatie tussen deze elementen voor hulpsoftware niet herkenbaar is. Los dit bijvoorbeeld op door het bijschrift in een figcaption-element te plaatsen en deze samen met het img-element te nesten in een figure-element.
Op pagina https://www.tynaarlo.nl/zoekresultaten?zoekwoord=zuidlaardermarkt staat onder de zoekresultaten een paginering. Deze is opgemaakt als lijst waarin de lijst-items links naar andere pagina's bevatten. In deze lijst komt een item voor dat door het attribuut 'role="presentation"' niet als lijst-item wordt herkend door hulpsoftware zoals een screenreader. In content van dit item, '...', maakt duidelijk dat er meer dan 9 pagina's bestaan, deze informatie is niet beschikbaar voor bezoekers die niet kunnen zien. Een lijst (ol of ul) mag geen andere items bevatten dan lijst-items (li), omdat role="presentation" zorgt dat het lijst-item niet langer de rol van lijst-item heeft geldt dit ook voor dit item. Los dit op door role="presentation" te verwijderen en eventueel een textueel alternatief toe te voegen dat door hulpsoftware kan worden voorgelezen.
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.
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'.
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.
Het PDF document https://www.tynaarlo.nl/sites/default/files/documents/adapted_export_regulations_at_elst_zuidlaren_and_hedel_horse_markets_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 visueel herkenbare koppen zijn niet als zodanig herkenbaar voor hulpsoftware, doordat deze een p-tag hebben in plaats van een h-tag (bijvoorbeeld h1). Ook staat er onder 'How are horse markets affected' een lijst met vier items, maar hierbij zijn alle items als aparte lijsten opgemaakt. Los dit op door hier één lijst met vier lijst-items van te maken.
1.3.2 Betekenisvolle volgorde (Niveau A)
Als de volgorde waarin content wordt gepresenteerd van invloed is op zijn betekenis, kan een correcte leesvolgorde door software bepaald worden.
Informatie over succescriterium 1.3.2 Betekenisvolle volgorde
Uitkomst: Onvoldoende
Bevindingen: 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.3.3 Zintuiglijke eigenschappen (Niveau A)
Instructies die geleverd worden om content te begrijpen en te bedienen zijn niet alleen afhankelijk van zintuiglijke eigenschappen van componenten zoals vorm, kleur, omvang, visuele locatie, oriëntatie of geluid.
Informatie over succescriterium 1.3.3 Zintuiglijke eigenschappen
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/ik-heb-een-idee wordt in de introductietekst uitgelegd waar de bezoeker een idee kan delen. Hierbij wordt beschreven wat de locatie op de pagina is waar de bezoeker dit kan doen. Voor bezoekers die niet kunnen zien is dit hierdoor mogelijk niet te vinden. Gebruik niet alleen zintuigelijke eigenschappen om te beschrijven waar iets te vinden is op de pagina.
1.3.4 Weergavestand (Niveau AA)
De content beperkt de weergave en bediening niet tot een enkele presentatie-oriëntatie, zoals staand of liggend, tenzij een specifieke presentatie-oriëntatie essentieel is.
Informatie over succescriterium 1.3.4 Weergavestand
Uitkomst: Voldoende
1.3.5 Identificeer het doel van de input (Niveau AA)
Het doel van elk invoerveld waarmee informatie van de gebruiker wordt verzameld, kan door software bepaald worden wanneer:
- Het invoerveld een doel dient dat is geïdentificeerd in de paragraaf Inputdoelen voor Componenten van de Gebruikersinterface; en
- De content wordt geïmplementeerd met behulp van technologieën die ondersteuning bieden bij het identificeren van de verwachte betekenis van formulier-invoergegevens.
Informatie over succescriterium 1.3.5 Identificeer het doel van de input
Uitkomst: Onvoldoende
Bevindingen: Het formulier Nieuwsbrief op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx bevat het invoerveld 'E-mailadres*'. Op dit invoerveld is het autocomplete-attribuut geplaatst, maar deze heeft als waarde 'no'. Het doel van het invoerveld moet programmatisch kunnen worden bepaald, zodat velden automatisch kunnen worden ingevuld of extra hulp kan worden geboden bij het invullen. Dit kan door de juiste waarde toe te voegen bij het autocomplete-attribuut. Bijvoorbeeld autocomplete="email". Een overzicht van de velden waarvoor het autocomplete-attribuut van toepassing is en de waarde die nodig is in dit attribuut, staat op de pagina: https://www.w3.org/tr/wcag21/#input-purposes.
1.4 Onderscheidbaar
1.4.1 Gebruik van kleur (Niveau A)
Kleur wordt niet als het enige visuele middel gebruikt om informatie over te brengen, een actie aan te geven, tot een reactie op te roepen of een visueel element te onderscheiden.
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevindingen: 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.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/bladhekken staan rode en gele stippen. Alleen aan de kleur is te herkennen of de stip hoort bij de catagorie 'Bewoners' of 'gemeente Tynaarlo'. Voor bezoekers die deze kleuren niet kunnen onderscheiden is deze informatie hierdoor niet beschikbaar. Zorg dat de informatie niet alleen door kleur maar ook op andere wijze (bijvoorbeeld door vorm) wordt overgebracht.
1.4.2 Geluidsbediening (Niveau A)
Als een geluidsweergave op een webpagina automatisch meer dan 3 seconden speelt, is er of een mechanisme beschikbaar om de geluidsweergave te pauzeren of te stoppen, of er is een mechanisme beschikbaar om het geluidsvolume onafhankelijk van het overall systeemvolume te regelen.
Informatie over succescriterium 1.4.2 Geluidsbediening
Uitkomst: Voldoende
1.4.3 Contrast (minimum) (Niveau AA)
De visuele weergave van tekst en afbeeldingen van tekst heeft een contrastverhouding van ten minste 4,5:1, behalve in de volgende gevallen:
- Grote tekst: Grote tekst en afbeeldingen van grote tekst hebben een contrastverhouding van ten minste 3:1;
- Incidenteel: Tekst of afbeeldingen van tekst die deel zijn van een inactieve component van de gebruikersinterface, die puur decoratief zijn, die voor niemand zichtbaar zijn, of die onderdeel zijn van een afbeelding die significant andere visuele content bevat, hebben geen contrasteis.
- Woordmerken: Tekst die onderdeel is van een logo of merknaam heeft geen contrasteis.
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevindingen: Op de homepagina https://www.tynaarlo.nl/staan onder de header vijf links zoals bijvoorbeeld 'Welzijn, wonen, zorg'. Als de muisaanwijzer of focus hier naartoe wordt gebracht 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'.
Op de homepagina https://www.tynaarlo.nl/ staan onder de header vier links op lichtgroene (HEX #D9E3E6) achtergrond, bijvoorbeeld 'Eerste Hulp bij Geldzaken'. Als de muisaanwijzer of focus naar de link wordt gebracht wijzigt de tekstkleur naar blauw (HEX #3067C1). De contrastverhouding is 4,1:1 waar deze minimaal 4,5:1 moet zijn. De tekstgrootte is net iets te klein om aan lagere contrasteisen te mogen voldoen. Deze kleurencombinatie komt ook voor als de focus of muisaanwijzer wordt gebracht naar de links van de agenda-items onder de kop 'Agenda'. Ditzelfde komt voor op pagina https://www.tynaarlo.nl/sociaalteam, bijvoorbeeld bij 'Eerste hulp bij geldzaken'.
Als onder andere de homepagina https://www.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken en het menu wordt uitgevouwen, zijn twee menu-items te zien. Als de focus of muisaanwijzer hier naartoe wordt gebracht wijzigt de tekstkleur naar donkergroen (HEX #006A73). De tekst heeft dan te weinig contrast met de groene (HEX 00828F) achtergrond en is daardoor slecht leesbaar. De contrastverhouding is 1,3:1 waar deze minimaal 4,5:1 moet zijn.
Op onder andere de homepagina https://www.tynaarlo.nl/ is boven de footer de uitvouwbare knop 'Deel deze pagina' te vinden. Als deze uitgevouwen wordt, verschijnen drie witgekleurde links naar social media. Deze verschijnen op een groenblauwe achtergrond waarin een licht kleurverloop te zien is. Het contrast tussen tekst en achtergrond is overal onvoldoende. De contrastverhouding bij de bovenste link (witte tekst op achtergrondkleur HEX #1E8D87)is 4:1, bij de onderste link (witte tekst op achtergrondkleur HEX #08858D) is die 4,4:1. Zorg dat de contrastverhouding overal minimaal 4,5:1 is.
Op pagina https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers is in de header het logo van het COA te zien. De laatste letters van de tekst 'Centraal Orgaan opvang asielzoekers' zijn voor sommige bezoekers lastig te lezen, doordat hier een blauwe (HEX #218C99) kleur overheen valt en de letters dan van zwart naar blauw (HEX #107D8A) wijzigen. De contrastverhouding is 1,2:1 waar deze minimaal 3:1 moet zijn. Bij inzoomen valt ook een groene (HEX #2D9B90) kleur over tekst (HEX #249085) heen, waarbij een contrastverhouding van 1,1:1 ontstaat.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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. Als op 'Nee' wordt geklikt verschijnt een invoerveld met grijze (HEX #939393) placeholdertekst. Deze heeft onvoldoende contrast met de witte achtergrond. Het contrast is 3:1 waar deze minimaal 4,5:1 moet zijn. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
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.
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:
- Het adres ('Zuidlaarderweg 27, Tynaarlo') heeft een grijs (HEX A29AB4) lettertype met een contrast van 2,6:1 met de witte achtergrond.
- De tag 'Campings & Vakantieparken' heeft witte tekst op een groene (HEX 13BC73) achtergrond, de contrastverhouding is hierbij 2,4:1.
- Andere locaties kunnen een tag in andere kleur hebben, bijvoorbeeld 'Restaurant Perron 3' met de oranje (HEX #F97328) tag en witte tekst 'Horeca'. Hierbij is het contrast 2,8:1.
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.
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.
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'.
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'.
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.
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.
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.4 Herschalen van tekst (Niveau AA)
Behalve voor ondertitels voor doven en slechthorenden en afbeeldingen van tekst, kan tekst zonder hulptechnologie tot 200% geschaald worden zonder verlies van content of functionaliteit.
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Voldoende
1.4.5 Afbeeldingen van tekst (Niveau AA)
Als de gebruikte technologieën de visuele weergave tot stand kunnen brengen, wordt tekst gebruikt in plaats van afbeeldingen van tekst om informatie over te brengen, behalve in de volgende gevallen:
- Aanpasbaar: De afbeelding van tekst kan visueel aangepast worden aan de eisen van de gebruiker;
- Essentieel: Een specifieke weergave van tekst is essentieel voor de informatie die wordt overgebracht.
Informatie over succescriterium 1.4.5 Afbeeldingen van tekst
Uitkomst: Voldoende
1.4.10 Reflow (Niveau AA)
Content kan zonder verlies van informatie of functionaliteit en zonder te moeten scrollen in twee dimensies, worden weergegeven voor:
- Verticaal scrollbare content met een breedte gelijkwaardig aan 320 CSS-pixels;
- Horizontaal scrollbare content met een hoogte gelijkwaardig aan 256 CSS-pixels.
Met uitzondering van delen van de content die voor het gebruik of de betekenis een tweedimensionale lay-out vereisen.
Informatie over succescriterium 1.4.10 Reflow
Uitkomst: Onvoldoende
Bevindingen: 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.
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.
Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-english staat onder 'Documents' een link naar een pdf document dat begint met de tekst 'adapted_export_regulations'. Als de pagina bij een schermgrootte van 1280 bij 1024 pixels wordt bekeken en wordt ingezoomd vanaf 250%, verdwijnt de linktekst deels uit beeld. Zorg dat alle tekst in beeld blijft bij het inzoomen.
Advies: Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt staan onder de kop 'Foreign Guests' twee vlaggen, bij elke vlag staat een link. Als de pagina bij een schermgrootte van 1280 bij 1024 pixels wordt bekeken en wordt ingezoomd op 175%, verschuiven de links en staan deze niet meer bij de juiste vlag. Omdat dit de content niet onbegrijpelijk maakt wordt dit niet op toegankelijkheid afgekeurd, maar het is beter als de juiste link bij de juiste vlag blijft staan bij inzoomen.
Advies: Als pagina https://www.tynaarlo.nl/evenementen bij een schermgrootte van 1280 bij 1024 pixels wordt bekeken en wordt ingezoomd vanaf 175%, wisselen de link 'Vorig jaar' en de tekst met knop waar de maand geselecteerd kan worden ('Juni 2024') visueel van plek. Omdat de functionaliteit nog wel vindbaar en bedienbaar is, wordt dit niet op toegankelijkheid afgekeurd. Wel zou het voor sommige bezoekers overzichtelijker zijn als deze elementen bij het inzoomen in dezelfde visuele volgorde blijven staan.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
De visuele weergave van het volgende heeft een contrastverhouding van ten minste 3:1 ten opzichte van aangrenzende kleuren:
- Componenten van de gebruikersinterface: Visuele informatie die vereist is om componenten van de gebruikersinterface en statussen te identificeren, met uitzondering van inactieve componenten of componenten waarvan de weergave van de component wordt bepaald door de user agent en niet wordt aangepast door de auteur;
- Grafische objecten: Delen van afbeeldingen die vereist zijn om de content te begrijpen, behalve wanneer een specifieke weergave van afbeeldingen essentieel is voor de informatie die wordt overgebracht.
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/afval-en-milieu/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.
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:
- De paarse (HEX #CC66FF) stippellijn 'Derden' heeft een contrastverhouding van 2,6:1 als deze op lichtgele (HEX #E6E8D8) achtergrond valt.
- De oranje (HEX #FF9A34) stippellijn 'Curatief' heeft een contrastverhouding van 1,7:1 als deze op lichtgele (HEX #E6E8D8) achtergrond valt.
- De balk en schuifknop voor zoomen heeft bij de kleuren grijs (HEX #BBBBBB) op lichtgrijs (HEX #D9DAD) een contrastverhouding van 1,3:1.
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.
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:
- 'Natuurgebieden', de contrastverhouding met de groene (HEX #A8D42A) achtergrond is 1,7:1
- 'Bezienswaardigheden', de contrastverhouding met de gele (HEX FFD052) achtergrond is 1,4:1
- 'Wandelroutes', de contrastverhouding met de oranje (HEX FFA35C) achtergrond is 1,9:1.
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.
1.4.12 Tekstafstand (Niveau AA)
Bij content die wordt geïmplementeerd met opmaaktalen die de volgende stijleigenschappen voor tekst ondersteunen, is er geen sprake van verlies van content of functionaliteit door het instellen van alle volgende, en door het niet wijzigen van andere stijleigenschappen:
- Regelhoogte (regelafstand) naar minstens 1,5 keer de lettergrootte;
- Afstand tussen alinea's naar minstens 2 keer de lettergrootte;
- Letterafstand (spatieren van letters) naar minstens 0,12 keer de lettergrootte;
- Spatieren van woorden naar minstens 0,16 keer de lettergrootte.
Uitzondering: Menselijke talen en scripts die geen gebruik maken van een of meer van deze stijleigenschappen voor tekst in schriftelijke tekst, kunnen voldoen aan de eisen door alleen gebruik te maken van de eigenschappen die bestaan voor de betreffende combinatie van taal en script.
Informatie over succescriterium 1.4.12 Tekstafstand
Uitkomst: Voldoende
1.4.13 Content bij hover of focus (Niveau AA)
Wanneer aanvullende content zichtbaar wordt en daarna weer verborgen, door het gebruik van hover met de aanwijzer of focus met het toetsenbord, gelden de volgende zaken:
- Sluiten: Er is een mechanisme beschikbaar waarmee de aanvullende content kan worden gesloten zonder de aanwijzer hover of de toetsenbordfocus te verplaatsen, tenzij de aanvullende content een invoerfout communiceert of andere content niet verbergt of vervangt;
- Aanwijsbaar: Wanneer een aanwijzer hover aanvullende content kan activeren, dan kan de aanwijzer over de aanvullende content worden bewogen zonder dat deze verdwijnt;
- Aanhouden: De aanvullende content blijft zichtbaar totdat de oorzaak voor de hover of focus is verwijderd, de gebruiker de content sluit of de informatie niet langer geldig is.
Uitzondering: De visuele weergave van de aanvullende content wordt beheerd door de user agent en wordt niet aangepast door de auteur.
Informatie over succescriterium 1.4.13 Content bij hover of focus
Uitkomst: Voldoende
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.1 Toetsenbord (Niveau A)
Alle functionaliteit van de content is bedienbaar via een toetsenbordinterface zonder dat afzonderlijke toetsaanslagen aan tijd gebonden zijn, behalve als de onderliggende functie een invoer vereist die afhangt van het pad dat de gebruiker aflegt en niet alleen van de eindpunten.
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/actualiteiten staat de link 'Bekijk het nieuwsarchief'. Op deze link staat tabindex="-1", waardoor het niet mogelijk is om via het toetsenbord de focus naar deze link te brengen. Hierdoor is de link lastig te vinden en bereiken via het toetsenbord. Los dit op door tabindex="-1" te verwijderen.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/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.
Op pagina https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding staat een kaart waarop een knop te vinden is via welke de legenda kan worden ingevouwen en uitgevouwen. Deze knop is via het toetstenbord niet goed bedienbaar, doordat deze genest is in een element dat aria-hidden="true" en een element dat role="presentation" bevat. Zorg dat de knop via het toetsenbord bereikbaar en bedienbaar is. Een soortgelijk probleem komt voor op pagina https://www.tynaarlo.nl/afval-en-milieu/bladhekken.
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.
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.
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.
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.1.2 Geen toetsenbordval (Niveau A)
Als de toetsenbordfocus met de toetsenbordinterface verplaatst kan worden naar een component van de pagina, dan kan de focus ook met alleen de toetsenbordinterface weer van dat component weg worden bewogen. En, als er meer nodig is dan de standaard pijl- of tabtoetsen of andere standaard methoden om de focus te verplaatsen, dan wordt de gebruiker geïnformeerd over de manier waarop de focus kan worden verplaatst.
Informatie over succescriterium 2.1.2 Geen toetsenbordval
Uitkomst: Voldoende
2.1.4 Enkel teken sneltoets (Niveau A)
Wanneer een sneltoets in content wordt geïmplementeerd door alleen letters (inclusief hoofdletters en kleine letters), leestekens, cijfers of symbolen te gebruiken, geldt ten minste één van de volgende zaken:
- Uitzetten: Er is een mechanisme beschikbaar waarmee de sneltoets kan worden uitgezet;
- Opnieuw toewijzen: Er is een mechanisme beschikbaar om de sneltoets opnieuw toe te wijzen aan één of meerdere niet-afdrukbare tekens (bijvoorbeeld Ctrl, Alt, enz.);
- Alleen actief bij focus: De sneltoets voor een component van de gebruikersinterface is alleen actief wanneer de betreffende component de focus heeft.
Informatie over succescriterium 2.1.4 Enkel teken sneltoets
Uitkomst: Niet aanwezig
2.2 Genoeg tijd
2.2.1 Timing aanpasbaar (Niveau A)
Voor elke tijdslimiet die door de content wordt ingesteld, geldt ten minste één van de volgende zaken:
- Uitzetten: De gebruiker kan de tijdslimiet uitzetten voordat die wordt bereikt; of
- Aanpassen: De gebruiker mag de tijdslimiet aanpassen voordat deze is verstreken over een bereik van ten minste tien keer de standaardinstelling; of
- Verlengen: De gebruiker wordt gewaarschuwd voor de tijd afloopt en krijgt ten minste 20 seconden om de tijdslimiet met een eenvoudige handeling te verlengen (bijvoorbeeld, "druk op de spatiebalk"), en de gebruiker mag de tijdslimiet ten minste tien keer verlengen; of
- Real-time uitzondering: De tijdslimiet is onderdeel van een realtime gebeurtenis (een veiling bijvoorbeeld) en er is geen alternatief voor de tijdslimiet mogelijk; of
- Essentiële uitzondering: De tijdslimiet is essentieel en verlenging zou de activiteit ongeldig maken; of
- 20 uur uitzondering: De tijdslimiet is langer dan 20 uur.
Informatie over succescriterium 2.2.1 Timing aanpasbaar
Uitkomst: Voldoende
2.2.2 Pauzeren, stoppen, verbergen (Niveau A)
Voor alle bewegende, knipperende, scrollende of automatisch actualiserende informatie gelden alle volgende zaken:
- Bewegen, knipperen, scrollen: Voor bewegende, knipperende of scrollende informatie die (1) automatisch start, (2) langer dan vijf seconden duurt, en (3) parallel met andere content wordt getoond, is er een mechanisme voor de gebruiker om dit te pauzeren, te stoppen of te verbergen, tenzij de beweging, knippering of scrolling, onderdeel is van een activiteit waar ze essentieel is en
- Automatisch actualiserend: Voor elke soort automatisch actualiserende informatie die (1) automatisch start en (2) parallel met andere content wordt gepresenteerd, is er een mechanisme voor de gebruiker om dit te pauzeren, te stoppen of te verbergen of de frequentie van de actualisering in te stellen, tenzij de automatische actualisering onderdeel is van een activiteit waar ze essentieel is.
Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen
Uitkomst: Voldoende
2.3 Toevallen en fysieke reacties
2.3.1 Drie flitsen of beneden drempelwaarde (Niveau A)
Webpagina's bevatten niets wat meer dan drie keer flitst in enige periode van één seconde of de flits is beneden de algemene flits- en rodeflitsdrempelwaarden.
Informatie over succescriterium 2.3.1 Drie flitsen of beneden drempelwaarde
Uitkomst: Voldoende
2.4 Navigeerbaar
2.4.1 Blokken omzeilen (Niveau A)
Er is een mechanisme beschikbaar om blokken content die op meerdere webpagina's worden herhaald te omzeilen.
Informatie over succescriterium 2.4.1 Blokken omzeilen
Uitkomst: Voldoende
2.4.2 Paginatitel (Niveau A)
Webpagina's hebben titels die het onderwerp of doel beschrijven.
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevindingen: 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. Ditzelfde geldt voor de PDF https://www.tynaarlo.nl/sites/default/files/documents/adapted_export_regulations_at_elst_zuidlaren_and_hedel_horse_markets_0.pdf.
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)
Als een webpagina sequentieel genavigeerd kan worden en de navigatiesequenties hebben invloed op de betekenis of het gebruik, dan krijgen focusbare componenten de focus in de juiste volgorde waardoor betekenis en bedienbaarheid behouden blijft.
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevindingen: 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.
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.
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.
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').
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.
2.4.4 Linkdoel (in context) (Niveau A)
Het linkdoel kan bepaald worden uit enkel de linktekst of uit de linktekst samen met zijn door software bepaalde linkcontext, behalve daar waar het doel van de link een dubbelzinnige betekenis zou kunnen hebben voor gebruikers in het algemeen.
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/ik-heb-een-idee staan blokken met een kop, afbeelding, tekst en de link 'Meer informatie'. Visueel is te begrijpen waar deze link bij hoort, maar dit is niet zo voor bezoekers die niet kunnen zien en alleen deze linktekst voorgelezen krijgen door hulpsoftware zoals een screenreader. Los dit bijvoorbeeld op door de tekst van de kop (bij het eerste blok is dat 'Duurzaam idee') toe te voegen aan de linktekst. Een soortgelijk probleem komt op deze pagina voor onder de kop 'Ander idee of initiatief indienen'.
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 veld niet ingevuld wordt en het formulier wordt verzonden, verschijnt bij het veld de melding 'Fout: Dit veld is verplicht en moet ingevuld worden'. Hulpsoftware zoals een screenreader leest deze melding soms voor als link, waarbij het linkdoel onduidelijk is. Dit komt doordat de melding als link is opgemaakt met het a-element, maar een href ontbreekt. De tekst heeft hier niet de functie van een link, daarom kan dit opgelost worden door de foutmelding niet met het a-element maar als gewone tekst op te maken. Ditzelfde komt voor op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij de stap 'Aanvrager'.
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 dit formulier wordt ingevuld en verstuurd, verschijnt het ingevulde formulier op de pagina. Hierin staat onder de kop 'Contactformulier' een lege link. Dit betreft een a-element zonder href. Voor bezoekers kan het verwarrend zijn als voorgelezen wordt dat hier een link staat, terwijl dat niet zo is. Verwijder het a-element.
Advies: Op pagina https://www.tynaarlo.nl/english staat in het menu de link 'English'. De link leidt naar de pagina waar de bezoeker zich al bevindt en heeft hiermee geen functie. Dit wordt niet afgekeurd onder dit succescriterium, omdat het linkdoel wel duidelijk is. Toch kan het voor sommige bezoekers verwarrend zijn dat de link naar zichzelf verwijst. Het is beter om de tekst op deze pagina niet als link op te maken.
2.4.5 Meerdere manieren (Niveau AA)
Er is meer dan één manier beschikbaar om een webpagina binnen een verzameling webpagina's te vinden, behalve wanneer de webpagina het resultaat is van, of een stap in, een proces.
Informatie over succescriterium 2.4.5 Meerdere manieren
Uitkomst: Voldoende
2.4.6 Koppen en labels (Niveau AA)
Koppen en labels beschrijven het onderwerp of doel.
Informatie over succescriterium 2.4.6 Koppen en labels
Uitkomst: Voldoende
2.4.7 Focus zichtbaar (Niveau AA)
Elke gebruikersinterface die met een toetsenbord te bedienen is, heeft een bedieningswijze waarbij de indicator van de toetsenbordfocus zichtbaar is.
Informatie over succescriterium 2.4.7 Focus zichtbaar
Uitkomst: Voldoende
2.5 Input modaliteiten
2.5.1 Aanwijzergebaren (Niveau A)
Alle functionaliteit waarmee bij de bediening gebruik wordt gemaakt van meerpunts- of padgebaseerde gebaren, kan worden bediend met een enkele aanwijzer zonder een padgebaseerd gebaar, tenzij een meerpunts- of padgebaseerd gebaar essentieel is.
Informatie over succescriterium 2.5.1 Aanwijzergebaren
Uitkomst: Voldoende
2.5.2 Aanwijzerannulering (Niveau A)
Voor functionaliteit die kan worden bediend met een enkele aanwijzer, geldt ten minste één van de volgende zaken:
- Geen down-event: Het down-event van de aanwijzer wordt niet gebruikt om enig onderdeel van de functie uit te voeren;
- Afbreken of ongedaan maken: De functie wordt voltooid door het up-event en er is een mechanisme beschikbaar om de functie af te breken voordat deze wordt voltooid of om de functie ongedaan te maken als deze is voltooid;
- Up reversal: Met het up-event wordt elk resultaat van het voorgaande down-event ongedaan gemaakt;
- Essentieel: Het voltooien van de functie met het down-event is essentieel.
Informatie over succescriterium 2.5.2 Aanwijzerannulering
Uitkomst: Voldoende
2.5.3 Label in naam (Niveau A)
Bij componenten van de gebruikersinterface met labels die tekst of afbeeldingen van tekst bevatten, bevat de naam de tekst die visueel wordt weergegeven.
Informatie over succescriterium 2.5.3 Label in naam
Uitkomst: Onvoldoende
Bevindingen: Op onder andere de homepagina https://www.tynaarlo.nl/ is de plugin 'webReader' te vinden. Visueel is hierop de tekst 'Lees voor' te lezen. Deze tekst komt niet terug in de toegankelijke naam van deze knop, die is 'ReadSpeaker webReader: Luister met webReader'. Hierdoor is deze knop lastig aan te spreken en te bedienen voor bezoekers die gebruik maken van spraaksoftware. Zorg ervoor dat de zichtbare tekst terugkomt in de toegankelijke naam, het liefst vooraan.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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. Als op 'Nee' wordt geklikt verschijnt een invoerveld. Deze heeft het visueel verborgen label 'Hoe kunnen we deze informatie verbeteren?' gekregen. Deze tekst is niet te zien op de pagina. Voor bezoekers die wel kunnen zien en gebruik maken van spraaksoftware, is het hierdoor lastig om dit veld aan te spreken. Voor deze bezoeker is het belangrijk dat bij een interactief element de zichtbare naam voorkomt in de toegankelijke naam, het liefst vooraan. Los dit bijvoorbeeld op door het visueel verborgen label zichtbaar op de pagina te plaatsen, eventueel aangevuld met de informatie van de placeholdertekst zodat de toegankelijkheidsproblemen die zich daarmee voordoen hiermee ook opgelost zijn. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
2.5.4 Bewegingsactivering (Niveau A)
Functionaliteit die kan worden bediend door de beweging van een apparaat of beweging van een gebruiker, kan ook worden bediend met componenten van de gebruikersinterface. De reactie op de beweging kan worden uitgeschakeld om onbedoelde activering te voorkomen, behalve wanneer:
- Ondersteunde interface: De beweging wordt gebruikt om de functionaliteit te bedienen via een door toegankelijkheid ondersteunde interface;
- Essentieel: De beweging is essentieel voor de functie en wanneer de reactie op de beweging wordt uitgeschakeld, wordt de activiteit ongeldig gemaakt.
Informatie over succescriterium 2.5.4 Bewegingsactivering
Uitkomst: Niet aanwezig
3. Begrijpelijk
3.1 Leesbaar
3.1.1 Taal van de pagina (Niveau A)
De standaard menselijke taal van elke webpagina kan door software bepaald worden.
Informatie over succescriterium 3.1.1 Taal van de pagina
Uitkomst: Onvoldoende
Bevindingen: 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/zuidlaardermarkt/zuidlaardermarkt-deutsch, waar de taal van de pagina Duits is en de taalcode naar 'lang="de"' gewijzigd moet worden.
De taal van het PDF document https://www.tynaarlo.nl/sites/default/files/documents/adapted_export_regulations_at_elst_zuidlaren_and_hedel_horse_markets_0.pdf is ingesteld op Nederlands. Hierdoor kan hulpsoftware zoals een screenreader de Engelstalige content van het document niet met de juiste uitspraak voorlezen. Los dit op door de taal in te stellen op 'Engels'.
Bij het PDF document https://www.tynaarlo.nl/sites/default/files/documents/adapted_export_regulations_at_elst_zuidlaren_and_hedel_horse_markets_0.pdf is in de documenteigenschappen geen taal ingesteld. Hierdoor leest hulpsoftware zoals een screenreader de tekst mogelijk niet met de juiste uitspraak voor. Het document bevat Nederlandstalige content, dus dit kan worden opgelost door de taal in te stellen op Nederlands.
3.1.2 Taal van onderdelen (Niveau AA)
De menselijke taal van elke passage of zin in de content kan door software bepaald worden, behalve waar het gaat om eigennamen, technische termen, woorden uit een onbepaalde taal en woorden of zinsdelen die deel zijn gaan uitmaken van het jargon van de onmiddellijk omringende tekst.
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Onvoldoende
Bevindingen: Op meerdere pagina's, bijvoorbeeld https://www.tynaarlo.nl/, staat in de footer een link met de tekst 'Disclosure'. Voor bezoekers die geen Engels spreken is deze tekst mogelijk niet begrijpelijk. Omdat de website Nederlandstalig is, is het beter om voor deze link een Nederlandstalige tekst te kiezen. Wijzig de tekst om dit op te lossen.
Op pagina https://www.tynaarlo.nl/zoekresultaten?zoekwoord=zuidlaardermarkt staat een Duitstalig ('Zuidlaardermarkt (Deutch)') en een Engelstalig ('Zuidlaardermarkt (English)') zoekresultaat. Doordat de taal van de pagina op Nederlands is ingesteld, kan hulpsoftware zoals een screenreader deze teksten niet met de juiste uitspraak voorlezen. Los dit op door een afwijkende taalcode (lang="de" danwel lang="en") aan deze zoekresultaten toe te voegen.
Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-deutsch staat onder de uitvouwbare kop 'Parkplatz Pferdetransport' een afbeelding waarop Nederlandstalige tekst te zien is, ook is de beschrijvende tekst in het alt-attribuut Nederlandstalig. Dit is mogelijk niet goed te begrijpen voor Duitstalige bezoekers. Los dit op door de afbeelding te vervangen door een afbeelding met Duitstalige tekst en een Duitstalige alternatieve tekst. Een soortgelijk probleem komt voor bij dezelfde afbeelding op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-english onder 'Parking horse transport'.
Op pagina https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt staat onder de kop 'Foreign Guests' een Engelstalige link. Hulpsoftware zoals een screenreader kan deze tekst niet met de juiste uitspraak voorlezen, omdat de taal van de pagina is ingesteld op Nederlands. Voeg een afwijkende taalcode (lang="en") toe op de link, en eventueel ook op de kop 'Foreign Guests'. Ook staat er een Duitstalige link, hierop kan de afwijkende taalcode 'lang="de"' geplaatst worden.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/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.
Als pagina https://ontdek.tynaarlo.nl/ op een kleiner scherm of in ingezoomde weergave wordt bekeken, is er een menuknop (hamburgermenu) te zien. Deze heeft als naam 'Open navigation'. De tekst vertelt wat de functie van de knop is, maar in de verkeerde taal. Omdat de taal van de pagina Nederlands is, kan dit worden opgelost door de naam van de knop naar het Nederlands te vertalen.
3.2 Voorspelbaar
3.2.1 Bij focus (Niveau A)
Als een component van de gebruikersinterface de focus krijgt, dan veroorzaakt dat geen contextwijziging.
Informatie over succescriterium 3.2.1 Bij focus
Uitkomst: Voldoende
3.2.2 Bij input (Niveau A)
Verandering van de instelling van een component van de gebruikersinterface veroorzaakt niet automatisch een contextwijziging, tenzij de gebruiker geïnformeerd is over het gedrag vóór het gebruik van de component.
Informatie over succescriterium 3.2.2 Bij input
Uitkomst: Onvoldoende
Bevindingen: 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 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 vantevoren bekend is wat er gebeurt.
3.2.3 Consistente navigatie (Niveau AA)
Navigatiemechanismen, die op meerdere webpagina's binnen een verzameling webpagina's herhaald worden, komen elke keer dat ze worden herhaald in dezelfde relatieve volgorde voor, tenzij een verandering wordt geïnitieerd door de gebruiker.
Informatie over succescriterium 3.2.3 Consistente navigatie
Uitkomst: Voldoende
3.2.4 Consistente identificatie (Niveau AA)
Componenten die dezelfde functionaliteit hebben binnen een verzameling webpagina's worden consistent geïdentificeerd.
Informatie over succescriterium 3.2.4 Consistente identificatie
Uitkomst: Voldoende
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Als een invoerfout automatisch ontdekt wordt, dan wordt het onderdeel waar de fout zit geïdentificeerd en wordt de fout tekstueel aan de gebruiker meegedeeld.
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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 en op 'Verzenden' te klikken. Als een bezoeker die navigeert via het toetsenbord de focus naar keuzerondje 'Ja' brengt en zonder dat deze aangevinkt is op enter drukt, wordt de foutmelding 'Er is 1 fout gevonden: Heeft u gevonden wat u zocht?' voorgelezen. Deze tekst maakt niet duidelijk wat er mis is gegaan. Ook bevat de melding een niet-werkende link. Pas de tekst aan zodat deze beschrijft wat welke fout op welke plek is gemaakt. Het is ook mogelijk de functionaliteit van de keuzerondjes aan te passen zodat het antwoord niet verstuurd wordt (en er geen foutmelding meer verschijnt) als op enter wordt gedrukt, zie hiervoor succescriterium 4.1.2. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
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 'Vul dit veld in'. Ditzelfde komt voor op pagina https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o (formulier Geldvragen) bij de stap 'Aanvrager'.
Op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx (formulier Nieuwsbrief) staat een formulier. Als het verplichte veld 'E-mailadres *' niet 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 veld mag niet leeg zijn (E-mailadres)' te staan. De teksten van deze meldingen omschrijven onvoldoende welke fout is gemaakt. Vervang om dit op te lossen de tekst van de melding die bij het invoerveld staat, bijvoorbeeld naar 'Invoerveld E-mailadres' is leeg'.
3.3.2 Labels of instructies (Niveau A)
Als de content gebruikersinvoer vereist, dan worden labels of instructies geleverd.
Informatie over succescriterium 3.3.2 Labels of instructies
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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. Als op 'Nee' wordt geklikt verschijnt een invoerveld met de placeholdertekst 'Mist u informatie of ziet u verbeterpunten voor deze pagina? Geef hier uw feedback.'. Deze tekst verdwijnt zodra de bezoeker begint te typen, waardoor het op dat moment mogelijk niet meer duidelijk is welke invoer in het veld verwacht wordt. Een placeholder is niet geschikt als manier om invoerinstructie te plaatsen. Los dit op door de tekst als zichtbaar label buiten het veld te plaatsen. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
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'.
Op pagina https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx (formulier Nieuwsbrief) staat een formulier waarin bij invoerveld 'E-mailadres *' met een asterisk wordt aangegeven dat het veld verplicht is. Doordat er bij het formulier geen verklaring staat van de betekenis van deze asterisk, is dit mogelijk niet voor alle bezoekers duidelijk. Voeg een verklaring toe boven het formulier, bijvoorbeeld ‘Velden met een sterretje (*) zijn verplicht'.
Advies: 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. Bij de verplichte velden is in HTML via het title-attribuut op het div-element de tekst 'Verplicht veld' toegevoegd. Deze tekst wordt echter niet voorgelezen door hulpsoftware. Dit wordt niet afgekeurd omdat ook door de asterisk (*) duidelijk wordt dat het om een verplicht veld gaat. Om het voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader nog duidelijker te maken dat het om een verplicht veld gaat, kan het aria-required attribuut toegevoegd worden aan het input-element.
3.3.3 Foutsuggestie (Niveau AA)
Als een invoerfout automatisch ontdekt wordt en suggesties voor verbetering bekend zijn, dan worden de suggesties aan de gebruiker geleverd, tenzij dit de beveiliging of het doel van de content in gevaar zou brengen.
Informatie over succescriterium 3.3.3 Foutsuggestie
Uitkomst: Onvoldoende
Bevindingen: Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet 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 en op 'Verzenden' te klikken. Als een bezoeker die navigeert via het toetsenbord de focus naar keuzerondje 'Ja' brengt en zonder dat deze aangevinkt is op enter drukt, wordt de foutmelding 'Er is 1 fout gevonden: Heeft u gevonden wat u zocht?' voorgelezen. Deze tekst maakt niet duidelijk wat de bezoeker moet doen om de fout op te lossen. Ook bevat de melding een niet-werkende link. Pas de tekst aan zodat deze een suggestie bevat waarmee de fout opgelost kan worden. Het is ook mogelijk de functionaliteit van de keuzerondjes aan te passen zodat het antwoord niet verstuurd wordt (en er geen foutmelding meer verschijnt) als op enter wordt gedrukt, zie hiervoor succescriterium 4.1.2. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
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.
3.3.4 Foutpreventie (wettelijk, financieel, gegevens) (Niveau AA)
Voor webpagina's die wettelijke verplichtingen of financiële transacties voor de gebruiker uitvoeren, die, door de gebruiker te beheren gegevens in gegevensopslagplaatsen verwijderen of wijzigen, of die antwoorden van de gebruiker verzenden, geldt minstens één van de volgende zaken:
- Omkeerbaar: Verzendingen kunnen ongedaan gemaakt worden.
- Gecontroleerd: Door de gebruiker ingevoerde gegevens worden gecontroleerd op invoerfouten en de gebruiker wordt de mogelijkheid gegeven om ze te verbeteren.
- Bevestigd: Er is een mechanisme beschikbaar voor het beoordelen, bevestigen en verbeteren van informatie voordat de verzending wordt voltooid.
Informatie over succescriterium 3.3.4 Foutpreventie (wettelijk, financieel, gegevens)
Uitkomst: Niet aanwezig
4. Robuust
4.1 Compatibel
4.1.1 Parsen (Niveau A)
In content die geïmplementeerd is met opmaaktalen hebben elementen volledige begin- en eindtags, zijn elementen genest volgens hun specificatie, bevatten elementen geen dubbele attributen en zijn alle ID's uniek, behalve waar de specificatie deze eigenschappen toelaat.
Informatie over succescriterium 4.1.1 Parsen
Uitkomst: Voldoende
4.1.2 Naam, rol, waarde (Niveau A)
Voor alle componenten van de gebruikersinterface (inclusief, maar niet uitsluitend voor formulierelementen, links en door scripts gegenereerde componenten), kunnen de naam (name) en rol (role) door software bepaald worden; toestanden (states), eigenschappen (properties) en waarden (values) die door de gebruiker ingesteld kunnen worden, kunnen door software ingesteld worden; en kennisgeving van veranderingen in deze items is beschikbaar voor user agents, met inbegrip van hulptechnologieën.
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevindingen: 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.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet staat onder de kop 'Video met uitleg over het nieuwe stembiljet' een video. In browser Firefox verschijnt (wanneer via de tabtoets door de focusbare elementen van de video genavigeerd wordt) in deze videospeler een knop waarmee voor scherm-in-scherm weergave gekozen kan worden. Deze knop heeft geen naam. Bezoekers die niet kunnen zien weten daardoor niet wat de functie van deze knop is. Zorg dat de knop een naam krijgt die de functie beschrijft.
Op pagina https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet staat boven de footer een formulier met de vraag 'Heeft u gevonden wat u zocht?'. De bezoeker kan hierop antwoorden door het keuzerondje 'Ja' of 'Nee' aan te klikken en op 'Verzenden' te klikken. De keuzerondjes bevatten functionaliteit die niet voorspelbaar is voor bezoekers die navigeren via het toetsenbord. Als een keuzerondje niet is aangevinkt en de bezoeker drukt op enter als de focus hierop staat, wordt namelijk het formulier verzonden (zonder dat op de verzend-knop is gedrukt) en verschijnt een foutmelding. Voor bezoekers die navigeren via het toetsenbord kan het verwarrend werken als interactieve elementen een rol of eigenschap bevat die normaalgesproken niet bij deze elementen verwacht worden en niet vantevoren aangekondigd wordt. Los dit bijvoorbeeld op door te zorgen dat het formulier pas verzonden kan worden nadat één van de twee keuzerondjes aangevinkt is. De foutmelding (met role="alert") kan dan verwijderd worden. Dit komt op meerdere pagina's voor, bijvoorbeeld ook op https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads en https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding.
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.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/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'.
Op pagina https://www.tynaarlo.nl/afval-en-milieu/bladhekken staan in 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.
Op pagina https://afspraken.tynaarlo.nl/Afspraken (formulier Afspraak maken) bevat stap 1, 'Activiteit(en)', een aantal elementen die inactief zijn voordat de bezoeker iets heeft ingevuld. De verwijderknop ('X') heeft dan een aria-label met de tekst 'Uitgeschakelde verwijderknop, wordt enkel gebruikt voor een vloeiende overgang van een ongekozen naar een gekozen activiteit'. Deze tekst maakt de functie van de knop onvoldoende duidelijk. Pas de tekst van het aria-label aan om dit op te lossen.
Op pagina https://afspraken.tynaarlo.nl/Afspraken (formulier Afspraak maken) staat het aria-expanded="true" attribuut op het div-element waarin de content van een ingevulde stap staat (bijvoorbeeld na het invullen van stap 1 'Activiteit(en)'. Hulpsoftware kan dit niet interpreteren, en omdat het hier niet om elementen gaat die ingevouwen kunnen worden biedt dit attribuut geen correcte informatie. Verwijder dit attribuut om dit op te lossen.
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.
Advies: Op pagina https://www.tynaarlo.nl/contact-en-openingstijden staan uitvouwbare knoppen, bijvoorbeeld 'Adressen & algemeen e-mailadres'. Als deze wordt uitgevouwen is content te zien die in een div-element is geplaatst, dit div-element bevat het aria-labelledby attribuut. Omdat het div-element geen rol toegekend heeft gekregen, kan de informatie van het aria-labelledby attribuut niet worden voorgelezen. Omdat de uitvouwbare knop wel een toegankelijke naam heeft, levert dit geen toegankelijkheidsprobleem op en wordt dit niet afgekeurd op dit punt. Het aria-labelledby kan hier worden verwijderd.
4.1.3 Statusberichten (Niveau AA)
In content die is geïmplementeerd met opmaaktalen kunnen statusberichten door software bepaald worden met behulp van rol (role) of eigenschappen (properties), zodat hulptechnologieën de berichten aan de gebruiker kunnen presenteren zonder dat ze de focus krijgen.
Informatie over succescriterium 4.1.3 Statusberichten
Uitkomst: Voldoende
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
- https://www.tynaarlo.nl/
- https://www.tynaarlo.nl/contact-en-openingstijden
- https://www.tynaarlo.nl/zoekresultaten?zoekwoord=zuidlaardermarkt
- https://www.tynaarlo.nl/404
- https://www.tynaarlo.nl/english
- https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-deutsch
- https://www.tynaarlo.nl/toegankelijkheid
- https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547138&mNch=tnqhltgf4y
- https://tynap.mozardsaas.nl/mozard/!suite09.scherm1089?mWfrs=547151&mNch=thc29ahh8o
- https://www.tynaarlo.nl/verkiezingen/stemmen-met-nieuw-stembiljet
- https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers
- https://www.tynaarlo.nl/plannen-en-projecten/centrumontwikkeling-zuidlaren/downloads
- https://www.tynaarlo.nl/sites/default/files/documents/quick_scan_rondweg_zuidlaren_0.pdf
- https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt-english
- https://www.tynaarlo.nl/sites/default/files/documents/adapted_export_regulations_at_elst_zuidlaren_and_hedel_horse_markets_0.pdf
- https://afspraken.tynaarlo.nl/Afspraken/product=5
- https://www.tynaarlo.nl/ik-heb-een-idee
- https://www.tynaarlo.nl/duurzaamheid
- https://www.tynaarlo.nl/verkeer-en-vervoer/gladheidsbestrijding
- https://www.tynaarlo.nl/afval-en-milieu/bladhekken
- https://www.tynaarlo.nl/bestuur-en-organisatie/adviesraden/adviesraad-sociaal-domein
- https://www.tynaarlo.nl/zuidlaardermarkt/zuidlaardermarkt
- https://www.tynaarlo.nl/evenementen
- https://www.tynaarlo.nl/bijeenkomsten/raadsvergadering-18
- https://www.tynaarlo.nl/actualiteiten
- https://gemeente-tynaarlo.email-provider.eu/memberforms/subscribe/standalone/form/?a=qssmdaht8c&l=lkluev6ucx
- https://www.tynaarlo.nl/sociaalteam
- https://ontdek.tynaarlo.nl/
- https://www.tynaarlo.nl/afval-en-milieu/afvalinzameling
- https://www.tynaarlo.nl/plannen-en-projecten/opvang-asielzoekers/documenten-wva
- https://www.tynaarlo.nl/sites/default/files/documents/2024-04-22_-_aantekeningen_interne_stuurgroep_geanonimiseerd_0.pdf
Ondersteunende technieken
Webbrowsers (useragents) en andere software
Bij dit onderzoek is de volgende software gebruikt:- Chrome, versie 125
- Firefox, versie 126
- NVDA, versie 2024.1
- Adobe Acrobat PRO DC
Bronnen
-
Website Accessibility Conformance Evaluation Methodology (WCAG-EM) Overview
www.w3.org/WAI/eval/conformance (Engels) -
Web Content Accessibility Guidelines (WCAG) 2.1 (Geautoriseerde Nederlandse vertaling)
www.w3.org/Translations/WCAG21-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.