Toegankelijke versie: https://toegankelijkheidsonderzoek.nl/stadshagen.nl/
Toegankelijkheidsonderzoek 
Toegankelijke versie: https://toegankelijkheidsonderzoek.nl/stadshagen.nl/
De website Stadshagen Zwolle voldoet nog niet aan WCAG 2.1 niveau AA. Er zijn 22 van de 50 succescriteria waar een 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 https://stadshagen.nl/ is onderzocht tussen 25 oktober en 21 november 2024. Het onderzoek is uitgevoerd aan de hand van de evaluatiemethode WCAG-EM. Doel van dit rapport is om te bepalen welke verbeteringen nodig zijn om dit digitaal kanaal toegankelijker te krijgen.
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.
| Naam website | Stadshagen Zwolle |
|---|---|
| Scope |
|
| Conformiteitsdoel | WCAG 2.1 niveau AA |
| Basisniveau van toegankelijkheid ondersteund | Gangbare browsers en hulpsoftware. |
| Principe | Voldoende | Onvoldoende | Niet duidelijk |
|---|---|---|---|
| 1 Waarneembaar | 10 | 10 | 0 |
| 2 Bedienbaar | 10 | 7 | 0 |
| 3 Begrijpelijk | 7 | 3 | 0 |
| 4 Robuust | 1 | 2 | 0 |
| Totaal | 28 | 22 | 0 |
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:
Alle niet-tekstuele content die aan de gebruiker wordt gepresenteerd, heeft een tekstalternatief dat een gelijkwaardig doel dient, behalve voor de hierna vermelde situaties.
Informatie over succescriterium 1.1.1 Niet-tekstuele content.
Uitkomst: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/ staat boven aan de pagina een kaart met daar op een logo met de tekst "Breezicht - rijk van groen en water". Deze afbeelding heeft een leeg tekstalternatief, dat is hier niet correct. Zorg voor een tekstalternatief met daarin de leesbare tekst uit de afbeelding. Dezelfde afbeelding staat ook op pagina https://stadshagen.nl/buurtschap/duinzicht/ .
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat bovenaan een afbeelding met de tekst "De Tippe - buurschap voor de toekomst". Deze afbeelding heet een leeg tekstalternatief, dt is niet correct. Zorg voor een tekstalternatief met daarin de leesbare tekst uit de afbeelding.
Op pagina https://stadshagen.nl/ staat links onder in de pagina het logo van Stadshagen. Deze is nu opgemaakt als een achtergrondafbeelding en mist daardoor een tekstalternatief. Dit is niet correct, maak deze afbeelding op als een echte afbeelding (img element) en voorzie deze van een tekstalternatief die alle tekst van de afbeelding omvat.
Op pagina https://stadshagen.nl/ staat onderaan de pagina een afbeelding waarmee het cookie-venster kan worden geopend. Deze afbeelding heeft als tekstalternatief “Cookiebot session tracker icon loaded”. Dat is geen duidelijk tekstalternatief, wijzig dit naar bijvoorbeeld “cookievenster”. Dit probleem herhaalt zich op iedere pagina.
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:
Informatie over succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen).
Uitkomst: Niet aanwezig
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
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
Bevinding: Op pagina https://stadshagen.nl/ staat een video met visuele content die niet beschikbaar is voor mensen met een visuele beperking:
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
Er wordt een audiodescriptie geleverd voor alle vooraf opgenomen videocontent in gesynchroniseerde media.
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen).
Uitkomst: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/ staat een video met visuele content die niet beschikbaar is voor mensen met een visuele beperking:
Op pagina https://stadshagen.nl/buurt/de-tippe/ staan twee video’s. In de eerste video is de volgende visuele informatie niet beschikbaar voor mensen met een visuele beperking:
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
Bevinding: Op pagina https://stadshagen.nl/raad-van-state-stelt-gemeente-in-gelijk-over-bestemmingsplan-uitbreiding-winkelcentrum-stadshagen/ zijn zinnen en koppen opgemaakt met het strong-element, bijvoorbeeld de alinea "De Raad van State heeft op woensdag ... van de realisatie". Het strong-element is bedoeld om nadruk te geven aan een of enkele woorden, niet voor hele zinnen. Haal het strong-element hier daarom weg en maak de alinea eventueel op met behulp van CSS. Ook zijn de koppen, bijvoorbeeld "Belangrijke ontwikkeling voor Stadshagen" en "Verwachte planning" opgemaakt met het strong-element. Het strong-element mag niet worden gebruikt als visuele kop, omdat ze niet dezelfde betekenis hebben als een kop (bijvoorbeeld h2 of h3). Haal het strong element bij de visuele koppen weg en maak ze in de code op als kop (h1 t/m h6 element). Soortgelijke problemen doen zich voor op pagina https://stadshagen.nl/tweede-knarrenhof-van-zwolle-komt-in-de-tippe/ .
Op pagina https://stadshagen.nl/ staat de visuele kop “Ja, ik wil wonen in Stadshagen”. Deze kop is in de code opgesplitst in drie delen om een bepaalde opmaak te realiseren. Dat is niet correct. Bovendien heeft de h3 kop nu geen content, ook dit is niet correct. Maak de visuele kop daarom op als één kop met het juiste element (h1 – h6). Gebruik voor het realiseren van een bepaalde opmaak bij voorkeur CSS. Vergelijkbare situaties doen zich op meerdere plaatsen voor, onder andere op pagina https://stadshagen.nl/ bij de visuele koppen “Waar voel jij je thuis” en “Ik wil me graag Aanmelden”, op pagina https://stadshagen.nl/contact/ bij de visuele kop “Kom in contact met ons” en op pagina https://stadshagen.nl/buurt/de-tippe/ bij de visuele koppen “Een buurt, drie buurschappen”, “Het knusse gevoel van een dorp” en “centrale ontmoetingsplek Weidepark”. Controleer de hele website.
Advies: Op https://stadshagen.nl/ staat ongeveer halverwege de pagina boven de video de kop “Video 25-jarig jubileum Stadshagen Zwolle”, deze is opgemaakt als een h1-kop. Gebruikelijk is om op ieder pagina één h1 kop te gebruiken en wel bovenaan de pagina. Deze kop beschrijft dan de inhoud van de gehele pagina.
Advies: Op pagina https://stadshagen.nl/contact/ staan vier koppen die zijn opgemaakt als een h1 kop. Zorg voor een logische koppenstructuur. Een soortgelijke situatie doen zich ook voor op onder andere https://stadshagen.nl/buurt/de-tippe/ en op https://stadshagen.nl/stadshagen/ . Controleer de hele site.
Op pagina https://stadshagen.nl/buurt/de-tippe/ bevinden zich een aantal uitvouwbare accordeons, waaronder de accordeon “Waar je nooit meer weg wilt”. Deze accordeons zijn opgemaakt als definitie-lijsten (dl-element). De koppen zijn opgemaakt met een dt-element en de eronder staande inhoud met een dd-element. Dat is hier niet correct. Een definitielijst dient met name ingezet te worden voor begrippenlijsten of voor een lijst met veelgestelde vragen en dat is hier niet het geval. Omdat dit uitklapbare kopjes zijn zouden ze opgemaakt kunnen worden met het summary-element en de eronder staande inhoud met het details-element. Andere opties zijn ook mogelijk. Zie daarvoor ook succescriterium 4.1.2.
Advies: Het volgende wordt niet fout gerekend maar kan wel beter. Op pagina https://stadshagen.nl/buurt/de-tippe/ bevinden zich een aantal uitvouwbare accordeons, waaronder de accordeon “Transcriptie video De Tippe”. Visueel is het niet duidelijk dat deze uitvouwbaar zijn en wat de status ervan is. Het advies is om bijvoorbeeld een icoontje te gebruiken van een pijltje omlaag als de accordeon samengevouwen is en een pijltje omhoog als deze uitgevouwen is.
Op pagina https://stadshagen.nl/buurt/de-tippe/ is er een filter-mogelijkheid. Bij deze velden zijn de labels niet goed expliciet geassocieerd met de invoervelden. Tekstlabels moeten gekoppeld worden aan invoervelden door gebruik te maken van het for-attribuut bij het label-element die verwijst naar een id-attribuut bij het invoerveld. Zo krijgt een bezoeker die gebruik maakt van een screenreader te horen om welk veld het gaat als direct naar het invoerveld wordt gesprongen. Gebruik geen h3 voor de veldnamen, maar gebruik het label-element, met uitzondering van 'Prijsrange'. Dit beschrijft meerdere velden en plaats je binnen een legend als fieldset, waarbij alleen het veld 'Prijs vanaf' correct is geassocieerd. Hetzelfde probleem doet zich voor op:
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
Bevinding: Op de pagina https://stadshagen.nl/category/nieuws/ staan blokken met een datum, een kop, een afbeelding en tekst. Als de blokken achter elkaar worden voorgelezen is het niet duidelijk bij welke kop de datum hoort. Zet de koppen vooraan in de HTML-code en zet hierachter de datum van plaatsing. Visueel mag deze indeling wel aangehouden worden.
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: Voldoende
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
Het doel van elk invoerveld waarmee informatie van de gebruiker wordt verzameld, kan door software bepaald worden wanneer:
Informatie over succescriterium 1.3.5 Identificeer het doel van de input.
Uitkomst: Voldoende
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: Voldoende
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
De visuele weergave van tekst en afbeeldingen van tekst heeft een contrastverhouding van ten minste 4,5:1, behalve in de volgende gevallen:
Informatie over succescriterium 1.4.3 Contrast (minimum).
Uitkomst: Voldoende
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: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/cookie-policy/ staan drie tabellen. Bij 200% zoom valt in iedere tabel de vierde kolomkop deels buiten beeld. Zorg er voor dat ook bij 200% zoom alle content beschikbaar is. Zie ook de bevinding onder succes criterium 1.4.12.
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:
Informatie over succescriterium 1.4.5 Afbeeldingen van tekst.
Uitkomst: Voldoende
Content kan zonder verlies van informatie of functionaliteit en zonder te moeten scrollen in twee dimensies, worden weergegeven voor:
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
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ staat de visuele kop “Eén buurt, drie buurtschappen”. Deze is slechts deels zichtbaar. Ook de tekst onder deze kop valt deels buiten beeld. Een vergelijkbaar probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ met de visuele kop “Speels duinlandschap” en de bijbehorende content.
Onderaan pagina https://stadshagen.nl/buurt/de-tippe/ staat een overzicht van het woningaanbod. De tekst die hoort bij een project valt deels buiten beeld. Bij Groengaarde staat bijvoorbeeld de regel “Groengaarde is het nieuwste deelplan in”. Bij 400% zoom is allen de tekst “Groengaarde is het nieuwste deelpl” zichtbaar. Ook bij het overige aanbod valt het laatste deel van de regel buiten beeld. Een vergelijkbaar probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ en op pagina https://stadshagen.nl/aanbod/ .
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onderaan de pagina het invoerveld “Ben je geïnteresseerd in koop of huur?”. In het bijbehorende dropdownmenu wordt de optie “Nee, ik wilde alleen mijn idee(en) voor co-creatie in De Tippe doorgeven ” slechts deels getoond.
Op pagina https://stadshagen.nl/cookie-policy/ staan drie tabellen. Bij 400% zoom worden de gegevens niet meer horizontaal, maar verticaal gepresenteerd. En worden de kolomkoppen niet meer getoond, waardoor niet duidelijk is om wat voor gegevens het gaat. De laatste kolom “Type” en de bijbehorende gegevens worden in het geheel niet getoond.
Op onder andere pagina https://stadshagen.nl/ staat bovenaan een kaart met de verschillende projecten. Ieder project is aanklikbaar waarna een pop-up opent. Niet alle koppen zijn volledig leesbaar. Een voorbeeld is “Nieuwbouwwoningen Reede”, hier valt een deel van het eerste woord buiten beeld. Ook “Groeneburenhof” valt deels buiten beeld.
Als bij 400% zoom met het toetsenbord wordt genavigeerd, verschijnt op enig moment de optie "Naar hoofdcontent" in beeld. Dit valt echter over het mobiele menu heen en is daardoor onleesbaar. Zorg er voor dat functionaliteit ook bij 400% zoom zichtbaar blijft.
De visuele weergave van het volgende heeft een contrastverhouding van ten minste 3:1 ten opzichte van aangrenzende kleuren:
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content.
Uitkomst: Onvoldoende
Bevinding: Op https://stadshagen.nl/ staat bovenaan de pagina een kaart met daarop icoontjes waar de projecten zich bevinden. De paarse icoontjes op de rode achtergrond hebben een contrast van 2,3:1 en dat is te weinig. Zorg ervoor dat dit minimaal 3,0:1 is. Het zelfde probleem doet zich voor op pagina https://stadshagen.nl/aanbod/ .
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onder de kop "Klik op een buurschap voor meer info" een afbeelding met voor ieder buurschap een oranje klikbaar vlak. Het contrast van deze oranje vlakken met de rest van de afbeelding varieert tussen de 1,1:1 en de 2,0:1. Dit is te laag, zorg voor een minimaal contrast van 3,0:1.
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:
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: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/cookie-policy/ staan drie tabellen. Bij een aangepaste tekstafstand valt in iedere tabel de vierde kolomkop deels buiten beeld: in plaats van “Maximale bewaartermijn” is alleen “Maximale bewaartermi” leesbaar. Zie ook 1.4.4
Op pagina https://stadshagen.nl/buurtschap/duinzicht/ staan boven het woningaanbod een aantal filteropties. Als bij een aangepaste tekstafstand een “Prijs vanaf” en een “Prijs tot” wordt geselecteerd, dan is deze na selectie slecht deels zichtbaar in het invoerveld. Van bijvoorbeeld het geselecteerde bedrag “€ 750.000” wordt alleen “€ 750.” getoond. Ook geselecteerde opties in “Aanbod”, “Buurt” en “Buurschap” worden soms niet helemaal getoond. Dit komt ook voor bij een normale weergave, zij het in mindere mate. Dezelfde problemen doen zich voor op pagina https://stadshagen.nl/buurt/de-tippe/ en op pagina https://stadshagen.nl/aanbod/ .
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:
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: Onvoldoende
Bevinding: In het hoofdmenu zijn menu-items waar meerdere sub-menu items onder vallen. een voorbeeld is "De Tippe". Als over het menu item "De Tippe" wordt gehoverd verschijnen deze sub menu items. De gebruiker kan dit sub menu alleen sluiten door de muis te bewegen of met de tabtoets verder te navigeren. Dit is niet voldoende, zorg er voor dat de gebruiker het sub menu kan sluiten met de escape-toets. Het zelfde probleem doet zich voor bij het menu-item "Breezicht".
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
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ bevinden zich een aantal uitvouwbare accordeons, onder andere de transcriptie onder de video. Deze accordeons zijn alleen te bedienen met de muis. Bezoekers die met het toetsenbord navigeren, bijvoorbeeld met de tabtoets, kunnen deze accordeon niet bedienen. Zorg ervoor dat dit met javascript interactief gemaakte element ook bereikbaar en bedienbaar is met het toetsenbord. Zie voor een oplossing daarvan succescriterium 4.1.2.
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onder de kop “Klik op een buurschap voor meer info” een afbeelding met daarop de drie buurschappen. Door op een van de buurschappen te klikken verschijnt een pop-up met extra informatie. Het is echter niet mogelijk dit met het toetsenbord te doen. Zorg er voor dat alle content ook voor toetsenbordgebruikers toegankelijk is.
Op pagina https://stadshagen.nl/ staat boven aan de pagina een kaart met daar op knoppen die worden weergegeven met locatie-icoontjes. Slechts één van deze knoppen is te bereiken met het toetsenbord, omdat deze voorzien is van het attribuut tabindex=”0”. De overige locatie-knoppen zijn niet focusbaar. Zorg ervoor dat alle knoppen focusbaar en bedienbaar zijn. Het is niet voldoende om een element te voorzien van role=”button”, daarmee is het nog geen functionele knop. Maak daarom gebruik van het button-element zonder tabindex. dat geeft direct het gewenste resultaat. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
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
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:
Informatie over succescriterium 2.1.4 Enkel teken sneltoets.
Uitkomst: Onvoldoende
Bevinding: Op de pagina https://stadshagen.nl/buurt/de-tippe/ staat onder de kop "Update bouw De Tippe" een YouTube video. Deze videospeler maakt gebruik van bediening door enkele tekentoetsen, bijvoorbeeld de f voor fullscreen en de m voor mute. Deze functionaliteit is iets wat mensen die afhankelijk zijn van spraaksoftware in de weg kan staan. Deze mensen zijn juist afhankelijk van die korte commando's om met spraaksoftware hun computer te bedienen. Los dit op door de embedcode van de YouTube video aan te passen zodat de bediening met tekentoetsen uit staat. Voeg de volgende eigenschap aan de embedcode toe: 'disablekb=1'. Met deze aanpassing zorg je ervoor dat je voldoet aan dit succescriterium.
Voor elke tijdslimiet die door de content wordt ingesteld, geldt ten minste één van de volgende zaken:
Informatie over succescriterium 2.2.1 Timing aanpasbaar.
Uitkomst: Voldoende
Voor alle bewegende, knipperende, scrollende of automatisch actualiserende informatie gelden alle volgende zaken:
Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen.
Uitkomst: Voldoende
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
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: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ zijn video's via iframes geplaatst. Deze iframes hebben een title-attribuut, echter slechts met de omschrijving "YouTube video player". Geef de iframes een goede unieke omschrijving van de inhoud, bijvoorbeeld "Video sfeerimpressie van De Tippe".
Webpagina's hebben titels die het onderwerp of doel beschrijven.
Informatie over succescriterium 2.4.2 Paginatitel.
Uitkomst: Voldoende
Bevinding: Advies: De titels van de afzonderlijke pagina's dienen beschrijvend en uniek te zijn. Wat daar bij helpt is een consistente vorm van de paginatitel en dat ontbreekt nu. Hier volgen enkele voorbeelden van paginatitels zoals ze nu zijn:
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
Bevinding: Bovenin pagina https://stadshagen.nl/ staat een kaart waarop knoppen staan die worden weergegeven met locatie-icoontjes. Als deze worden geactiveerd dan opent er een popup-venster. Dit venster komt over de pagina heen te staan. Het openen van een popup heeft bepaalde eisen met betrekking tot de toetsenbordfocus. Zolang de popup open staat mag de toetsenbordfocus niet teruggaan naar de pagina op de achtergrond. Dat is nu wel mogelijk. Zorg ervoor dat de focus binnen de popup blijft als deze open staat. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
Bovenaan de home pagina https://stadshagen.nl/ staat een Google Maps-kaart van het gebied. De interface-elementen in de kaart krijgen focus voor de werkelijke inhoud van de pagina. Bezoekers die met het toetsenbord navigeren moeten onnodig vaak tabben voor ze bij de inhoud van de pagina komen. Los dit bijvoorbeeld op door boven de kaart een link te plaatsen die de mogelijkheid biedt om de kaart over te slaan en direct naar de eronder staande content te springen. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
Op pagina https://stadshagen.nl/stadshagen/ staat een slider, met daarbinnen een aantal slides. De slider is focusbaar doordat op het div-element met de class "highlight-slides-container flickity-enabled is-draggable" het attribuut tabindex=”0”is geplaatst. De erbinnen staande slides zijn echter verborgen met aria-hidden. Dat is niet logisch. Als de slides verborgen dienen te zijn voor hulpsoftware, dan mag de focus ook niet op het omliggende div-element komen. Verder mogen er binnen elementen waarop het attribuut aria-hidden staat geen interactieve elementen voorkomen. Dat is nu wel het geval. Het gaat dan om de link “www.zwolle.nl/stadshagen” binnen elke slide.
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
Bevinding: Bovenin pagina https://stadshagen.nl/ staat een kaart waarop knoppen staan die worden weergegeven met locatie-icoontjes. Als deze worden geactiveerd dan opent er een popup-venster. Onderaan al deze popup-vensters staat steeds dezelfde link “Naar projectsite”. Zorg dat links naar verschillende doelen unieke linkteksten hebben, door bijvoorbeeld de tekst aan te vullen met de titel van het venster of de pagina waarnaar gelinkt wordt. Als visueel duidelijk is waar de link bij hoort hoeft deze aanvullende tekst niet visueel zichtbaar te zijn. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een afbeelding met de drie buurschappen onder de kop “Klik op een buurschap voor meer info”. Door op een van de oranje vlakken te klikken wordt er naar het betreffende buurschap genavigeerd. Het doel van de links is hier niet duidelijk, doordat de links geen toegankelijke naam hebben. Zorg in alle gevallen voor een duidelijke toegankelijke naam.
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat de link “Lees meer”. Deze wordt ook voorgelezen als “Lees meer”. Pas dit aan naar bijvoorbeeld “Lees meer over Co-creatie”. Vergelijkbare problemen doen zich ook voor bij de links “Naar projectsite”. Dit laatste probleem doet zich ook voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ en https://stadshagen.nl/aanbod/ .
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: Onvoldoende
Bevinding: Er is maar één manier om alle pagina's binnen deze website te vinden en dat is via het volgen van links in het menu en de footer. Zorg dat er nog een manier is om elke pagina te kunnen bereiken. Te denken valt hierbij aan een zoekfunctionaliteit of een sitemap.
Koppen en labels beschrijven het onderwerp of doel.
Informatie over succescriterium 2.4.6 Koppen en labels.
Uitkomst: Voldoende
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: Onvoldoende
Bevinding: In de cookie pop-up is de focus niet zichtbaar als getabd wordt na “Cookiebot by Usercentrics”. De focus ligt dan op de kop “Deze website maakt gebruik van cookies” en de onderliggende tekst. Dit tekstblok is bovendien niet klikbaar en hoeft dus uberhaupt geen focus te krijgen.
Als op https://stadshagen.nl/ na de link “Bekijk hier het nieuwbouwaanbod” verder wordt genavigeerd met de tabtoets, is de focus niet zichtbaar. Als nogmaals de tabtoets wordt gebruikt, ligt de focus op de link “Bekijk het aanbod”. Zorg er voor dat de focus altijd zichtbaar is.
Op pagina https://stadshagen.nl/contact/ staat bovenaan de pagina een foto van een man met en petje in een moestuin. Als na het laatste menu-item verder wordt genavigeerd met de tabtoets, krijgt deze foto focus, echter is dit niet zichtbaar. (Opmerking: je kan nu met de pijltjestoets naar links en rechts navigeren en zo een nieuwe foto met tekst laten verschijnen. Dit is echter voor geen enkele gebruiker duidelijk.) Een vergelijkbaar probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ en op pagina https://stadshagen.nl/stadshagen/ .
Op https://stadshagen.nl/ staat een kaart met daarin aangegeven waar de projecten zich bevinden. Als met behulp van het toetsenbord bijvoorbeeld de pop-up van het project “Nieuwbouwwoningen Reede” (het meest noordelijke project) wordt geopend, ligt de focus op het sluitkruisje. De focus is op dat moment echter bedekt. Een vergelijkbaar probleem doet zich voor op pagina https://stadshagen.nl/aanbod/ .
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
Voor functionaliteit die kan worden bediend met een enkele aanwijzer, geldt ten minste één van de volgende zaken:
Informatie over succescriterium 2.5.2 Aanwijzerannulering.
Uitkomst: Voldoende
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: Voldoende
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:
Informatie over succescriterium 2.5.4 Bewegingsactivering.
Uitkomst: Voldoende
De standaard menselijke taal van elke webpagina kan door software bepaald worden.
Informatie over succescriterium 3.1.1 Taal van de pagina.
Uitkomst: Voldoende
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: Voldoende
Als een component van de gebruikersinterface de focus krijgt, dan veroorzaakt dat geen contextwijziging.
Informatie over succescriterium 3.2.1 Bij focus.
Uitkomst: Voldoende
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
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onder de kop “Klik op een buurschap voor meer info” een afbeelding met daarop de drie oranje vlakken die aangeven waar de buurschappen liggen. Door op een van de buurschappen te klikken verschijnt een pop-up met extra informatie. Na drie seconden wordt ineens de bovenkant van de pagina weergegeven en blijkt de pop-up gesloten. Dit kan desoriënterend werken voor gebruikers. Zorg ervoor dat er geen onaangekondigde contextwijzigingen plaatsvinden.
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
Componenten die dezelfde functionaliteit hebben binnen een verzameling webpagina's worden consistent geïdentificeerd.
Informatie over succescriterium 3.2.4 Consistente identificatie.
Uitkomst: Voldoende
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
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onderaan de pagina een aanmeldformulier. Als bezoekers formuliervelden niet (goed) invullen dan ververst de pagina en wordt de melding “Er was een probleem met je inzending. Controleer de onderstaande velden” voorgelezen door hulpsoftware. De tekst is echter niet zichtbaar omdat deze helemaal onderaan staat. Slechtzienden die gebruik maken van voorleessoftware kunnen zo niet eenvoudig bepalen waar deze melding staat en waar deze melding naar verwijst. De focus staat helemaal bovenaan de pagina en het formulier helemaal onderaan. Zorg dat de focus direct naar het formulier gaat of naar het eerste foutief ingevulde formulierveld gaat.
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een formulier. Als verplichte velden worden leeggelaten en de gebruiker klikt op "Aanmelden" verschijnt een algemene melding met de tekst “Er was een probleem met je inzending. Controleer de onderstaande velden” bovenaan het formulier. Deze melding is echter slecht leesbaar doordat de eerste en tweede regel van de melding over elkaar heen vallen. Hetzelfde probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ .
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een formulier. Als de velden “Voornaam” en “Achternaam” worden leeggelaten en vervolgens op “Aanmelden” wordt geklikt, verschijnt een foutmelding bij het veld “Voornaam”, deze luidt “Het veld Naam is verplicht ….”. Deze melding is niet duidelijk, er is namelijk geen veld “Naam”. Zorg dat er voor het veld “Voornaam” en “Achternaam” een afzonderlijk melding is. Hetzelfde probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ .
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een formulier. Als in het veld E-mailadres een foutief e-mailadres wordt ingevuld, dan verschijnt de melding “Het veld E-mailadres is verplicht en moet worden ingevuld”. Dit is een instructie en foutsuggestie. Dit is geen correcte foutmelding, geef hier aan dat het ingevoerde e-mailadres niet voldoet aan het standaard formaat van een e-mailadres. De instructie en foutsuggestie mag blijven vanwege succescriterium 3.3.2 en 3.3.3.
Als de content gebruikersinvoer vereist, dan worden labels of instructies geleverd.
Informatie over succescriterium 3.3.2 Labels of instructies.
Uitkomst: Onvoldoende
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een formulier met onder andere de velden "Toelichting ideeen co-creatie" en "Opmerkingen". In deze velden staat een placeholdertekst die verdwijnt als de gebruiker begint te typen verdwijnt de instructie. Mensen met bijvoorbeeld concentratieproblemen missen mogelijk de instructie. Zorg dat instructies altijd zichtbaar blijven. Een soortgelijk probleem doet zich voor op pagina https://stadshagen.nl/buurtschap/duinzicht/ .
Advies: Op pagina https://stadshagen.nl/buurt/de-tippe/ staat onderaan het formulier 'Aanmelden'. De labels die bij de invoervelden horen staan soms onder het betreffende veld (bijvoorbeeld in het geval van “Voornaam”) en soms boven het betreffende veld (bijvoorbeeld in het geval van “E-mailadres”). Dit werkt desoriënterend. Zorg hier voor consistentie door alle velden op dezelfde manier van een label te voorzien.
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: Voldoende
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:
Informatie over succescriterium 3.3.4 Foutpreventie (wettelijk, financieel, gegevens).
Uitkomst: Voldoende
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
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
Bevinding: Op pagina https://stadshagen.nl/buurt/de-tippe/ staan een aantal ‘kopjes’, waaronder “Transcriptie video De Tippe” en “Waar je nooit meer weg wilt”. Wanneer op één van de kopjes wordt geklikt wordt de erbij behorende content getoond. Dit zijn dus interactieve elementen. De rol van deze elementen kan niet door software worden bepaald. En ook de status (in- of uitgeklapt) van deze elementen kan niet door software bepaald worden. Bovendien zijn deze elementen alleen met de muis te bedienen en niet met het toetsenbord. Zorg dat er een mechanisme is waarmee deze kopjes ook met het toetsenbord in- en uitgeklapt kunnen worden (accordeon) en dat aan hulpsoftware duidelijk overgebracht wordt dat dit interactieve elementen zijn. Dit kan door gebruik te maken van een combinatie van het summary-element en het details-element OF door gebruik te maken van het WAI-ARIA Disclosure Pattern. Lees hier meer over op https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-faq/. Let op: Als WAI-ARIA wordt gebruikt, moet worden voldaan aan de eisen van WAI-ARIA.
Als op pagina https://stadshagen.nl/ één van de locatieknoppen op de kaart wordt geactiveerd opent er een dialoogvenster. Hulpsoftware moet de rol en de naam van deze popup kunnen bepalen. Deze zijn hier echter niet beschikbaar op het div-element met het class-attribuut “map-buurten-infowindow-wrapper”. Voeg een rol toe door dit element te voorzien van het attribuut role=”dialog” en het attribuut aria-modal=”true”. En voorzie het element van een toegankelijke naam met het attribuut aria-label of het attribuut aria-labelledby. Met het attribuut aria-describedby kan dan bijvoorbeeld verwezen worden naar de titel binnen het dialoogvenster. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
Op pagina https://stadshagen.nl/buurt/de-tippe/ staat een afbeelding met de drie buurschappen onder de kop “Klik op een buurschap voor meer info”. Door op een van de oranje vlakken te klikken wordt er naar het betreffende buurschap genavigeerd. deze links missen een toegankelijke naam.
Bovenin pagina https://stadshagen.nl/ staat een kaart waarop knoppen staan die worden weergegeven met locatie-icoontjes. Al deze knoppen missen een toegankelijke naam. Het is voor screenreadergebruikers nu niet duidelijk wat de knop doet.
Bovenin pagina https://stadshagen.nl/ staat een kaart binnen een div-element met role=”region” met daarop het attribuut aria-label met de waarde “kaart”. De toegankelijke naam “kaart” geeft onvoldoende informatie. Het dient duidelijk te zijn om wat voor kaart het gaat. Vul dit daarom aan tot bijvoorbeeld “kaart van buurt De Tippe”. Dezelfde kaart komt ook voor op pagina https://stadshagen.nl/aanbod/.
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: Onvoldoende
Bevinding: Als een veld in het filter op pagina https://stadshagen.nl/aanbod/ verandert wijzigt de lijst met projecten daar onder. Blinden en slechtzienden die met een screenreader werken krijgen geen signaal dat er iets is gewijzigd.
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.