Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website Gemeente Hardenberg

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Gemeente Hardenberg
Datum 3 juni 2024
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op hardenberg.nl
  • Alle PDF's op hardenberg.nl
Buiten de scope van het onderzoek valt:
  • Alle pagina's op mijn.hardenberg.nl (inloggedeelte). Dit vereist een apart onderzoek.
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
  • Alle externe systemen en websites waar via het onderzochte domein met een link naar wordt verwezen.
Conformiteitsdoel WCAG 2.1 niveau AA

Uitgebreide toetsresultaten

Aantal bevindingen: 34

1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 1: Op pagina https://www.hardenberg.nl/vacatures staan diverse vacatures. Visueel ziet men een kalender icoon en de tekst 'tot en met [datum]'. Hieruit kan men opmaken dat dit om de uiterlijke sollicitatiedatum gaat. Het icoon wordt niet door schermleessoftware voorgelezen, waardoor de tekst verwarrend kan zijn voor diens gebruikers. Geef het icoon een alternatieve tekst, en plaats het niet middels CSS maar als afbeelding in HTML zodat het voorgelezen kan worden.

Bevinding 2: Op pagina https://www.hardenberg.nl/college/besluiten staat een groene smiley emoticon. Dit geeft opvolgende zin betekenis. Het icoon wordt niet door schermleessoftware voorgelezen. Geef het icoon een alternatieve tekst, en plaats het niet middels CSS maar als afbeelding in HTML zodat het voorgelezen kan worden.

Bevinding 3: Op pagina https://www.hardenberg.nl/cultuur/kunst/kunstwerken/hardenberg/janny-brugman-de-vries-kastanjehof staat platte tekst over een kunstenaar en haar werken. Er staat tevens meerdere afbeeldingen van de kunstwerken op de pagina, zonder alternatieve tekst. Zorg dat de afbeeldingen een toegankelijke omschrijving krijgen van wat er voor visuele bezoekers te zien is.

Bevinding 4: Op pagina https://www.hardenberg.nl/college/route29 staat het logo van Route 29. Het logo is niet voorzien van een alternatieve tekst. Zorg dat de tekst die in beeld komt tevens in een alt attribuut staat.

Bevinding 5: In de PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Gemeente/College_van_B_W/Collegebesluiten_2024/Collegebesluiten_april_2024/Besluitenlijst_b_w_vergadering_d.d._2_april_2024.pdf staat het logo van de Gemeente Harderberg. Het logo is niet van alternatieve tekst voorzien. Zorg voor een alternatieve tekst die de afbeelding omschrijft. Gezien het een logo betreft, tevens dit woord vermelden.

Bevinding 6: In de PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf staan op de voorpagina de logo's van Provincie Overijssel en Gemeente Hardenberg. De logo's zijn niet van alternatieve tekst voorzien. Zorg voor een alternatieve tekst die de afbeelding omschrijft. Gezien het een logo betreft, tevens dit woord vermelden.

1.2 Op tijd gebaseerde media

1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 7: Op pagina https://www.hardenberg.nl/college/route29 staan diverse videos voorzien van automatisch gegenereerde ondertiteling. Bijvoorbeeld de video "Deze mensen ontmoette de burgemeester tijdens de Route 29". De ondertiteling is geen juiste representatie van wat er gezegd wordt (rond 1:20: 'tieneke k hier AI schep kn hallo he Marie zijnen'). Voeg correcte ondertitels toe.

1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 8: Op pagina https://www.hardenberg.nl/vacatures staat de video "Werken bij de gemeente Hardenberg | Vacaturevideo gemeente Hardenberg". Er komt tekst in beeld, waarvan geen audiodescriptie of media-alternatief bestaat. Bijvoorbeeld rond 0:23 wanneer Amber Steenbergen, medewerker communicatie zich voorstelt. Zorg dat wat visueel zichtbaar is, tevens middels een extra audiospoor of middels een transcript bij de video (bijvoorbeeld in een onderstaand uitklapmenu) aanwezig is.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 9: Op pagina https://www.hardenberg.nl/vacatures staat de video "Werken bij de gemeente Hardenberg | Vacaturevideo gemeente Hardenberg". Er komt tekst in beeld, waarvan geen audiodescriptie of media-alternatief bestaat. Bijvoorbeeld rond 0:23 wanneer Amber Steenbergen, medewerker communicatie zich voorstelt. Zorg dat wat visueel zichtbaar is, tevens middels een extra audiospoor aanwezig is.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 10: Op pagina https://www.hardenberg.nl/vacatures staan diverse vacatures. Visueel ziet men een kalender icoon en de tekst 'tot en met [datum]'. Hieruit kan men opmaken dat dit om de uiterlijke sollicitatiedatum gaat. Het icoon wordt niet door schermleessoftware voorgelezen, waardoor de tekst verwarrend kan zijn voor diens gebruikers. Pas de tekst aan zodat het ook niet-visueel doel duidelijk is, of maak het icoon zichtbaar voor schermleessoftware en geef het een toepasselijke naam.

Bevinding 11: De PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Gemeente/College_van_B_W/Collegebesluiten_2024/Collegebesluiten_april_2024/Besluitenlijst_b_w_vergadering_d.d._2_april_2024.pdf heeft visueel de titel 'Besluitenlijst van de vergadering van burgemeester en wethouders'. Het bovenstaande woord 'Openbaar' is echter de enige tekst met een koptekst in het document. Zorg dat de titel tevens van een koptekst wordt voorzien.

Bevinding 12: De PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf bevat op de voorpagina een decoratieve afbeelding van een boom in een grasveld. Deze afbeelding heeft geen beschrijving en is niet als artefact aangemerkt. Voor informatieve afbeeldingen geldt dat ze een beschrijving hebben van de informatie die er in staat. De decoratieve afbeeldingen mogen hier als artefact worden getagd.

Bevinding 13: In de PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf staan visueel koppen en subkoppen, bijvoorbeeld '1. Inleiding' en '1.1 Aanleiding' op pagina 5. Zorg dat visuele koppen tevens als zodanig zijn aangemerkt in de toegankelijkheidstags. Bezoekers die gebruikmaken van schermvoorleessoftware 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. Een goede koppenstructuur begint bij een kopniveau 1 voor de titel van de pagina, kopniveau 2 voor de koppen, kopniveau 3 voor de tussenkoppen, etcetera.

Bevinding 14: In de PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf staan visueel een genummerde lijst op pagina 6. Zorg dat deze ook zodanig in de toegankelijkheidstags zijn opgemaakt, middels lijstitemtags (<LI>) genest in lijsttags (<L>). Een voorbeeld waar hier correct van gebruik is gemaakt is de ongenummerde lijst op dezelfde pagina.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 15: Op pagina https://www.hardenberg.nl/verhuizen/briefadres staat het lichtgrijze tekstvak "op deze pagina" met enkele skiplinks naar dat betreffende onderdeel van de pagina. Dit grijze vak staat echter pas na de hoofdcontent in de tabvolgorde, waardoor het hun afneemt voor blinde of slechtziende bezoekers die middels tabben door de pagina navigeren. Zorg dat het eerder de focus ontvangt, bijvoorbeeld na de paginatitel of eerste alinea. Dit probleem doet zich op meerdere pagina's voor.

1.3.5 Identificeer het doel van de input (Niveau AA)

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Uitkomst: Onvoldoende

Bevinding 16: Op pagina https://www.hardenberg.nl/melden/fraude-bijstandsuitkering is een formulier waar de bezoeker onder andere het eigen e-mailadres 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. Bijvoorbeeld voor e-mailadres autocomplete="email".
Een overzicht van de velden waarvoor het autocomplete-attribuut van toepassing is en de waarde die nodig is in dit attribuut, staat op de pagina: https://www.w3.org/tr/wcag21/#input-purposes.

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 17: Indien de focus staat op de link opgemaakt als knop 'Aanmelden nieuwsbrief' in de footer, bijvoorbeeld op pagina https://www.hardenberg.nl/, kleurt de achtergrond wit. Hierdoor is de witte tekst niet meer leesbaar. Kies een andere kleurcombinatie.

Bevinding 18: Bij hover over de de link opgemaakt als knop 'Aanmelden nieuwsbrief' in de footer, bijvoorbeeld op pagina https://www.hardenberg.nl/, is er een contrast van 1,6:1 tussen de witte tekst en de lichtroze achtergrond (HEX #F0BFD8). Een lichtere kleurcombinatie zou de tekst (beter) leesbaar maken voor slechtziende bezoekers.

Bevinding 19: In de PDF op pagina wordt lichtblauwe tekst (HEX #069EE0) gebruikt voor onder andere koppen en tekst bij afbeeldingen. Er is hier sprake van 3:1 contrast met de witte achtergrond, waar dit minimaal 4,5:1 behoort te zijn.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 20: Indien op pagina https://www.hardenberg.nl/contact de hover staat over de link 'een afspraak', kleurt de onderstreping lichtblauw (HEX #2878CD). Het contrast met de groene achtergrond (HEX #8DCF6A) is hier 2,4:1 waar dit minimaal 3:1 behoort te zijn.

Bevinding 21: Indien op pagina https://www.hardenberg.nl/over-deze-site de focus staat op de uitklapmenu's, kregen ze een lichtgrijze arcering (HEX #C6CBD4). Het contrast met de witte achtergrond is hier 1,6:1 waar dit minimaal 3:1 behoort te zijn. Dit probleem doet zich op meerdere pagina's voor, bijvoorbeeld op https://www.hardenberg.nl/college/besluiten.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 22: Op pagina https://www.hardenberg.nl/ staat een zoekveld. Op het moment dat direct na het invoeren van een zoekopdracht de zoekknop geactiveerd wordt werkt het zoeken niet. Deze functionaliteit is niet beschikbaar tijdens het laden van de lijst met suggesties die in beeld komen.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 23: De PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf bevat geen documenttitel in de eigenschappen. Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 24: Indien de focus staat op de zoekknop, bijvoorbeeld op pagina https://www.hardenberg.nl/contact, is dat niet zichtbaar. Zorg hier ook voor een goede focusrand.

Bevinding 25: Op pagina https://www.hardenberg.nl/vim-feedback komt na het tekstvak een element voor, met de tekst "Laat dit veld leeg aub". Dit is niet op de juiste manier onzichtbaar gemaakt, zorg dat het tevens uit de tabindex wordt gehaald zodat schermleessoftware het niet voorleest. Dit kan verwarrend zijn voor gebruikers van de voorgenoemde software.

Bevinding 26: Op pagina https://www.hardenberg.nl/college/besluiten staan uitklapmenu's. Indien uitgeklapt, is het onzichtbaar indien de focus op de sluitknop staat. Dit voor toetsenbordgebruikers zichtbaar maken helpt hun efficient door de pagina te navigeren. Dit probleem doet zich op meerdere pagina's met een dergelijk menu voor.

Bevinding 27: Indien de website wordt bekeken bij mobiele grote, ontstaat een enkel uitklapmenu rechtsboven. Indien uitgeklapt, is het onzichtbaar indien de focus op de sluitknop staat. Dit voor toetsenbordgebruikers zichtbaar maken helpt hun efficient door de pagina te navigeren.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 28: Op iedere pagina staat een ReadSpeaker widget plug in, bijvoorbeeld op pagina https://www.hardenberg.nl/. Er is een visueel label 'Lees voor' op een knop aanwezig zonder alternatieve tekst. De gehele widget bevat de tekst 'Laat de tekst voorlezen met ReadSpeaker webReader' in een title attribuut, maar dit wordt overschreven door het aria-label 'ReadSpeaker webReader: Luister met webReader'. Zorg dat de tekst 'Lees voor' ook in de alternatieve tekst voorkomt, zodat gebruikers van spraaksoftware de knop kunnen activeren. In nieuwere versies van de ReadSpeaker widget is dit probleem overigens opgelost, wij raden hier daarom een update aan.

3. Begrijpelijk

3.1 Leesbaar

3.1.1 Taal van de pagina (Niveau A)

Informatie over succescriterium 3.1.1 Taal van de pagina

Uitkomst: Onvoldoende

Bevinding 29: De PDF op pagina https://www.hardenberg.nl/fileadmin/Bestanden/Ruimtelijk_Domein/Bouwen_en_verbouwen/Voorgenomen_verkopen/Beeldkwaliteitsplannen/Bedrijventerrein_Katingerveld_-_Vastgesteld/Beeldkwaliteitplan.pdf bevat een taal in de eigenschappen. Zorg ervoor dat de taalinstelling overeenkomt met de taal die gebruikt wordt in de PDF, zodat schermleessoftware de teksten in toegankelijkheidstags op de juiste wijze voorleest.

3.2 Voorspelbaar

3.2.1 Bij focus (Niveau A)

Informatie over succescriterium 3.2.1 Bij focus

Uitkomst: Onvoldoende

Bevinding 30: Op alle pagina's van https://www.hardenberg.nl/ staat een zoekveld. Op het moment dat een gebruiker een zoekopdracht zoals "test" intypt en daarna met de pijl naar beneden één van de suggesties focus geeft en daarna op de tabtoets drukt mag die geselecteerde pagina niet geladen worden. Het indrukken van de tabtoets mag geen contextwijziging zoals het laden van een andere pagina tot gevolg hebben. Het gedrag van deze zoekbalk moet aangepast worden zodat de geselecteerde suggestie alleen geactiveerd na het klikken of het indrukken van de entertoets of spatiebalk.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 31: Op pagina https://www.hardenberg.nl/melden/fraude-bijstandsuitkering staan onder de vraag "Mogen wij uw gegevens weten? *" twee keuzevakjes. Na het invullen van één van die twee vakjes is het niet toegestaan om een invoer te verwijderen zonder de gebruiker hier met een tekstuele foutmelding over te informeren. Na het activeren van "Ja" mag het activeren van "Nee" dus niet tot gevolg hebben dat "Ja" of "Nee" gedeactiveerd worden, tenzij er een tekstuele foutmelding gegeven wordt. Het advies is om hier een set keuzerondjes (input type=radio) te gebruiken. Indien dat niet mogelijk is kan ook de vraag aangepast worden naar bijvoorbeeld "Ik wil graag anoniem melden", Bij die vraag is er maar één keuze noodzakelijk.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Uitkomst: Onvoldoende

Bevinding 32: Voor de zoekfunctie op pagina https://www.hardenberg.nl/ zijn zoekveld en zoekknop ondergebracht in een fieldset binnen een form. Een fieldset vergt echter tevens een legend om te functioneren. Voeg hier een legend toe.

Bevinding 33: Op alle pagina's van https://www.hardenberg.nl/ staat een zoekfunctie. Bij deze component is ARIA gebruikt. aria-live heeft een beperkt aantal geldige waarden. De hier gebruikte waarde "agressive" bestaat niet. Zie https://www.w3.org/TR/wai-aria-1.2/#aria-live voor meer informatie. Tijdens het invullen van tekst in dit invoerveld komen er suggesties in beeld. Dit gedrag moet aangekondigd worden en er moet aangegeven worden of er op dit moment wel of geen suggesties in beeld staan. Doordat de toetsenbordfocus tijdens het kiezen van een optie in het invoerveld blijft staan moet informatie over de op dit moment geselecteerde optie op een andere manier beschikbaar komen voor hulpsoftware. Om deze problemen op te lossen is het gebruik van role="combobox" met een role="listbox" in combinatie met het goed gebruik van de attributen aria-expanded, aria-controls en aria-activedescendant een optie. Op pagina https://www.w3.org/WAI/ARIA/apg/patterns/combobox/ staat meer informatie over het toegankelijk maken van een invoerveld met suggesties. Met name het voorbeeld op https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-none/ is van toepassing op deze situatie.

4.1.3 Statusberichten (Niveau AA)

Informatie over succescriterium 4.1.3 Statusberichten

Uitkomst: Onvoldoende

Bevinding 34: Op alle pagina's van https://www.hardenberg.nl/ staat een zoekfunctie. Bij het invoeren van een zoekopdracht zoals 'qw' komt er de foutmelding "Uw zoekopdracht leverde 0 resultaten op." in beeld. Die foutmelding geld als statusbericht en moet beschikbaar worden voor gebruikers van hulpsoftware. Dit probleem is apart vermeld omdat het niet de bedoeling is dat deze tekst gepresenteerd wordt in plaats van de lijst met suggesties.

Onderbouwing van de evaluatie

Het onderzoek is uitgevoerd op basis van de evaluatiemethode van het W3C, WCAG-EM. Dit gebeurt grotendeels handmatig door een steekproef te nemen. Voor een quickscan geldt dat we slechts delen uit deze methodiek gebruiken. Ondanks alle zorgvuldigheid en ervaring van de onderzoeker kan het voorkomen dat een probleem niet gesignaleerd is. Houd er rekening mee dat in een volgend onderzoek bepaalde onderdelen anders worden beoordeeld omdat technologieën en hulpsoftware worden doorontwikkeld. Bij het handmatig onderzoek wordt gebruik gemaakt van tools.

Steekproef getoetste webpagina's

Ondersteunende technieken

Bronnen

Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.

Geprint: 2024-11-22 07:20:50 v2.4-011