Toegankelijkheidsonderzoek

Issues:
Content-audit digitale toegankelijkheid website Groenblauwe gebiedsgerichte aanpak

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Groenblauwe gebiedsgerichte aanpak
Datum 18 september 2023
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op ggagroenblauw.nl
  • Alle Pdf's op ggagroenblauw.nl
Buiten de scope van het onderzoek valt:
  • De pagina's op subdomein.domeinnaam.nl. 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: 29

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: In de header van elke pagina staat het logo van 'Groenblauwe gebiedsgericht aanpak'. Deze afbeelding heeft geen goede alternatieve tekst: 'GGA groen blauw logo'. De alternatieve tekst van een logo moet minimaal de naam van de organisatie bevatten, de volledige tekst van het logo moet terug komen in de alternatieve tekst.

Bevinding 2: Deze bevinding is mogelijk technisch van aard. Op nieuwsitem-pagina's, bijvoorbeeld op pagina www.ggagroenblauw.nl/nieuws/2514416.aspx staan een aantal afbeeldingen van een tag om aan te geven dat het hier om een categorie of tag gaat. Deze afbeeldingen hebben betekenis maar geen toegankelijk tekst alternatief. Het title attribuut wordt niet door elke browser en voorleessoftware combinatie goed gelezen. Bovendien wordt het het icoon door middel van het pseudo-element :before en de content property in de CSS op de pagina gezet. Op deze manier kan het zijn dat het icoon wegvalt, bijvoorbeeld voor mensen die een eigen CSS gebruiken, of wanneer de CSS niet geladen wordt. De content property is alleen geschikt voor het toevoegen van puur decoratieve content. Een oplossing kan zijn om het icoon in de html te plaatsen, bijvoorbeeld als img-element of svg met tekst-alternatief. Hetzelfde komt vaker voor in de website. Bijvoorbeeld op de agendapagina www.ggagroenblauw.nl/gebieden/vitale+peel/vitalepeel-agenda/default.aspx worden de icoontjes om aan te geven dat het om een herhalende afspraak gaat door middel van het pseudo-element :before en de content property in de CSS op de pagina gezet en ontbreekt een tekst-alternatief.

Bevinding 3: Op pagina www.ggagroenblauw.nl/nieuws/2514416.aspx staat een afbeelding met tekst met een leeg alt-attribuut. Deze afbeelding is niet puur decoratief en heeft daarom een alternatieve tekst nodig of zet de tekst ergens in de html om te voldoen aan 1.4.5

Bevinding 4: Op de voorpagina van in PDF-document 'GGA Vlijmens Ven, Bossche Broek en Moerputten Verkenning' staan een aantal decoratieve afbeeldingen. Deze afbeeldingen hebben geen beschrijving en zijn niet als artefact aangemerkt. Voor informatieve afbeeldingen geldt dat ze een beschrijving moeten hebben van de informatie die er in staat. De decoratieve afbeeldingen dienen als artifact te worden getagd.

Bevinding 5: De afbeelding met stappenplan op pagina 27 in PDF-document 'GGA Vlijmens Ven, Bossche Broek en Moerputten Verkenning' is geen decoratieve afbeelding. Deze afbeelding heeft geen beschrijving. Voor informatieve afbeeldingen geldt dat ze een beschrijving moeten hebben van de informatie die er in staat.

1.2 Op tijd gebaseerde media

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 6: Op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-actueel/2364344.aspx is er in de video op verschillende plaatsen tekst in beeld, bijvoorbeeld rond 00:08. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Zo kunnen mensen die de video niet kunnen zien en afhankelijk zijn van hulpsoftware zoals een schermvoorleessoftware niet weten wat er wordt getoond in de video. Zet deze en andere informatie in een transcript. Of maak gebruik van een extra audiospoor om ook te voldoen aan SC 1.2.5.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 7: Op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-actueel/2364344.aspx is er in de video op verschillende plaatsen tekst in beeld, bijvoorbeeld rond 00:08. Er ontbreekt een voiceover die vertelt wat er op het scherm staat. Zo kunnen mensen die de video niet kunnen zien niet weten wat er wordt getoond in de video. Laat de teksten in beeld uitspreken door een voiceover of maak gebruik van een audiodescriptie.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 8: Op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-visie/default.aspx zijn koppen opgemaakt met het strong-element, bijvoorbeeld 'Natura 2000-gebied: herstel van natuur centraal'. Het strong- en em-element zijn bedoeld om nadruk te geven aan een of enkele woorden, niet voor hele zinnen. Ook mogen deze elementen niet worden gebruikt als visuele kop, omdat ze niet dezelfde betekenis hebben als een kop (bijvoorbeeld h2 of h3).

Bevinding 9: Op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-projectkaart/default.aspx is een tabel met daarin kopcellen. In de laatste kopcel staat niets. Zorg dat elke kopcel een naam heeft die de bijbehorende cellen beschrijft of, als dit de eerste kolom betreft zorg dat hier geen kop (<th> wordt gebruikt maar een cel (<td>).

Bevinding 10: De PDF 'Visie Ulvenhoutse Bos en omgeving' is niet gecodeerd (van tags voorzien). Dit betekent dat er de documentstructuur niet is te bepalen. Er kan daardoor bijvoorbeeld niet worden bepaald wat koppen zijn, de alternatieve tekst bij afbeeldingen en wat de leesvolgorde is. Omdat tags ontbreken kan de PDF niet volledig onderzocht worden (alle succescriterium met betrekking tot de PDF code laag zoals semantische koppen en alt teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.

Bevinding 11: De PDF 'GGA Vlijmens Ven, Bossche Broek en Moerputten
Verkenning' is wel van een codelaag voorzien maar bijvoorbeeld op pagina 4 is de kop '1.1 Aanleiding' niet als kop gecodeerd evenals bijvoorbeeld op pagina 8 de kop '2. Gebiedsschets'. Bezoekers die gebruikmaken van schermvoorleessoftware kunnen aan de hand van een sneltoets of een koppenlijst door een PDF 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, et cetera.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 12: De PDF 'GGA Vlijmens Ven, Bossche Broek en Moerputten
Verkenning' is wel van een codelaag voorzien maar de volgorde in de code klopt niet waardoor de tekst niet goed voorgelezen wordt. Zorg er voor dat de volgorde in de code dezelfde volgorde als de tekst in het document aanhoudt.

1.3.5 Identificeer het doel van de input (Niveau AA)

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Uitkomst: Niet aanwezig

Bevinding 13: Onderstaande is geen (content) toegankelijkheidsprobleem, maar viel op: Op pagina ggagroenblauw.nl/Beheer/Formulierenmodule/2046710.aspx is een formulier waar de bezoeker onder andere het eigen e-mailadres en naam 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".

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Voldoende

Bevinding 14: Advies: Op pagina ggagroenblauw.nl/Beheer/Formulierenmodule/2046710.aspx staat een contactformulier. Als een bezoeker de hCaptcha verkeerd of niet invult, is dat bijna alleen zichtbaar doordat de achtergrond en tekst van kleur verandert. Het kleine rode icoontje met een witte x valt niet op. Zorg ervoor dat informatie niet van kleur afhankelijk is.

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 15: Het menu op elke pagina heeft een actief item, bijvoorbeeld op pagina ggagroenblauw.nl/contact/default.aspx het item 'Contact', is een witte tekst op een lichtgroene achtergrond (HEX #37A372). Deze tekst heeft een te laag contrast. De contrastverhouding is 3,2:1 waar dit 4,5:1 moet zijn.

Bevinding 16: Onder andere op de homepagina hebben links zoals de link 'Bekijk alle gebieden' is een witte tekst op een turquoise achtergrond (HEX #01968D). Deze tekst heeft een te laag contrast. De contrastverhouding is 3,7:1 waar dit 4,5:1 moet zijn.

Bevinding 17: Op de homepagina onder de 'Punten op de kaart' is een nummering met witte tekst op een groene achtergrond (HEX #018D54). Deze tekst heeft een te laag contrast. De contrastverhouding is 4,3:1 waar dit 4,5:1 moet zijn.

Bevinding 18: Op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-actueel/2364344.aspx hebben de links 'vorige item' en 'volgende item'. een groene tekst (HEX #018D54) op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 4,3:1 waar dit 4,5:1 moet zijn. Hetzelfde komt vaker voor in de website, bijvoorbeeld voor op pagina ggagroenblauw.nl/gebieden/ulvenhoutsebosenomgeving/ulvenhoutsebos-projectkaart/default.aspx onder 'Punten op de kaart' en op pagina www.ggagroenblauw.nl/documenten/default.aspx bij 'documenten' in het kruimelpad.

Bevinding 19: Op pagina www.ggagroenblauw.nl/nieuws/2514416.aspx staat een afbeelding met text. De blauwe tekst staat op de lichtblauwe achtergrond met witte wolken. Het kleurcontrast varieert tussen 2,0:1 en 2,8:0. Ook voor teksten in afbeeldingen gelden minimale eisen: 4,5:1 voor tekst onder 19px en 3,0:1 voor grote tekst. Controleer alle afbeeldingen met text erin.

Bevinding 20: Op pagina ggagroenblauw.nl/overgga/over/default.aspx staan onder 'Meer weten' groene blokken (HEX #01968D). Deze tekst heeft een te laag contrast. De contrastverhouding is 3,7:1 waar dit 4,5:1 moet zijn.

Bevinding 21: Op slide 1 in de PDF 'GGA Vlijmens Ven, Bossche Broek en Moerputten Verkenning' staan witte teksten op licht gekleurde achtergronden zoals de tekst 'Vlijmens Ven' op een roze achtergrond (HEX #D9AAC0). Deze tekst heeft een te laag contrast. De contrastverhouding is hier 2:1, waar dit minimaal 3:1 moet zijn. Ook de andere witte teksten op deze slide hebben een te laag contrast. Verderop in dit document komen meer teksten voor met te laag kleurcontrast. Zie bijvoorbeeld pagina 6 en 12: witte tekst op een foto, pagina 11: witte cijfers en letters op rood en meer. Zorg voor voldoende contrast tussen tekst en achtergrond.

1.4.5 Afbeeldingen van tekst (Niveau AA)

Informatie over succescriterium 1.4.5 Afbeeldingen van tekst

Uitkomst: Onvoldoende

Bevinding 22: Op pagina www.ggagroenblauw.nl/nieuws/2514416.aspx staat een afbeelding met tekst. Slechtzienden kunnen deze tekst niet aanpassen om de leesbaarheid te verhogen. De tekst op de afbeelding komt verder niet voor op de pagina. Plaats deze tekst daarom als HTML-tekst op de pagina.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 23: In het Cookie venster staat een blokje met een vinkje. Het contrast van het grijze blokje (HEX #D2D2D2) met de witte achtergrond is te laag. De contrastverhouding is hier 1,5:1, waar dit minimaal 3:1 moet zijn. Dit is mogelijk een technisch issue.

2. Bedienbaar

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 24: De PDF 'GGA Vlijmens Ven, Bossche Broek en Moerputten
Verkenning' heeft als documenttitel in de eigenschappen 'PowerPoint-presentatie', dat beschrijft het document niet. Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 25: Op pagina ggagroenblauw.nl/contact/default.aspx komt de link 'Contact opnemen' twee keer voor. Zorg dat links naar verschillende doelen unieke linkteksten hebben zodat duidelijk is waar de link naartoe gaat. Verander de eerste link bijvoorbeeld in 'Contactformulier'.

Bevinding 26: Advies. Het logo in de header van elke pagina is een link naar de homepagina. In het title attribuut van de link is een poging gedaan om het linkdoel duidelijk te maken met 'GGA groen blauw - Home'. Echter, deze tekst kan iets meer informatie geven, bijvoorbeeld 'Ga naar de homepagina'.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 27: De toegankelijke naam van de link naar de homepagina, het logo in de header op elke pagina, 'GGA groen blauw logo' bevat niet de naam 'Groenblauwe gebiedsgerichte aanpak' die visueel zichtbaar is. Zorg ervoor dat de visuele naam in de toegankelijke naam aanwezig is, liefst vooraan.

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 28: In de eigenschappen van de PDF 'Visie Ulvenhoutse Bos en omgeving' is de taal niet ingevuld. Zorg ervoor dat de taalinstelling overeenkomt met de taal die gebruikt wordt in de PDF.

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 29: Enkele afbeeldingen hebben geen goede naam. Zie hiervoor 1.1.1.

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-05-17 07:48:11 v2.4-011