Onderzoek toegankelijkheid enkhuizen.nl

Inleiding

Openbare voorzieningen moeten bruikbaar en toegankelijk zijn voor alle burgers. Net zoals een gebouw rolstoeltoegankelijk moet zijn, moet een website of mobiele app ook bediend kunnen worden door mensen met een beperking. Dit kunnen bijvoorbeeld visuele, auditieve of motorische beperkingen zijn. Denk aan slechtzienden, doven en slechthorenden en mensen die hun handen niet of in beperkte mate kunnen gebruiken. Ook cognitieve factoren spelen een rol: is de content voor iedereen te begrijpen?

Nederlandse overheidsorganisaties moeten voldoen aan de Web Content Accessibility Guidelines (WCAG) versie 2.1, onder de Europese standaard voor overheidswebsites EN 301 549. Deze criteria variëren van technisch functionele eisen zoals een goede werking met het toetsenbord tot aan meer inhoudelijke eisen zoals duidelijke foutmeldingen en een heldere navigatiestructuur.

Dit onderzoek is handmatig uitgevoerd volgens de WCAG-EM evaluatiemethode met ondersteuning van automatische test tools. De pagina’s uit de sample zijn onderzocht op alle 50 criteria onder WCAG 2.1 A en AA. Wanneer een criterium niet voldoet, worden hiervan een of meerdere voorbeelden gegeven. Deze bevindingen kunnen dus op meer plekken voorkomen en dienen structureel te worden aangepakt.

De WCAG criteria zijn ingedeeld volgens vier principes, welke ook de leidraad vormen voor dit rapport: Waarneembaar, Bedienbaar, Begrijpelijk en Robuust. Gedetailleerde informatie over deze criteria is te vinden op de website van het W3C (Nederlandse vertaling).

Over deze evaluatie

Rapport auteur
Janita Top
Evaluatie opdrachtgever
SED
Evaluatiedatum
15 december 2021

Managementsamenvatting

Uit dit onderzoek blijkt dat wordt voldaan aan 32 van de 50 criteria voor toegankelijkheid. Veel onderdelen van de site zijn dus al goed toegankelijk, maar er zijn nog verbeteringen mogelijk.

De website is in het algemeen goed te bedienen met het toetsenbord en de site werkt goed op mobiele apparaten. De navigatie is consistent en duidelijk. Wel zijn er enkele logo's en infographics gevonden zonder alternatieve tekst. De pagina's zijn goed voorzien van koppen, maar de hierarchie klopt nog niet overal. Bij het inzoomen worden enkele onderdelen niet goed of niet weergegeven.

Scope van de evaluatie

Website naam
Enkhuizen.nl
Scope van de website
Alle pagina's op https://www.enkhuizen.nl.
WCAG Versie
2.1
Conformiteitsdoel
AA
Basisniveau van toegankelijkheid-ondersteuning
Gangbare webbrowsers en hulpapparatuur.
Verdere onderzoeksvereisten

Uitgebreide toetsresultaten

Samenvatting

Gerapporteerd over 50 van 50 WCAG 2.1 AA Success Criteria.

Alle resultaten

1 Waarneembaar

1.1 Tekstalternatieven
Success Criterium Uitkomst Bevindingen
1.1.1: Niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Nieuwsbericht Werksaam Westfriesland helpt ondernemers om hun bedrijf klaar te maken voor de toekomst

Uitkomst: Onvoldoende

Aardgasvrij wonen

Uitkomst: Onvoldoende

Inwoners en het coronavirus

Uitkomst: Onvoldoende

PDF Besluitenlijst

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Het logo in de header heeft de zichtbare tekst 'Gemeente Enkhuizen' maar de alt tekst luidt 'Logo SED - Enkhuizen'. Zorg dat de alternatieve tekst gelijk is aan de zichtbare tekst.

Contact

Het logo in de header heeft geen alternatieve tekst en is daardoor niet te herkennen door hulpsoftware. Het logo is geplaatst als achtergrondafbeelding bij een link, zonder linktekst (er is alleen een title attribuut maar deze wordt slecht ondersteund door hulpsoftware). Zorg dat de tekst van het logo terugkomt in de HTML en in de link.

Nieuwsbericht Werksaam Westfriesland helpt ondernemers om hun bedrijf klaar te maken voor de toekomst

De afbeelding boven het nieuwsbericht heeft geen alt-attribuut. Deze afbeelding bevat ook tekst. De afbeelding heeft daarom een alt tekst nodig waar deze teksten in terug komen.

Aardgasvrij wonen

Op deze pagina staat een infographic. Voor de informatie op deze afbeelding wordt geen tekstalternatief gegeven. De alt tekst is leeg. Er staat een link naar de PDF, maar deze PDF is ontoegankelijk (niet getagd). Beschrijf de afbeelding in een tekst eronder of geef een link naar een pagina waar deze informatie staat uitgeschreven.

Inwoners en het coronavirus

Op deze pagina staat een infographic. Voor de informatie op deze afbeelding wordt geen tekstalternatief gegeven. De alt tekst is leeg. Beschrijf de afbeelding in een tekst eronder of geef een link naar een pagina waar deze informatie staat uitgeschreven.

PDF Besluitenlijst

Het logo van de gemeente Enkhuizen heeft geen alternatieve tekst.

1.2 Op tijd gebaseerde media
Success Criterium Uitkomst Bevindingen
1.2.1: Louter-geluid en louter-videobeeld (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing

1.2.2: Ondertitels voor doven en slechthorenden (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing

1.2.3: Audiodescriptie of media-alternatief (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing

1.2.4: Ondertitels voor doven en slechthorenden (live)
Hele sample

Uitkomst: Niet van toepassing

1.2.5: Audiodescriptie (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing

1.3 Aanpasbaar
Success Criterium Uitkomst Bevindingen
1.3.1: Info en relaties
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Coronavirus

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Zoekresultaten

Uitkomst: Onvoldoende

Wonen, verkeer en veiligheid

Uitkomst: Onvoldoende

Gehandicaptenparkeerkaart aanvragen of verlengen

Uitkomst: Onvoldoende

Nieuwsbericht Werksaam Westfriesland helpt ondernemers om hun bedrijf klaar te maken voor de toekomst

Uitkomst: Onvoldoende

Bestuur en organisatie

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

PDF Besluitenlijst

Uitkomst: Onvoldoende

Homepage

De koppenstructuur klopt niet helemaal. Er is een h2-kop 'Uitgelicht' met daaronder de kop 'Aardgasvrij wonen'. Dit zou een h3-kop moeten zijn, maar deze is ook op h2-niveau. Hierdoor lijkt het voor screenreadergebruikers dat er onder Uitgelicht geen items zijn. Hetzelfde probleem doet zich voor onder 'Klanttevredenheidsonderzoek'.

Coronavirus

De koppenstructuur klopt niet helemaal. Onder de h2-kop staan 3 koppen op h3-niveau zoals 'Inwoners' Maar deze koppen lijken niet onder Links te vallen, want deze gaan naar pagina's op de eigen site. Een oplossing kan zijn om hier een (met CSS verborgen) kop boven te zetten zodat het een eigen sectie wordt,

De invoervelden onder 'Heeft u gevonden wat u zocht?' hebben geen label. Er staat een label element in de code, maar deze heeft geen tekst. Daardoor hebben de invoervelden geen naam voor hulpsoftware.

De actieve pagina in het menu wordt aangegeven met een vormgeving. In de tekst wordt dit echter niet aangegeven. Hulpsoftware kan niet opmaken uit de code welke pagina actief is. Voeg hiervoor aria-current=“page” toe aan het actieve menu-item. Dit komt op meerdere pagina's voor.

Contact

De lijst met openingstijden is niet correct opgemaakt.Er zit een lijst (ul) direct in een andere lijst. Dit kan problemen geven voor het uitlezen door hulpsoftware.

Zoekresultaten

De koppenstructuur klopt niet helemaal. De resultaten hebben alle een h3-kop. Deze valt nu direct onder de h2-kop 'Filters'. Dit kan verwarrend zijn voor screenreadergebruikers die via koppen navigeren.

Wonen, verkeer en veiligheid

De lijsten met links zijn niet correct opgemaakt.De uitklapbare items onder de 'Toon meer' knop staan in een div-element in plaats van een ul-element. Dit kan problemen geven voor het uitlezen door hulpsoftware.

Gehandicaptenparkeerkaart aanvragen of verlengen

De h2 koppen van de vragen vallen binnen het button element. Hierdoor wordt de kopopmaak door hulpsoftware genegeerd. Dat zorgt er ook voor dat als er koppen staan binnen de vraag, zoals onder 'Welke gehandicaptenparkeerkaarten kan ik aanvragen?', de hierarchie niet meer klopt. Dit kan verwarrend zijn voor screenreadergebruikers. Zet de kop daarom buiten het button element.Dus andersom: <h2><button>Tekst</button></h2>. Dan komt de kop wel in de koppenlijst van de screenreader terecht.

Nieuwsbericht Werksaam Westfriesland helpt ondernemers om hun bedrijf klaar te maken voor de toekomst

De koppenstructuur klopt niet helemaal. Er staat een h3-kop 'Meer nieuws'. Deze valt onder de h2-kop 'Gratis deelname'. De koppen van de nieuwsberichten die onder 'Meer nieuws' vallen horen een niveau lager te zijn, maar zijn nu ook h3-niveau.

Bestuur en organisatie

De koppenstructuur klopt niet helemaal. De h3-kop 'Mis niets en meld je aan voor onze nieuwsbrief' valt onder 'Adviesraden' maar zou op zichzelf moeten staan.

PDF Uitvoeringsprogramma 2018-2022

De PDF heeft geen tags (codelaag) en daardoor is er voor hulpsoftware zoals screenreaders geen informatie beschikbaar om de PDF te interpreteren. Deze codelaag wordt aangemaakt in het bronbestand (bijvoorbeeld Word of Indesign) en moet van daaruit goed worden geëxporteerd. Wanneer de codelaag aanwezig is en aan de richtlijnen voldoet, kan hulpsoftware de inhoud juist weergeven voor de gebruiker, zoals ook bij goed opgebouwde HTML-pagina's het geval is.

Melding doen

Het select-element om de taal te kiezen heeft geen label. Daardoro is het voor hulpsoftware onduidelijk wat voor invoer dit is.

PDF Besluitenlijst

De koppen in de tabellen zijn niet als kopcel (th) opgemaakt. Hierdoor wordt de tabeldata niet op de juiste manier opgelezen door screenreaders.

1.3.2: Betekenisvolle volgorde
Hele sample

Uitkomst: Voldoende

1.3.3: Zintuiglijke eigenschappen
Hele sample

Uitkomst: Voldoende

1.3.4: Weergavestand
Hele sample

Uitkomst: Voldoende

1.3.5: Identificeer het doel van de input
Hele sample

Uitkomst: Onvoldoende

Contactformulier

Uitkomst: Onvoldoende

Afspraak maken

Uitkomst: Niet getoetst

Melding doen

Uitkomst: Onvoldoende

Contactformulier

De invoervelden voor persoonlijke informatie zoals naam en adres hebben geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Autofill maakt het invullen van formulieren voor veel gebruikers gemakkelijker, zoals voor mensen voor wie het invoeren van tekst veel tijd kost omdat dit via speciale hulpmiddelen gaat zoals bijvoorbeeld het aanwijzen van letters. Voeg de juiste ‘autocomplete’ attributen toe bij de invoervelden. Zie voor de volledige lijst https://www.w3.org/TR/WCAG21/#input-purposes

Afspraak maken

De invoervelden voor persoonlijke informatie zoals naam en adres hebben geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Zie ook de bevinding bij de pagina 'Contactformulier'.

Melding doen

De invoervelden voor persoonlijke informatie zoals naam en adres hebben geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Autofill maakt het invullen van formulieren voor veel gebruikers gemakkelijker, zoals voor mensen voor wie het invoeren van tekst veel tijd kost omdat dit via speciale hulpmiddelen gaat zoals bijvoorbeeld het aanwijzen van letters. Voeg de juiste ‘autocomplete’ attributen toe bij de invoervelden. Zie voor de volledige lijst https://www.w3.org/TR/WCAG21/#input-purposes

1.4 Onderscheidbaar
Success Criterium Uitkomst Bevindingen
1.4.1: Gebruik van kleur
Hele sample

Uitkomst: Voldoende

1.4.2: Geluidsbediening
Hele sample

Uitkomst: Niet van toepassing

1.4.3: Contrast (minimum)
Hele sample

Uitkomst: Onvoldoende

Afspraak maken

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

Afspraak maken

In de datepicker staat zwarte tekst op een donkerblauwe achtergrond. Deze tekst voldoet niet aan de mininmale contrasteis. De zwarte knoppen om tussen de maanden te navigeren voldoen net wel (3.0:1), maar het is raadzaam hiervan ook het contrast nog wat te verhogen. Zie screenshot 2. De hoge-contrast-variant van deze pagina biedt hier geen goed alternatief, omdat daarin ook meerdere onderdelen te weinig contrast hebben en sommige teksten zelfs geheel onzichtbaar zijn (witte tekst op witte achtergrond). Zie screenshot 3.

PDF Uitvoeringsprogramma 2018-2022

De titel met 'Uitvoeringsprogramma 2018-2022' op pagina 1 heeft te weinig contrast (donkerblauw en wit op blauw, 2.4:1 en 2.2:1). Op o.a. pagina 5 en 9 heeft deze titel een contrast van 1.2:1 (lichtgrijs op wit). Zorg voor een minimaal contrast van 4.5:1 voor tekst.

Melding doen

De lichtgrijze teksten in de invoervelden in het formulier hebben te weinig contrast (2.8:1).

1.4.4: Herschalen van tekst
Hele sample

Uitkomst: Voldoende

1.4.5: Afbeeldingen van tekst
Hele sample

Uitkomst: Onvoldoende

Aardgasvrij wonen

Uitkomst: Onvoldoende

Inwoners en het coronavirus

Uitkomst: Onvoldoende

Aardgasvrij wonen

Op deze pagina staat een infographic. Omdat deze tekst niet in de HTML staat kan deze niet aangepast worden aan de wensen van de gebruiker, zoals tekstvergroting. Voeg een alternatief in HTML toe.

Inwoners en het coronavirus

Op deze pagina staat een infographic. Omdat deze tekst niet in de HTML staat kan deze niet aangepast worden aan de wensen van de gebruiker, zoals tekstvergroting. Voeg een alternatief in HTML toe.

1.4.10: Reflow
Hele sample

Uitkomst: Onvoldoende

Inwoners en het coronavirus

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Wanneer je inzoomt op 200% of meer verdwijnen de toegankelijkheidsopties aan de zijkant (Readspeaker, Tekstgrootte en Contrast) en de knop met de Cookie instellingen. Wanneer je inzoomt tot 400% (bij 1280px breed en 1024px hoog) wordt een deel van het menu onzichtbaar. Hier kan ook niet heen gescrolld worden. Zie screenshot 5. Zorg via responsive bouwen dat alle content en functionaliteit tot 400% inzoomen beschikbaar en bedienbaar blijft.

Inwoners en het coronavirus

Bij de links naar informatie in andere talen moet bij inzoomen horizontaal gescrold worden. Er zijn hier witruimte tekens gebruikt voor de layout. Het is beter hier een standaard lijst van te maken.Zie screenshot 4.

1.4.11: Contrast van niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Contactformulier

Uitkomst: Onvoldoende

Contactformulier

De randen van de invoervelden van het formulier hebben de kleur #ddd. Deze kleur geeft een contrastwaarde van 1.4:1. Slechtzienden kunnen moeite hebben om te bepalen waar ze input kunnen geven. Verhoog het contrast van de randen van de interactieve elementen ten opzichte van de achtergrondkleur tot tenminste 3.0: 1.

In de footer hebben de iconen van Twitter en RSS (lichtblauw en oranje) te weinig contrast met de achtergrond. Ook voor grafische elementen zoals iconen is een minimum contrast vereist van 3.0:1.

1.4.12: Tekstafstand
Hele sample

Uitkomst: Voldoende

1.4.13: Content bij hover of focus
Hele sample

Uitkomst: Voldoende

2 Bedienbaar

2.1 Toetsenbordtoegankelijk
Success Criterium Uitkomst Bevindingen
2.1.1: Toetsenbord
Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De knop 'Cookie instellingen' werkt niet met het toetsenbord. De knop krijgt wel focus, maar opent niet de cookiebalk.

2.1.2: Geen toetsenbordval
Hele sample

Uitkomst: Onvoldoende

Zoekresultaten

Uitkomst: Onvoldoende

Zoekresultaten

Binnen de hoofdcontent komt de focus als eerste in het zoekveld terecht. Wanneer je dan verder wilt navigeren, kom je in een menu terecht van Readspeaker. Hier kun je niet meer uit komen zonder de pagina te verlaten. Zorg dat de focus direct doorgaat naar het volgende te verwachten element, dat is hier de zoekknop en daarna de resultaten. Zie screenshot 1.

2.1.4: Enkel teken sneltoetsen
Hele sample

Uitkomst: Voldoende

2.2 Genoeg tijd
Success Criterium Uitkomst Bevindingen
2.2.1: Timing aanpasbaar
Hele sample

Uitkomst: Niet van toepassing

2.2.2: Pauzeren, stoppen, verbergen
Hele sample

Uitkomst: Niet van toepassing

2.3 Toevallen en fysieke reacties
Success Criterium Uitkomst Bevindingen
2.3.1: Drie flitsen of beneden drempelwaarde
Hele sample

Uitkomst: Voldoende

2.4 Navigeerbaar
Success Criterium Uitkomst Bevindingen
2.4.1: Blokken omzeilen
Hele sample

Uitkomst: Voldoende

2.4.2: Paginatitel
Hele sample

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Uitkomst: Onvoldoende

PDF Besluitenlijst

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Het PDF-bestand heeft geen titel. Voor gebruikers van hulpsoftware is het voor de navigatie tussen documenten/webpagina’s belangrijk dat de titel duidelijk maakt waar ze zijn. Wanneer een pdf geen titel heeft wordt de bestandsnaam getoond, deze is niet altijd even duidelijk. Pas de titel aan in de Documenteigenschappen in Adobe PDF.

PDF Besluitenlijst

Het PDF-bestand heeft geen titel.

2.4.3: Focus volgorde
Hele sample

Uitkomst: Onvoldoende

Wonen, verkeer en veiligheid

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

Wonen, verkeer en veiligheid

Wanneer je de link 'Toon meer' activeert en dan verder navigeert (met de tab-toets), ga je verder in de volgende sectie in plaats van in de sectie waar je meer links wilde zien. Dit kan verwarrend zijn voor screenreader gebruikers, die niet weten dat ze nu in een ander onderwerp zitten. ZOrg dat de focus verder gaat bij de links die zojuist geopend zijn.

Melding doen

Wanneer je de cookie instellingen opent, gaat de focus niet naar de popup, maar gaat verder op de onderliggende pagina. De focus hoort meteen in de popup te komen. Onderdelen op de onderliggende pagina moeten geen focus kunnen krijgen zolang de popup geopend is.

2.4.4: Linkdoel (in context)
Hele sample

Uitkomst: Onvoldoende

Coronavirus

Uitkomst: Onvoldoende

Contactformulier

Uitkomst: Niet getoetst

Gemeenteraadsverkiezingen

Uitkomst: Onvoldoende

Coronavirus

Bovenaan de pagina onder het kopje 'Links' staan drie links zonder tekst. Gebruikers van hulpsoftware die lijsten opvragen van links weten zo niet waar deze links naar toe gaan. De links krijgen ook toetsenbordfocus zonder dat het duidelijk is waar ze voor zijn. Als deze links geen doel hebben is het beter ze te verwijderen.

Contactformulier

Opmerking: Het middelste icoon in de footer heeft als linktekst 'Flickr' maar gaat naar het nieuwsoverzicht.

Gemeenteraadsverkiezingen

Op de pagina staan meerdere lege links onderaan de lijsten. Gebruikers van hulpsoftware die lijsten opvragen van links weten zo niet waar deze links naar toe gaan. De links krijgen ook toetsenbordfocus, wat leidt tot onnodige aanslagen.

2.4.5: Meerdere manieren
Hele sample

Uitkomst: Voldoende

2.4.6: Koppen en labels
Hele sample

Uitkomst: Voldoende

2.4.7: Focus zichtbaar
Hele sample

Uitkomst: Onvoldoende

Contactformulier

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

Contactformulier

Op meerdere interactieve elementen in het overzicht is de focus niet zichtbaar, zoals op de Bewerken button en op invoervelden. Voeg een focussttijl toe, zoals omlijning.

Melding doen

De focus op de knoppen in de cookiemelding is niet zichtbaar. Daardoor lijkt het of deze niet gesloten/gebruikt kan worden. Dit geldt ook binnen de popup.

2.5 Input Modaliteiten
Success Criterium Uitkomst Bevindingen
2.5.1: Aanwijzergebaren
Hele sample

Uitkomst: Niet van toepassing

2.5.2: Aanwijzerannulering
Hele sample

Uitkomst: Voldoende

2.5.3: Label in naam
Hele sample

Uitkomst: Voldoende

2.5.4: Bewegingsactivering
Hele sample

Uitkomst: Niet van toepassing

3 Begrijpelijk

3.1 Leesbaar
Success Criterium Uitkomst Bevindingen
3.1.1: Taal van de pagina
Hele sample

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

PDF Uitvoeringsprogramma 2018-2022

Het document heeft geen taal gespecificeerd. Screenreaders lezen de pdf mogelijk niet in de juiste taal voor. Stel de juiste taal in bij de documenteigenschappen in Acrobat.

Melding doen

De pagina is ingesteld op Engels. Dit kan problemen geven voor screenreadergebruikers. Zet de taal in het html-element op Nederlands.

3.1.2: Taal van onderdelen
Hele sample

Uitkomst: Onvoldoende

Inwoners en het coronavirus

Uitkomst: Onvoldoende

Inwoners en het coronavirus

Onderaan de pagina staat een titel en paragraaf in het Engels zonder dat dit in de HTML is aangegeven (via het lang attribuut). Hierdoor lezen screenreaders het mogelijk niet goed voor.

3.2 Voorspelbaar
Success Criterium Uitkomst Bevindingen
3.2.1: Bij focus
Hele sample

Uitkomst: Voldoende

3.2.2: Bij input
Hele sample

Uitkomst: Voldoende

3.2.3: Consistente navigatie
Hele sample

Uitkomst: Voldoende

3.2.4: Consistente identificatie
Hele sample

Uitkomst: Voldoende

3.3 Assistentie bij invoer
Success Criterium Uitkomst Bevindingen
3.3.1: Foutidentificatie
Hele sample

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

Melding doen

Wanneer een of meerdere velden niet is ingevuld verschijnt de melding dat deze velden verplicht zijn. Dit is een algemene instructie en geen foutmelding. Geef aan wat er precies fout is gegaan, bijvoorbeeld:'Naam is niet ingevuld' of 'Telefoonnummer is niet geldig, deze moet 10 cijfers bevatten'.

3.3.2: Labels of instructies
Hele sample

Uitkomst: Voldoende

3.3.3: Foutsuggestie
Hele sample

Uitkomst: Voldoende

3.3.4: Foutpreventie (wettelijk, financieel, gegevens
Hele sample

Uitkomst: Niet van toepassing

4 Robuust

4.1 Compatibel
Success Criterium Uitkomst Bevindingen
4.1.1: Parsen
Hele sample

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Zoekresultaten

Uitkomst: Onvoldoende

Aardgasvrij wonen

Uitkomst: Onvoldoende

Contact

In het time element staan attributen zonder spatie er tussen. Dit kan problemen geven voor het uitlezen door hulpsoftware.

Zoekresultaten

Het id 'elastic-search-form' komt meer dan een keer voor op de pagina. Wanneer id’s meerdere keren op een pagina voorkomen kan hulpsoftware de code niet goed interpreteren.

Aardgasvrij wonen

Er zijn meerdere paragrafen die niet goed zijn genest: er zijn afsluittags zonder dat er openingstags zijn.

4.1.2: Naam, rol, waarde
Hele sample

Uitkomst: Onvoldoende

Contact

Uitkomst: Niet getoetst

Afspraak maken

Uitkomst: Onvoldoende

Melding doen

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

In de popup van de cookiemelding staat een knop om de popup te sluiten. Deze heeft geen naam, doordat deze is verborgen voor hulpsoftware met display:none. In deze popup wordt op verschillende plekken de status niet goed geupdate wanneer er interactie heeft plaatsgevonden. Dit geldt voor de aria-expanded waarde bij 'Niet noodzakelijk', het label 'meer weergeven' en de waarde van het label 'uitgeschakeld'.

Contact

Opmerking: Bij de openingstijden staan aria-labels op de <time> elementen. Aria-label wordt op deze elementen slecht ondersteund. Het is daarom beter om deze teksten op een andere manier er in te zetten. Op het <span> element staat een spelfout 'ara-label'. Deze wordt nu genegeerd door screenreaders.

Afspraak maken

In invoerveld om een product te kiezen heeft geen label. Hierdoor is het voor gebruikers van hulpsoftware niet duidelijk waar dit veld voor is. Dit is een span element met als role 'textbox'.

Melding doen

Er staat 3 links om in te loggen via andere diensten (Fixi, Google, Facebook). Dit zijn algemene div-elementen. Het is niet duidelijk voor hulpsoftware dat dit links zijn. Maar hier link elementen van.

4.1.3: Statusberichten
Hele sample

Uitkomst: Niet van toepassing

Sample met getoetste webpagina&#39;s

  1. Homepage - https://www.enkhuizen.nl/
  2. Coronavirus - https://www.enkhuizen.nl/coronavirus/
  3. Contact - https://www.enkhuizen.nl/contact/
  4. Contactformulier - https://prod.enkhuizen.nl/Ediensten/Contactformulier
  5. Afspraak maken - https://www.enkhuizen.nl/afspraak-maken/#select/
  6. Zoekresultaten - https://www.enkhuizen.nl/zoeken/?q=grof+vuil
  7. Wonen, verkeer en veiligheid - https://www.enkhuizen.nl/direct-regelen/wonen-verkeer-en-veiligheid
  8. Gehandicaptenparkeerkaart aanvragen of verlengen - https://www.enkhuizen.nl/direct-regelen/gezondheid-jeugd-en-ondersteuning/hulp-en-ondersteuning/gehandicaptenparkeerkaart-aanvragen-of-verlengen
  9. Actueel - https://www.enkhuizen.nl/actueel
  10. Nieuwsbericht Werksaam Westfriesland helpt ondernemers om hun bedrijf klaar te maken voor de toekomst - https://www.enkhuizen.nl/actueel/werksaam-westfriesland-helpt-ondernemers-om-hun-bedrijf-klaar-te-maken-voor-de-toekomst
  11. Bestuur en organisatie - https://www.enkhuizen.nl/bestuur-en-organisatie/
  12. PDF Uitvoeringsprogramma 2018-2022 - https://www.enkhuizen.nl/wp-content/uploads/2021/05/Uitvoeringsprogramma-2018-2022-Enkhuizen.pdf
  13. Gemeenteraadsverkiezingen - https://www.enkhuizen.nl/bestuur-en-organisatie/verkiezingen/
  14. Aardgasvrij wonen - https://www.enkhuizen.nl/direct-regelen/wonen-verkeer-en-veiligheid/milieu-en-duurzaamheid/aardgasvrij-wonen
  15. Inwoners en het coronavirus - https://www.enkhuizen.nl/coronavirus/inwoners-en-het-coronavirus/
  16. Melding doen - https://www.fixi.nl/#/sed/issue/new+map
  17. Evenementenvergunning - https://www.enkhuizen.nl/direct-regelen/ondernemen/vergunningen-ondernemers/evenementenvergunning/
  18. PDF Besluitenlijst - https://www.enkhuizen.nl/wp-content/uploads/2021/12/2021-11-23-Besluitenlijst.pdf

Webtechnologie

HTML,CSS,WAI-ARIA,JavaScript,PDF

Onderbouwing van de evaluatie

Gebruikte systemen tijdens het onderzoek:

Screenshots

zoekveld en readspeaker buttons
Figuur 1: Na de focus op het zoekveld zit de bezoeker vast in de Readspeaker interface
uitgeklapte kalender
Figuur 2: De zwarte knoppen op donkerblauwe achtergrond hebben te weinig contrast
uitgeklapte kalender in hoog-contrast modus
Figuur 3: Ook in de hoog-contrast modus hebben meerdere elementen te weinig contrast
horizontale scrollbar bij talenlijst
Figuur 4: Bij de talen moet in 2 richtingen gescrold worden wanneer je inzoomt
hoofdmenu ingezoomd
Figuur 5: Wanneer je op 400% bent ingezoomd zijn niet alle menu-items bereikbaar