Toegankelijke versie: https://www.toegankelijkheidsonderzoek.nl/aalsmeer.nl/issues/
Naam website | Gemeente Aalsmeer |
---|---|
Scope |
|
Conformiteitsdoel | WCAG 2.1 niveau AA |
Basisniveau van toegankelijkheid ondersteund | Gangbare browsers en hulpsoftware. |
Een website bestaat vaak uit verschillende soorten pagina's, processen en content. De steekproef die wij maken is representatief voor de inhoud van de website. De onderzoeken voeren we handmatig uit waarbij we gebruik maken van hulpmiddelen. Dit doen wij zorgvuldig met mensen met ervaring. Omdat dit mensenwerk is kan het voorkomen dat een probleem niet is benoemd. Dit onderzoek is een momentopname. De website of app kan inmiddels veranderd zijn.
De gevonden problemen kunnen ook op pagina's buiten de steekproef voorkomen. Ga daarom bij elk probleem de gehele website na of dit ook op andere plaatsen voorkomt. Let op! Bij het aanbrengen van verbeteringen of wijzigingen op de website of app kunnen nieuwe problemen ontstaan. Let op! Bij het aanbrengen van verbeteringen of wijzigingen op de website of app kunnen nieuwe problemen ontstaan.
Het resultaat is voldoende als bij de uitkomst staat:
Het resultaat is onvoldoende als bij de uitkomst staat:
Informatie over succescriterium 1.1.1 Niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 1: Op pagina https://gemeentenieuwsbrief.email-provider.eu/memberforms/subscribe/standalone/form/?a=re2jctksdg&l=rzxj5co3hr staat het logo van de gemeente Aalsmeer. Dit is een informatieve afbeelding, maar mist een tekstalternatief. Voeg een alternatieve tekst toe met de zichtbare tekst in de afbeelding, bijvoorbeeld “logo gemeente Aalsmeer” om dit probleem op te lossen.
Bevinding 2: Op alle pagina’s staat bovenin de footer een afbeelding van het logo van Aalsmeer. Deze mist een tekstalternatief en is tevens verborgen voor hulpsoftware met het attribuut aria-hidden. Dit is een informatieve afbeelding en deze moet voor iedereen beschikbaar zijn en worden voorzien van een tekstalternatief waarin de zichtbare tekst op de afbeelding terugkomt. Dit kan door binnen het svg-element een title-element te plaatsen. Haal het attribuut aria-hidden ook weg.
Bevinding 3: Als op pagina https://www.aalsmeer.nl/ in de taalkeuzelijst voor “English” is gekozen is het tekstalternatief van de link met het logo van de gemeente Aalsmeer "Municipality of Aalsmeer Logo leading to the main page". Dat is heel netjes en correct vertaald naar het Engels, maar dat is hier niet voldoende. Dit tekstalternatief moet ook de visueel zichtbare tekst “gemeente Aalsmeer” bevatten. Dit is met name belangrijk voor SC 2.5.3, omdat deze afbeelding ook als link fungeert.
Bevinding 4: In de PDF “Overzicht aanbod voor ouders en kinderen Aalsmeer.pdf” staat in alle blokjes een logo. Bijvoorbeeld het logo van “Verloskundigenpraktijk Aalsmeer e.o.” in het blokje met de kop “Centuring Pregnancy” en het logo van de gemeente Aalsmeer in het blokje met de kop “Sociaal loket” op pagina 5. Dit zijn informatieve afbeeldingen, maar ze zijn niet getagd als afbeelding. Maak deze afbeeldingen op met de Figure-tag en voorzie deze van een tekstalternatief, waarin de tekst op de afbeelding terugkomt.
Bevinding 5: ADVIES: Op alle pagina’s staat rechts bovenaan een afbeelding van de Nederlandse vlag. De afbeelding (img-element) bevat een alternatieve tekst “Nederlands flag”. De afbeelding bevat tevens het attribuut role=”presentation”, waardoor het img-element zijn rol als afbeelding verliest. Dit wordt niet afgekeurd, maar kan wel beter. Dit kan door het attribuut role=”presentation” te verwijderen en het alt-attribuut leeg te laten (alt=””). Op deze manier wordt de afbeelding ook genegeerd.
Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 6: Op pagina https://www.aalsmeer.nl/criminaliteit-en-ondermijning-melden staat een video waar aan het begin en het eind informatie in beeld komt betreffende de opdrachtgevers voor het maken van deze video. Omdat blinde en slechtziende mensen deze informatie niet kunnen zien moet er een alternatief beschikbaar zijn. Omdat er aan het eind van de video voldoende ruimte is in het audiospoor kan dit daaraan worden toegevoegd. In plaats hiervan mag ook een volledig uitgeschreven transcript worden ingezet. Voor succescriterium 1.2.5 voldoet dit laatste niet meer als er voldoende ruimte is voor audiodescriptie.
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 7: Bij SC 1.2.3 is de video op pagina https://www.aalsmeer.nl/criminaliteit-en-ondermijning-melden beschreven waar audiodescriptie of een media-alternatief ontbreekt. Dit wordt ook afgekeurd onder dit succescriterium. Voor dit succescriterium is audiodescriptie verplicht, als er daarvoor voldoende ruimte is in het audiospoor. Dat is hier het geval. Een media-alternatief is hier niet meer voldoende als oplossing, maar mag uiteraard wel worden toegevoegd.
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 8: Op alle pagina’s zijn in de footer de h3-koppen “Raadhuis”, “Contact” en “Links” opgemaakt met het strong-element. Het strong-element is niet bedoeld voor visuele opmaak. Verwijder hier het strong-element en gebruik bij voorkeur CSS om koppen vetgedrukt weer te geven.
Bevinding 9: Op pagina https://www.aalsmeer.nl/nieuws is de koptekst “Kunt u niet vinden wat u zoekt?” opgemaakt als een alinea en tevens met het strong-element om deze vetgedrukt weer te geven. Maak deze tekst op als een echte kop, bij voorkeur met het h2-element. Haal het strong-element hier weg.
Bevinding 10: Op pagina https://www.aalsmeer.nl/ zijn de links van het toptakenmenu, waaronder “Rijbewijs, paspoort en identiteitskaart” en “Uittreksel en verklaring” tevens als koppen opgemaakt. Deze koppen bevatten geen content omdat deze direct worden opgevolgd door koppen van hetzelfde niveau. Dit komt mede doordat de eronder staande alinea verborgen is met CSS display:none;. Bezoekers die gebruikmaken van voorleessoftware kunnen aan de hand van een sneltoets of een koppenlijst over een pagina navigeren om snel informatie te vinden. Daarom is het belangrijk om een goed lopende koppenstructuur te gebruiken. Los dit op door de koppen (h3-elementen) te verwijderen. Het is voldoende dat deze links in een opsomming staan, zoals hier het geval is. Hetzelfde doet zich voor op de Engelstalige pagina.
Bevinding 11: Op pagina https://www.aalsmeer.nl/ staan onder de kop “Projecten, plannen en beleid” een meerdere blokken met onder andere de koppen “Meedoen in Aalsmeer” en “Masterplan Energie Aalsmeer: aan de slag met de energietransitie”. De koppen bevatten geen content omdat deze direct wordt gevolgd door een kop van hetzelfde niveau. Ook is alle eronder staande content, zoals de datum, verborgen met CSS display:none;. Hetzelfde doet zich voor op de Engelstalige pagina met de blokken onder de kop “Projects, plans and policies”.
Bevinding 12: Op pagina https://www.aalsmeer.nl/over-deze-website staat onder de kop “RSS-feeds” een opsomming van verschillende RSS-feeds. Deze links horen bij elkaar en moeten daarom opgenomen worden in een opsomming (ul-element).
Bevinding 13: Op pagina https://www.aalsmeer.nl/rekenkamer-en-auditcommissie staat onder de kop “Leden van de rekenkamer” een tabel. De kolomkoppen zijn hier met het strong-element opgemaakt om ze vetgedrukt weer te geven. Het strong-element is alleen bedoeld om belangrijke woorden die extra nadruk behoeven te markeren. Het is niet bedoeld om koppen vetgedrukt weer te geven. Maak deze kopteksten op met het th-element in plaats van met het td-element en voorzie deze van het attribuut scope=”col”. En verwijder het strong-element. Dezelfde situatie doet zich voor met de tabel onder de kop “Leden van de auditcommissie”. Los dit op dezelfde manier op.
Bevinding 14: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” staat op pagina 1 de tekst “Wet maatschappelijke ondersteuning (WMO) in Aalsmeer”. Deze is opgesplitst over twee alinea’s, maar moet samengevoegd worden tot één alinea, omdat deze informatie bij elkaar hoort. Visueel mag het er wel hetzelfde uit blijven zien.
Bevinding 15: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” staat op pagina 3 een inhoudsopgave. Alle items in de inhoudsopgave zijn gecodeerd als alinea met de P-tag. Dat is niet correct. Dit overzicht moet gecodeerd worden als een opsomming, bijvoorbeeld met de L-tag of de TOC-tag. Bovendien is het een opsomming met meerdere niveaus en deze niveauverschillen moeten terugkomen in de code. Bij voorkeur wordt hier gebruikgemaakt van de TOC-tag, die speciaal voor inhoudsopgaves beschikbaar is. Niet verplicht, maar wel beter is om ook de verwijzingen naar de pagina’s op te nemen in een link, zodat er direct naar de desbetreffende pagina kan worden genavigeerd.
Bevinding 16: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” zijn alle kopteksten in het document gecodeerd als alinea’s, met de P-tag. Dat is niet correct. Deze moeten gecodeerd worden als echte koppen (H1 tot en met H6). Het gaat om onder andere de koppen “1. Inleiding” en “Hoe krijgt u hulp?” op pagina 4. En op pagina 5 zijn dat onder andere “Hulp bij het huishouden” en “Zorgaanbieders”. Controleer dit voor het hele document.
Bevinding 17: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” staat onderaan de pagina de alinea startend met “Soms kunnen kleine aanpassingen al helpen.”. Deze loopt door op de volgende pagina, maar is opgesplitst in twee alinea’s. Dat is niet de bedoeling. Voeg deze samen tot één alinea.
Bevinding 18: In de PDF “Overzicht aanbod voor ouders en kinderen Aalsmeer.pdf” zijn alle kopteksten in het document gecodeerd als alinea, met de P-tag. Dat is niet correct. Deze moeten gecodeerd worden als echte koppen (H1 tot en met H6). Het gaat om onder andere de koppen “Kansrijke Start: De eerste 1.000 dagen”, “Centering Pregnancy”, “Omschrijving” en “Organisatie en Contact” op pagina 3. Dit doet zich door het hele document voor. Zorg er daarbij ook voor dat het juiste kopniveau wordt gebruikt, zodat de structuur van het document hierin duidelijk wordt weerspiegeld.
Bevinding 19: In de PDF “Overzicht aanbod voor ouders en kinderen Aalsmeer.pdf” staat op pagina 2 een inhoudsopgave. Alle items in de inhoudsopgave zijn gecodeerd als alinea met de P-tag. Dat is niet correct. Dit overzicht moet gecodeerd worden als een opsomming, bijvoorbeeld met de L-tag of de TOC-tag. Bij voorkeur wordt hier gebruikgemaakt van de TOC-tag, die speciaal voor inhoudsopgaves beschikbaar is.
Bevinding 20: ADVIES: Op pagina https://www.aalsmeer.nl/nieuwsbrieven staat onder de koppen “Nieuwsbrief Aalsmeer”, “Duurzaam Aalsmeer” en “Visit Aalsmeer” steeds de link “Aanmelden”. Deze link is opgenomen in een opsomming. Dit mag in principe alleen als een opsomming bestaat uit meerdere opsommingsitems of wanneer er bijvoorbeeld meerdere nieuwsbrieven toegevoegd kunnen worden. Deze hoeven er dan op dit moment nog niet bij te staan.
Informatie over succescriterium 1.3.5 Identificeer het doel van de input
Uitkomst: Onvoldoende
Bevinding 21: Op pagina https://gemeentenieuwsbrief.email-provider.eu/memberforms/subscribe/standalone/form/?a=re2jctksdg&l=rzxj5co3hr staat een formulier waar de bezoeker het eigen e-mailadres, de voornaam en achternaam kan invullen. Het doel van deze en een aantal andere velden moet programmatisch kunnen worden bepaald, zodat velden automatisch kunnen worden ingevuld of extra hulp kan worden geboden bij het invullen. Dit kan door het autocomplete-attribuut aan de input-elementen toe te voegen. Dit is alleen correct gedaan bij het e-mailadres. Voorzie ook de andere velden van een correcte autocomplete-waarde. Voor voornaam is dat autocomplete=" given-name" en voor achternaam is dat autocomplete=”family-name”.
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevinding 22: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” komen links voor in de lopende tekst die zich alleen door kleur onderscheiden van de omliggende tekst. Het gaat bijvoorbeeld om de links “www.aalsmeer.nl/wmo” op pagina 4 en de link “www.aalsmeer.nl/bezwaarschrift” op pagina 15. Dat mag alleen als de contrastverhouding tussen beiden minimaal 3,0:1 is. In dit geval is dit slechts 2,6:1 en dat is niet voldoende. Beter en duidelijker is overigens om links in lopende tekst te onderstrepen.
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 23: Op pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer staat onderaan de paginering met links naar de verschillende pagina’s. Het donkergroene nummer 1 contrasteert onvoldoende met de lichtgroene achtergrond. Hetzelfde doet zich voor met de andere paginanummers en met de links “Eerste”, “Vorige”, “Volgende” en “Laatste” als deze focus of hover krijgen. De contrastverhouding tussen tekst en achtergrond is slechts 2,9:1, maar moet minimaal 4,5:1 zijn ook bij hover en focus. Dit probleem doet zich op meerdere pagina’s met paginering voor, waaronder https://www.aalsmeer.nl/nieuws en https://www.aalsmeer.nl/projecten-plannen-en-beleid. Controleer dit voor alle pagina’s.
Bevinding 24: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” staat op pagina 1 de tekst “in Aalsmeer”. Het contrastverschil tussen deze witte tekst en het lichtgroene blokje is te laag. De contrastverhouding is 1,6:1, maar moet minimaal 3,0:1 zijn voor grote tekst.
Bevinding 25: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” staan op pagina 6 de kopteksten “Zorgaanbieders” en “Eigen bijdrage”. Het contrastverschil tussen deze lichtgroene tekst en de witte achtergrond is te laag. De contrastverhouding is 1,6:1, maar moet hier minimaal 4,5:1 zijn. Deze lichtgroene kopteksten komen door het hele document voor.
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Onvoldoende
Bevinding 26: Wanneer bij een schermgrootte van 1280px breed ingezoomd wordt tot 200% dan wordt het zoekveld bovenaan elke pagina niet getoond, alleen de zoeken-knop. Als hierop geklikt wordt verschijnt er heel kort in beeld het invoerveld, maar direct daarna wordt de pagina https://www.aalsmeer.nl/zoeken?searchtext= geopend. Dat lijkt niet de bedoeling. Los dit op door ervoor te zorgen dat het invoerveld op de pagina getoond wordt en deze niet automatisch naar de zoekpagina gaat of maak van de knop een link als het de bedoeling is dat naar de zoekpagina wordt genavigeerd.
Bevinding 27: Wanneer bij een schermgrootte van 1280px breed ingezoomd wordt tot 200% dan doet zich het volgende voor: Op onder andere pagina https://www.aalsmeer.nl/toegankelijkheid-van-deze-website staat het pagina-menu “Op deze pagina”. Deze bedekt andere content wanneer deze is geopend. Er kan namelijk buiten dit menu worden getabd. Los dit bijvoorbeeld op door ervoor te zorgen dat dit met de Escape-toets kan worden gesloten, of dat het automatisch sluit als er buiten dit menu wordt getabd of door de content naar beneden te duwen als het menu verschijnt.
Informatie over succescriterium 1.4.10 Reflow
Uitkomst: Onvoldoende
Bevinding 28: Wanneer bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% dan doet zich het volgende voor: Als op pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer het zoekveld wordt leeggemaakt dan is de placeholdertekst “Waar bent u naar op zoek?” niet meer volledig zichtbaar. Deze tekst wordt nu slechts gedeeltelijk weergegeven. Dit is verlies van informatie. Zorg dat de tekst volledig zichtbaar is. Maar nog beter is om geen placeholdertekst te gebruiken.
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 29: Op pagina https://www.aalsmeer.nl/projecten-plannen-en-beleid staan onder de groepslabels “Kies thema”, “Kies wijk”, “Kies fase” en “Kies participatiestatus” een aantal checkboxen, waarbij de originele checkbox visueel is verborgen en de checkboxen worden weergegeven als vierkantjes met een lichtgrijze rand. Het contrast van deze randen met de witte achtergrond is te laag. De contrastverhouding is 1,2:1, maar moet minimaal 3,0:1 zijn. En als een checkbox geactiveerd is verschijnt er in het vierkantje een grijs blokje. Ook hiervan is het contrast te laag; een contrastverhouding van slechts 1,2:1. Ook hier moet het contrast minimaal 3,0:1 zijn. Ook de contrastverhouding van de randen van de keuzelijst “Sorteren op” is met 1,2:1 te laag.
Bevinding 30: Op alle pagina’s staan rechts bovenaan de paarse knop “Menu”. Als deze focus krijgt verschijnt er om de knop een groene focusrand. Het contrast tussen de groene rand en de witte achtergrond is te laag. De contrastverhouding is 1,7:1, maar moet minimaal 3,0:1 zijn. Hierdoor is voor slechtzienden en kleurenblinden het onderscheid niet of moeilijk waar te nemen. Maak gebruik van een kleurencombinatie met voldoende contrast.
Bevinding 31: Op pagina https://www.aalsmeer.nl/contact-en-openingstijden staat onder de kop “Contact en openingstijden” de link “Bel: 0297 38 75 75”. Als deze link focus krijgt verschijnt er om de link een groene focusrand. Het contrast van deze rand met de witte achtergrond is te laag. De contrastverhouding is 1,7:1. Dit is onvoldoende en moet minimaal 3,0:1 zijn. Deze link komt ook voor op pagina https://www.aalsmeer.nl/echtscheiding-melden-geregistreerd-partnerschap-beeindigen.
Bevinding 32: Op pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer staan onderaan in het contentgedeelte twee grijze blokjes met de links “429 resultaten lokale wet- en regelgeving” en “11239 resultaten officiële publicaties”. Als deze links focus krijgen verschijnt er om de links een groene focusrand. Het contrast van deze rand met de grijze achtergrond is te laag. De contrastverhouding is 1,3:1. Dit is onvoldoende en moet minimaal 3,0:1 zijn. Let op: Deze lichtgroene focusrand wordt veelvuldig ingezet. Niet alle situaties waar dit voorkomt zijn hier benoemd. Controleer dit daarom voor alle pagina’s.
Bevinding 33: Op pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer staat in het contentgedeelte een zoekformulier. Op de zoeken-knop staat een lichtgroen icoontje van een vergrootglas. Het contrast van dit icoon met de witte achtergrond is te laag. De contrastverhouding is slechts 1,8:1. Deze knop bevat de tekst “Zoeken” met voldoende contrast, maar bij een lage resolutie verdwijnt dit woord en is alleen de afbeelding nog zichtbaar. Zorg voor een contrastverhouding van minimaal 3,0:1.
Bevinding 34: ADVIES: Op pagina https://www.aalsmeer.nl/ staan onder het toptakenmenu een aantal lichtgroene linkblokken, waaronder het blok met de kop “Contact, melden, klacht of compliment”. Als deze blokken focus krijgen verschijnt er om het blok een groene focusrand, die onvoldoende contrasteert met de witte achtergrond van de blokken. Dit wordt hier niet afgekeurd, omdat ook het pijltje achter de kopteksten iets naar rechts verschuift. Dit kan wel duidelijker door een kleurencombinatie met voldoende contrast te gebruiken. Dit doet zich veelvuldig voor op deze website.
Informatie over succescriterium 1.4.12 Tekstafstand
Uitkomst: Onvoldoende
Bevinding 35: Wanneer bezoekers de regelhoogte, alinea- en tekstafstand wijzigen naar de waarden zoals beschreven voor dit succescriterium dan doet zich het volgende voor: Onderaan elke pagina staan vier social media iconen in een roodbruin vlak. Dit vlak valt nu deels over de link “Webarchief” waardoor deze niet meer leesbaar is. Zorg ervoor dat informatie beschikbaar en leesbaar blijft, ook wanneer bezoekers een eigen tekstopmaak toepassen.
Bevinding 36: Wanneer bezoekers de regelhoogte, alinea- en tekstafstand wijzigen naar de waarden zoals beschreven voor dit succescriterium dan doet zich het volgende voor: Op pagina https://www.aalsmeer.nl/projecten-plannen-en-beleid zijn de eerste opties van de keuzelijst “Publicatiedatum Oplopend” en “Publicatiedatum Aflopend” niet volledig zichtbaar zichtbaar als deze geselecteerd zijn, Deze worden aan de rechterkant afgekapt.
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevinding 37: In de PDF “Folder Wet maatschappelijke ondersteuning Aalsmeer.pdf” zijn alle links alleen te bedienen met de muis, maar niet met het toetsenbord. Het gaat bijvoorbeeld om de link “www.aalsmeer.nl/wmo” op pagina 4 en de link “www.aalsmeer.nl/bezwaarschrift” op pagina 15. Los dit op door deze dit te coderen als links met de Link-tag.
Bevinding 38: In de PDF “Overzicht aanbod voor ouders en kinderen Aalsmeer.pdf” zijn alle links, behalve die in de inhoudsopgave, alleen te bedienen met de muis, maar niet met het toetsenbord. Het gaat bijvoorbeeld om de link “https://verloskundigenaalsmeer.nl/home” op pagina 3 en de links “mamakits@prezens.nl” en “www.ggd.amsterdam.nl/ggd/contact/jeugdgezondheidszorg” op pagina 4. Los dit op door deze te coderen als link met de Link-tag. Deze links staan onderaan in elk blokje.
Informatie over succescriterium 2.4.1 Blokken omzeilen
Uitkomst: Voldoende
Bevinding 39: ADVIES: Als je op de skiplink klikt verplaats je naar de content. Op alle pagina’s, behalve pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer, wordt de “Lees voor”-widget overgeslagen. Wees hier consequent in.
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 40: De paginatitel op pagina https://gemeentenieuwsbrief.email-provider.eu/memberforms/subscribe/standalone/form/?a=re2jctksdg&l=rzxj5co3hr ontbreekt. Zorg dat er door middel van het title-element een beknopte titel aanwezig is die de inhoud van de pagina beschrijft.
Bevinding 41: De PDF “Overzicht aanbod voor ouders en kinderen Aalsmeer.pdf” heeft als documenttitel in de eigenschappen “Overzicht Preventief Jeugdhulp Aanbod 2024”. Dit is niet voldoende. Er moet ook aangegeven worden dat dit om jeugdhulp in Aalsmeer gaat. Vul dit daarom aan met Aalsmeer.
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevinding 42: Als op pagina https://www.aalsmeer.nl/projecten-plannen-en-beleid één van de filteropties wordt geactiveerd, bijvoorbeeld de filteroptie “Ontwerp” onder het groepslabel “Kies fase” dan verplaatst de focus zich. Laat de focus op de gekozen checkbox staan om te voorkomen dat bezoekers die gebruikmaken van toetsenbord niet verdwalen op het scherm.
Bevinding 43: Op alle pagina’s staat rechts bovenaan de knop “Menu”. Als deze wordt geactiveerd blijft de focus op deze knop staan. Dat is niet correct, De focus moet dan worden verplaatst naar of binnen de lightbox. Zolang dit venster openstaat mag de focus ook niet op een element komen buiten dit venster. Als het venster gesloten wordt door buiten het venster te tabben gaat de focus naar de link “Mijn Aalsmeer”. Als het venster gesloten wordt door de Escape-toets te activeren lijkt de focus naar het body-element te gaan. Dit is geen logische volgorde. Als het venster gesloten wordt, moet de focus teruggaan naar de knop “Menu” waarmee het geopend werd. Zie ook succescriterium 4.1.2.
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 44: Op pagina https://www.aalsmeer.nl/nieuwsbrieven staat onder de koppen “Nieuwsbrief Aalsmeer”, “Duurzaam Aalsmeer” en “Visit Aalsmeer” steeds de link “Aanmelden”. Deze link beschrijft onvoldoende het doel ervan. Vul dit daarom aan, zodat duidelijk is om welke nieuwsbrief het gaat. Bij de eerste link zou dat dan kunnen worden “Aanmelden nieuwsbrief Aalsmeer”. Deze aanvulling mag visueel verborgen zijn, omdat visueel wel duidelijk is dat deze link bij de erboven staande kop hoort.
Informatie over succescriterium 2.4.6 Koppen en labels
Uitkomst: Onvoldoende
Bevinding 45: De knop “Aanmelden” onderaan het formulier op pagina https://gemeentenieuwsbrief.email-provider.eu/memberforms/subscribe/standalone/form/?a=re2jctksdg&l=rzxj5co3hr beschrijft onvoldoende het doel van de knop. Het is niet duidelijk waarvoor men zich aanmeldt. Los dit bijvoorbeeld op door dit aan te vullen tot “Aanmelden voor nieuwsbrief Aalsmeer”. Deze aanvulling moet hier ook visueel zichtbaar zijn, omdat het in het geheel niet duidelijk is waarvoor het formulier bedoeld is. Dit wordt mede veroorzaakt door de missende paginatitel.
Bevinding 46: Als na de link “Mijn Aalsmeer” verder wordt getabd dan komt de focus op het div-element met role=”combobox”. Dit element heeft als toegankelijke naam “language”. Behalve dat dit Engelstalig is, beschrijft dit onvoldoende het doel van dit element. Het doel is namelijk om een taal te selecteren. Dit moet duidelijk terugkomen in de toegankelijke naam. Om zowel het doel als de geselecteerde taal aan te geven, zou dit bijvoorbeeld kunnen worden gecombineerd tot “Selecteer een andere taal. De huidige taal is Nederlands”. https://www.aalsmeer.nl/
Bevinding 47: Op pagina https://www.aalsmeer.nl/criminaliteit-en-ondermijning-melden staat onder de visueel verborgen kop “Laat crimineel geld je handel niet verpesten” een video. Deze bevindt zich binnen een genest iframe-element. Op het eerste iframe-element bevat het title-attribuut alleen een beschrijving van de inhoud van de video, namelijk “Laat crimineel geld je handel niet verpesten”. Dat is niet voldoende. Er moet ook aangegeven worden welk contenttype het betreft, namelijk “video”. Voeg dit alsnog toe aan het title-attribuut. Het geneste iframe-element mist een title-attribuut en daarmee een toegankelijke naam. De meest logische oplossing is hier om de twee iframe-elementen te combineren tot één. Let er dan wel op dat het resterende iframe-element een title-attribuut bevat met een waarde zoals hierboven beschreven.
Informatie over succescriterium 2.4.7 Focus zichtbaar
Uitkomst: Onvoldoende
Bevinding 48: Op pagina https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer kan je het menu openen. Het zoekveld blijft vooraan in beeld staan; hierdoor is de focus op een paar items in het menu niet zichtbaar als je er met de tabtoets doorheen navigeert.
Informatie over succescriterium 2.5.3 Label in naam
Uitkomst: Onvoldoende
Bevinding 49: Het volgende doet zich voor als op pagina https://www.aalsmeer.nl/ in de taalkeuzelijst voor “English” is gekozen. Bovenaan de pagina staat het logo van de gemeente Aalsmeer in een link. De toegankelijke naam van deze link "Municipality of Aalsmeer Logo leading to the main page" bevat niet de naam die visueel zichtbaar is. Hierdoor is de knop lastig met spraakbesturing te bedienen. Zorg ervoor dat de visuele naam “gemeente Aalsmeer” aaneengesloten in de toegankelijke naam aanwezig is, liefst vooraan.
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Onvoldoende
Bevinding 50: Het volgende doet zich voor als op pagina https://www.aalsmeer.nl/ in de taalkeuzelijst voor “English” is gekozen. Als de focus in het zoekveld boven aan de pagina staat en er wordt bijvoorbeeld de zoekterm “gemeente” getypt, dan verschijnt eronder een opsomming met zoekresultaten. Dit overzicht bevat Nederlandstalige zoekresultaten en dit wijkt af van de hoofdtaal (Engels) van de pagina. Hierdoor kan voorleessoftware de Nederlandse teksten niet op de juiste manier presenteren. Los dit bijvoorbeeld op door de Nederlandstalige resultaten te markeren als Nederlands.
Bevinding 51: Op pagina https://www.aalsmeer.nl/about-gaming-alcohol-and-more zijn de meeste teksten in het contentgedeelte Engelstalig. Deze taal wijkt af van de hoofdtaal (Nederlands) van de pagina. Hiervoor moet in de code een taalwisseling komen. Dit kan bijvoorbeeld worden gedaan door aan het main-element het attribuut lang=”en” toe te voegen. Let daarbij dan wel op dat de kop “Op deze pagina” in het aside-element wel weer gemarkeerd moet worden met lang=”nl”. Een andere optie is natuurlijk om deze koptekst te vertalen in het Nederlands. Ook staat er onderaan de pagina een afbeelding met het Nederlandstalige tekstalternatief “Jonge jongen met telefoon in handen met graphic. Moeder kijkt toe.”. Omdat de afbeelding decoratief is mag het tekstalternatief worden leeg gelaten (alt=””). Als het tekstalternatief niet wordt verwijderd dan moet dit worden vertaald naar de Engelse taal.
Bevinding 52: Op pagina https://www.aalsmeer.nl/projecten-plannen-en-beleid zijn een aantal filterresultaten Engelstalig, bijvoorbeeld “About gaming, alcohol, and more Information and advice for parents and caregivers about gaming, alcohol, and more”. Dit wijkt af van de hoofdtaal van de pagina (Nederlands). Voorzie deze Engelstalige teksten daarom van de juiste taalcode.
Bevinding 53: Als in het zoekformulier bovenaan elke pagina bijvoorbeeld de zoekterm “gemeente” wordt ingevoerd, dan verschijnt een overzicht met zoekresultaten. Dit overzicht met het attribuut role=”listbox” heeft als toegankelijke naam de waarde van het div-element erboven met role=”status”. Deze bevat de tekst “Navigate up/down to select results or confirm directly to view all results.”. Dit is een andere taal dan de hoofdtaal van de pagina. Als aan het invoerveld role="combobox" wordt toegekend is het voor de bezoeker met hulpsoftware al duidelijk hoe dit veld werkt met het toetsenbord. Dat maakt de Engelse tekst overbodig.
Bevinding 54: Als op pagina https://www.aalsmeer.nl/ in de taalkeuzelijst voor “English” is gekozen zijn niet alle Nederlandstalige teksten vertaald naar de Engelse taal. De 5 paarse knoppen op de homepage zitten in een opsomming genaamd "Geaccentueerd onderwerpen" en op de opsomming startend met “driving licence, passport and identity card” staat het attribuut aria-label met de waarde “Andere onderwerpen”. Dit wordt voorgelezen als de focus op het eerste opsommingsitem komt. Deze taal wijkt af van de hoofdtaal van de pagina. De beste oplossing is hier om deze tekst om te zetten naar Engelstalige tekst; ook kan gekozen worden om de tekst hier weg te laten als duidelijk is wat de opsomming omvat.
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 55: Op alle pagina’s staat bovenaan de pagina een zoekformulier. Als daar wat ingetikt wordt, bijvoorbeeld “gemeente” verschijnt er een lijst met zoekresultaten. Dit is niet helemaal correct opgemaakt. Om dit goed te laten werken moet het zoekveld opgemaakt worden als een combobox met role=”combobox”. Dat is nu niet het geval. Deze rol staat nu op een omliggend element, en dat werkt niet. Het invoerveld is wel al voorzien van de attributen ‘aria-autocomplete’ en ‘aria-owns’. Let op: het is beter om in plaats van het attribuut ‘aria-owns’ het attribuut ‘aria-controls’ te gebruiken, omdat dit beter wordt ondersteund door verschillende browsers. Dezelfde situatie doet zich voor met het zoekformulier onder de kop “Zoeken” op https://www.aalsmeer.nl/zoeken?searchtext=aalsmeer.
Bevinding 56: Op pagina https://www.aalsmeer.nl/criminaliteit-en-ondermijning-melden staat onder de visueel verborgen kop “Laat crimineel geld je handel niet verpesten” een video. Deze bevindt zich binnen een genest iframe-element. Het geneste iframe-element mist een toegankelijke naam. Zie voor een oplossing hiervan SC 2.4.6.
Bevinding 57: Op alle pagina’s staat bovenin de knop “Menu”. Als deze knop wordt geactiveerd verschijnt er een lightbox (dialoogvenster) met daarin het menu. Dit venster mist onder andere een rol en een naam. Voorzie dit venster van de attributen role=”dialog” en aria-modal=”true” om aan te geven dat het een dialoogvenster is en tevens dat de achterliggende content niet beschikbaar is voor interactie. Voorzie dit interactieve element van een toegankelijke naam, bijvoorbeeld “Hoofdmenu”. Gebruik hiervoor bijvoorbeeld het attribuut aria-label.
Bevinding 58: Op alle pagina’s staat bovenin een keuzelijst voor het selecteren van een taal. Deze is opgemaakt met de rollen role=”combobox” en role=”listbox”. De rol=combobox staat op de verkeerde plek; immers binnen de combobox staat een a-element waardoor interactieve functies zijn genest. Dit is overbodig. Controleer de hele functionaliteit nog eens goed zodat attributen op de correcte plek staan.
Bevinding 59: Op alle pagina’s staat bovenin de knop “Menu”. Deze is bedoeld om een lightbox te openen en te sluiten. Op deze knop is het attribuut aria-expanded geplaatst, om aan te geven of de lightbox geopend dan wel gesloten is. In combinatie met een modal lightbox is dit geen werkbare situatie. Dit komt omdat, zodra de lightbox geopend is, de focus in de lightbox moet staan en niet op de "Menu"-knop. De focus moet vervolgens binnen de lightbox blijven tot deze gesloten wordt. Hierdoor is deze knop dus niet meer beschikbaar om de lightbox te sluiten. Dit kan worden opgelost door binnen de lightbox een knop toe te voegen om de lightbox te sluiten.
Informatie over succescriterium 4.1.3 Statusberichten
Uitkomst: Onvoldoende
Bevinding 60: Op pagina https://gemeentenieuwsbrief.email-provider.eu/memberforms/subscribe/standalone/form/?a=re2jctksdg&l=rzxj5co3hr de knop Aanmelden het formulier wordt verstuurd via de knop 'aanmelden' dan constateren we met schermvoorleessoftware dat niet altijd altijd de hele foutmeldingen bovenaan het formulier wordt voorgelezen. Wat hier precies misgaat is niet duidelijk; de focus wordt voor, tijdens of na het laden verplaatst waardoor soms stukken tekst overgeslagen wordt.
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.
Bij dit onderzoek is de volgende software gebruikt:
Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.