Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website Vlaams-Nederlandse Scheldecommissie

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Vlaams-Nederlandse Scheldecommissie
Datum 4 juni 2024
Scope van de website Binnen de scope van onderzoek valt:
Buiten de scope van het onderzoek valt:
  • 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: 64

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 onder andere pagina https://vnsc.eu/ staat het logo van Vlaams-Nederlandse Schelde Commissie. Deze afbeelding heeft geen alternatieve tekst. De alternatieve tekst van een logo moet minimaal de naam van de organisatie bevatten én aangeven dat het om een logo gaat. Omdat de afbeelding informatief is moet er een tekstalternatief aangeboden worden, dat is nu niet goed mogelijk doordat het aria-label "Ga naar de homepage" de inhoud van de link overschrijft. Het advies is om het aria-label te verwijderen of te vervangen door bijvoorbeeld een title-attribuut (met dezelfde tekst) en om het alt-attribuut in de afbeelding te vullen met een tekst als "Vlaams-Nederlandse Scheldecommissie (logo)".

Bevinding 2: Op pagina https://vnsc.eu/ en elke andere pagina waar de footer voorkomt, staat een SVG-afbeelding met het LinkedIn logo. Deze afbeelding heeft betekenis maar de naam ontbreekt. Los dit op met role=img en een title-element met een alternatieve tekst als eerste child-element toe te voegen.
Deze SVG-afbeelding met het LinkedIn logo staat ook op de pagina https://vnsc.eu/contact/ in het blok met de contactgegevens.

Bevinding 3: Op pagina https://laposta.nl/f/ss4orr0tggju staat het logo van de Vlaams-Nederlandse Schelde Commissie.
Deze afbeelding heeft geen (goede) alternatieve tekst. De alternatieve tekst van een logo moet minimaal de naam van de organisatie bevatten.
Dit komt ook voor op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu.

Bevinding 4: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu staat in de footer het logo van de Vlaams-Nederlandse Schelde Commissie. Deze afbeelding heeft geen alternatieve tekst. De alternatieve tekst van een logo moet altijd tenminste de naam van de organisatie en eventuele overige tekst in de afbeelding bevatten.
Dit komt ook voor op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu.

Bevinding 5: Het audiobestand (in figure-element) op pagina https://vnsc.eu/de-indrukwekkende-dialoog-tussen-annemieke-nijhof-en-de-schelde/ heeft geen alternatieve tekst. Voeg een beschrijving toe, bijvoorbeeld een beschrijvende titel, om dit probleem op te lossen.

Bevinding 6: De afbeeldingen met grafieken en lijndiagrammen op pagina https://vnsc.eu/agenda-voor-de-toekomst/droogte-kgt/ hebben een alternatieve tekst, maar hierin staat niet alle informatie die op de afbeeldingen te zien is. Voeg een toegankelijk alternatief (bijvoorbeeld een tabel of gewone tekst) toe op de pagina.

Bevinding 7: Op pagina https://vnsc.eu/over-de-vnsc/partners/ staan de logo's van partners. Er zijn hier een aantal logo's met de naam "logo + partnernaam", maar ook logo's met alleen de partnernaam. Ook zijn er logo's (bijvoorbeeld Kamer van Koophandel Antwerpen-Waasland Alfaport) waar niet de volledige naam in de alternatieve tekst staat (hier bv. alleen 'Alfaport Antwerpen'). Voeg dit ook aan alternatieve tekst toe om dit probleem op te lossen.

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 8: Op pagina https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ staat een video. Deze video heeft een automatisch gegenereerde ondertiteling. Op een aantal plekken staan onjuiste woorden. Ook ontbreekt de interpunctie waardoor de zinnen moeilijk te begrijpen zijn. Maak een goede ondertiteling.

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 9: Op pagina https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ staat een video waar een aantal logo's aan het eind in beeld komt. Als je dat niet kan zien mis je dat dit een video van een samenwerking van o.a. Agentschap Natuur&Bos is. Voeg deze informatie toe aan de audiodescriptie, of laat alle informatie uitspreken door de voice-over waardoor de audiodescriptie overbodig wordt.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 10: Op de pagina https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ is er in de video op verschillende plaatsen tekst in beeld, bijvoorbeeld rond 00:00 (Hedwige- en Prospergebied, Vis- en Vogelonderzoek één jaar na ontpoldering) en een aantal keer wordt de sprekende persoon aangekondigd. Er ontbreekt een voice-over 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 voice-over 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 11: Wanneer je op pagina https://vnsc.eu/scheldesymposium-2023-in-beeld/ op een foto klikt, wordt er een slider geopend. Hulpsoftware merkt niet op dat er een slider is geopend en wat dus het gevolg is van op de knop drukken. Los dit op met bv role=”alert”, zodat hulpsoftware weet dat er een slider wordt geopend.

Bevinding 12: Op pagina https://laposta.nl/f/ss4orr0tggju staat een inschrijfformulier voor de nieuwsbrief. In het formulier staat een invoerveld wat door middel van de stylesheet (CSS) uit beeld is geplaatst (met position: absolute en left: -5000px;). Dit veld is visueel en voor toetsenbordgebruikers verborgen, maar niet verborgen voor hulpsoftware. Dit veld heeft geen label en geen instructie, waardoor bezoekers niet weten dat zij dit veld kunnen negeren. Zorg ervoor dat het voor alle bezoekers altijd duidelijk is welke input gevraagd wordt of zorg dat het veld verborgen is voor alle bezoekers (bijvoorbeeld door "hidden" als type te gebruiken in plaats van "text'). Dit probleem heeft betrekking op SC 1.3.1 en SC 4.1.2.

Bevinding 13: In de nieuwsbrief op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu en https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu zijn visueel kopteksten aanwezig, bijvoorbeeld "Langetermijnperspectief Toegankelijkheid". De pagina is echter algeheel niet van koppen voorzien. Een goede koppenstructuur begint bij een kop op niveau 1 (middels het h1 element), opgevolgd door tussen/subkoppen van verschillende niveaus (h2, h3 etc). Dit is van belang voor bezoekers die de koppenstructuur opvragen om zo efficiënt door pagina's te navigeren, omdat schermleessoftware hiervoor de heading elementen gebruikt. Dit komt voor op meerdere pagina's, bijvoorbeeld op de Homepagina.

Bevinding 14: In de pdf op pagina https://23g-sharedhosting-vnsc.s3.eu-west-1.amazonaws.com/2019/05/23100705/ltp-n-advies-aan-vnsc.pdf zijn koppen aanwezig die niet als koppen zijn opgemaakt, bijvoorbeeld "Gezonde Schelde, van levensbelang". Gebruik de juiste code om deze koppen op te maken. De lijsten met letters en Romeinse cijfers zijn niet goed getagged, in de code staan nu zes lijsten met één punt in plaats van één lijst met in punt A een geneste lijst met drie punten.

Bevinding 15: De meeste content van de nieuwsbrieven op https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu en https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu wordt door middel van tabellen gestructureerd. Zonder gebruik van tabelkoppen (th-elementen) is dat toegestaan, zoals hier meestal het geval is. In sommige gevallen wordt de tabelinformatie gepresenteerd aan gebruikers van hulpsoftware. Op het moment dat dat gebeurd is de pagina niet meer goed te gebruiken. Het advies is dan ook om aan te geven dat de tabellen door hulpsoftware genegeerd moeten worden, dat kan bijvoorbeeld door op de gebruikte table-elementen het attribuut role="presentation" toe te voegen. Daardoor worden dan ook de tabelrijen en de tabelcellen van die ene tabel genegeerd, maar de koppen, teksten, afbeeldingen en links in die cellen worden dan niet genegeerd. Op dit moment wordt er dus niet volledig goed gebruik gemaakt van de uitzondering voor layout-tabellen en daarom is dit afgekeurd.

Bevinding 16: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu staan in de tekst koppen zoals "Maak kennis met de nieuwe secretaris van de Schelderaad". Die tekst zegt iets over de onderstaande tekst en moet daarom ook code krijgen om die relatie aan te geven. Normaal gesproken wordt hiervoor een koptekst gebruikt, maar door het gebruik van tabellen is dat niet zomaar toegestaan. Het advies is dan ook om de tekst en de kop in dezelfde tabelcel te plaatsen zodat er wel gewoon een element zoals h2 gebruikt mag worden.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 17: Op pagina https://vnsc.eu/ staan onder de koptekst "Volg de laatste ontwikkelingen" een aantal nieuwsberichten. staan blokken met een afbeelding en tag ('Nieuws'), een datum, kop. Een aantal van deze afbeeldingen heeft een alternatieve tekst. Als de blokken achter elkaar worden voorgelezen is het niet duidelijk bij welke kop de afbeelding hoort. Zet de koppen vooraan in de HTML-code en zet hierachter de afbeelding, datum en tag. Visueel mag deze indeling wel aangehouden worden. Dit komt ook voor op pagina https://vnsc.eu/actueel/.

Bevinding 18: Op de pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu staan blokken met een afbeelding, een kop en tekst. Als de blokken achter elkaar worden voorgelezen is het niet duidelijk bij welke kop de afbeelding hoort. Zet de koppen vooraan in de HTML-code en zet hierachter de afbeelding. Visueel mag deze indeling wel aangehouden worden.

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 19: Het logo op pagina https://vnsc.eu/ en alle overige pagina's waar de footer voorkomt, staat op een lichtgroene (HEX #F3F3F3)
achtergrond. De groene (HEX #5C9D43) letters van "Vlaams-Nederlandse" en "Commissie" hebben een te laag contrast op deze achtergrond, namelijk 2.9:1 waar dit 4,5:1 moet zijn.

Bevinding 20: Op pagina https://vnsc.eu/ staat een Nieuws link (die zich voordoet als een knop) onder de koptekst "Volg de laatste ontwikkelingen" met witte tekst op een oranje (HEX #DB640B) achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 3.6:1 waar dit 4,5:1 moet zijn. Een soortgelijk probleem zien we terug bij de Nieuws-knoppen op de afbeeldingen (iets eronder).
Hierdoor is voor slechtzienden en kleurenblinden de tekst niet of moeilijk waar te nemen. Gebruik een andere kleur voor de tekst of achtergrond waar het contrast te laag is.

Bevinding 21: Op pagina https://vnsc.eu/ staat onder Thema's een groene link (die zich voordoet als een knop) (HEX #54AD52) met de witte tekst "Natuurlijkheid". Deze tekst heeft een te laag contrast. De contrastverhouding is 2,8:1 waar dit 4,5:1 moet zijn. Dit blok met Thema's komt op alle pagina's voor.

Bevinding 22: Op pagina https://vnsc.eu/contact/ staat onder Algemene contactgegevens een telefoonnummer in het groen (HEX #40833E). Deze tekst heeft een te laag contrast. De contrastverhouding is 4,1:1 waar dit 4,5:1 moet zijn.
Ook van de beide e-mailadressen in dit zelfde blok is het contrast te laag.

Bevinding 23: Op pagina https://vnsc.eu/contact/ staat onder de header het broodkruimelpad. De 'Home' link heeft een grijze (HEX #C6C6C6) kleur op een witte achtergrond. De contrastverhouding is 1,7:1 waar dit 4,5:1 moet zijn. Gebruik een andere kleur voor de tekst of achtergrond waar het contrast te laag is. Dit komt voor op alle pagina's met een broodkruimelpad, bijvoorbeeld https://vnsc.eu/?s=toegankelijkheid, https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ en https://vnsc.eu/over-de-vnsc/.

Bevinding 24: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu staat onder de visuele kop "Langetermijnperspectief Toegankelijkheid" een tekst in het blauw (HEX #137CC1) (Met een grote groep stakeholders werkt de Vlaams-Nederlandse Scheldecommissie etc.) op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 4,4:1 waar dit 4,5:1 moet zijn. Een soortgelijk probleem zien we terug bij de knop met de witte tekst "Lees meer over het LTP-T", onder de tekst in dezelfde kleur blauw (HEX #137CC1).

Bevinding 25: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu staat onderaan de grijze (HEX #777777) tekst "Deze e-mail is verstuurd aan..." op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 4,4:1 waar dit 4,5:1 moet zijn. Dit komt ook voor op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu.

Bevinding 26: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu staat bovenaan onder het logo de blauwe (HEX #137CC1) tekst "Editie: oktober 2023" en "In de Vlaams-Nederlandse Scheldecommissie werken..." op een witte achtergrond.
Deze tekst heeft een te laag contrast. De contrastverhouding is 4,4:1 waar dit 4,5:1 moet zijn. Dit komt in de nieuwsbrief op meerder plekken voor, bijvoorbeeld bij de blauwe knoppen met witte tekst.

Bevinding 27: Op pagina https://vnsc.eu/?s=toegankelijkheid staan zoekresultaten. Er staan o.a. pagina's, nieuwsberichten en publicaties. Bij zowel de nieuwsberichten als de publicaties staat een grijze (HEX #C6C6C6) datum op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 1,7:1 waar dit 4,5:1 moet zijn.

Bevinding 28: Op pagina https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ staat onder het broodkruimelpad een datum in het grijs (#C6C6C6) op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 1,7:1 waar dit 4,5:1 moet zijn. Een soortgelijk probleem zien we terug op pagina https://vnsc.eu/scheldesymposium-2023-in-beeld/, https://vnsc.eu/publicaties/archief/gezonde-schelde-van-levensbelang/ en https://vnsc.eu/scheldemagazine-2023/.

Bevinding 29: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu staan boven de footer een aantal iconen met daaronder grijze (HEX #939598) tekst (onder andere Veiligheid, Toegankelijkheid en Natuurlijkheid, ook de regel copyright informatie). Deze tekst heeft op de witte achtergrond een te laag contrast. De contrastverhouding is 3,0:1 waar dit 4,5:1 moet zijn.

Bevinding 30: Advies: Als je in de cookiemeldingen op ‘Pas instellingen aan’ klikt, zie je de eerste checkbox-optie staan die je niet kan aanklikken. Deze is door te laag contrast niet goed leesbaar (het gaat om de tekst: Functioneel, noodzakelijk voor het functioneren van de website). Door het contrastprobleem is het mogelijk dat bezoekers cookie-info niet meekrijgen.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 31: Op pagina https://vnsc.eu/ en op de zoekpagina https://vnsc.eu/?s=toegankelijkheid staat een invoerveld om een zoekopdracht uit te voeren. De grijze (HEX #C6C6C6) rand van dit invoerveld, evenals het zoekicoon in het invoerveld, op de witte achtergrond is te laag. De contrastverhouding is hier 1.7:1, waar dit minimaal 3:1 moet zijn. Hierdoor is voor slechtzienden en kleurenblinden het onderscheid niet of moeilijk waar te nemen. Maak gebruik van een kleurencombinatie met voldoende contrast.

Bevinding 32: Advies: Op pagina https://vnsc.eu/ en alle andere pagina's waar deze header zich op bevindt staat een zoekicoon rechtsboven in de navigatiebalk. Het contrast van dit grijze (HEX #C6C6C6) zoekicoon op de witte achtergrond is te laag. De contrastverhouding is hier 1.7:1, waar dit minimaal 3:1 moet zijn. Hierdoor is voor slechtzienden en kleurenblinden het onderscheid niet of moeilijk waar te nemen. Maak gebruik van een kleurencombinatie met voldoende contrast.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 33: Op pagina https://vnsc.eu/ en alle andere pagina's waar deze header op staat, staat het hoofdmenu. Bezoekers die met het toetsenbord navigeren kunnen het submenu niet openen. Zorg ervoor dat alle interactieve elementen bereikbaar en bedienbaar zijn met het toetsenbord.

2.1.4 Enkel teken sneltoets (Niveau A)

Informatie over succescriterium 2.1.4 Enkel teken sneltoets

Uitkomst: Onvoldoende

Bevinding 34: Op pagina https://vnsc.eu/natuurontwikkeling-hedwige-prospergebied-boven-verwachting-snel/ staat een YouTube video die net helemaal goed ingesteld is en daardoor niet aan de eisen van dit succescriterium voldoet. Het is op dit moment mogelijk om de video te bedienen met enkele tekens zoals k voor pauzeren en m om het geluid te bedienen. Het advies is om de embedcode van de YouTube video aan te passen zodat die bediening uit staat. Zie https://developers.google.com/youtube/player_parameters#disablekb voor meer informatie over hoe het mogelijk is om met disablekb=1 de sneltoetsen uit te schakelen, de toetsenbord bediening blijft met die instelling wel gewoon werken.
Dit type probleem komt ook voor op pagina https://vnsc.eu/scheldemagazine-2023/ op de videospelers van Vimeo in het magazine moet ook de embedcode aangepast worden om te voldoen. Vimeo gebruikt keyboard: false om de sneltoetsen te deactiveren.

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Onvoldoende

Bevinding 35: Op pagina https://vnsc.eu/ ontbreekt een mechanisme om de herhalende content over te slaan. Bezoekers die de website met toetsenbord bedienen en/of hulpsoftware moeten op elke pagina langs dezelfde onderdelen gaan voordat ze bij de inhoud van de pagina zijn. Dit kan je oplossen door een link op de pagina te plaatsen (skiplink) die de focus verplaatst naar de eerste unieke inhoud van de pagina. Deze link moet de eerste link van de pagina zijn. Deze link mag standaard verborgen zijn voor bezoekers, maar moet zichtbaar worden als de focus er op komt wanneer met het toetsenbord wordt genavigeerd. Dit probleem zien we terug op een meerdere pagina's, bijvoorbeeld https://vnsc.eu/contact/, https://vnsc.eu/404 en https://vnsc.eu/webtoegankelijkheid/.

Bevinding 36: Op pagina https://vnsc.eu/?s=toegankelijkheid staat wel een skiplink (een mechanisme om naar een ander deel van de pagina te springen), maar de skiplink is niet het eerste dat focus krijgt. verplaats deze link zodat deze als eerste focus krijgt en de bezoeker via deze link de herhalende content zoals het menu kan overslaan. Verplaats deze link zodat deze als eerste focus krijgt en de bezoeker via deze link de herhalende content zoals het menu kan overslaan. Dit probleem zien we terug op een meerdere pagina's, bijvoorbeeld https://vnsc.eu/agenda-voor-de-toekomst/droogte-kgt/ en https://vnsc.eu/actueel/scheldenieuwsbrief/.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 37: De PDF op pagina https://23g-sharedhosting-vnsc.s3.eu-west-1.amazonaws.com/2019/05/23100705/ltp-n-advies-aan-vnsc.pdf heeft 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. Daarnaast staat in de eigenschappen ingesteld dat de Bestandsnaam wordt getoond. Zorg dat niet de bestandsnaam maar de Documenttitel wordt getoond.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 38: Het is voor bezoekers die met het toetsenbord navigeren niet altijd zichtbaar waar de focus zich bevindt in/uitklapnavigatie bovenaan op pagina https://vnsc.eu/ en alle andere pagina's waar deze navigatie/header zich op bevindt. De focus komt namelijk ook op de items van het submenu, terwijl deze niet uitgeklapt is.
Zorg dat de submenu items alleen focus krijgen, wanneer het menu is uitgeklapt en het submenu ook daadwerkelijk visueel zichtbaar is.

Bevinding 39: Wanneer je op https://vnsc.eu/ en elke andere pagina inzoomt naar de mobiele versie (vanaf 175%) en je met het toetsenbord navigeert, kom de focus niet direct op Actueel, Nieuwsbrief, Scheldemagazine enz. maar ga je eerst door alle links op de pagina achter het menu. Zorg dat de submenu items hier als eerste focus krijgen, wanneer het menu is uitgeklapt.

Bevinding 40: Op pagina https://vnsc.eu/scheldemagazine-2023/ is het in het magazine niet altijd een logische focus volgorde gebruikt. Op pagina 2 springt de focus van de eerste link onder "Inhoud" naar een icoon linksonder voordat de focus verder gaat in de lijst onder inhoud. Het advies is om er voor te zorgen dat de toetsenbordfocus en de visuele volgorde elkaar volgen.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 41: In de footer op pagina https://vnsc.eu/ (en elke andere pagina waar de footer voorkomt) staan links met de linktekst "Lees meer". Vermijd linkteksten als ‘Lees meer’, zulke teksten beschrijven het linkdoel niet. Zorg dat linkteksten duidelijk beschrijven waar de link naartoe gaat, bijvoorbeeld door de tekst aan te vullen met de titel van het bericht of pagina waarnaar gelinkt wordt. Als visueel duidelijk is waar de link bij hoort hoeft deze aanvullende tekst niet visueel zichtbaar te zijn.
Dit komt ook voor op pagina https://vnsc.eu/ onder "Agenda voor de toekomst" en "Projecten".
Een soortgelijk probleem zien we terug op pagina https://vnsc.eu/. Hier staat onder de koptekst h1 een groene knop met "Lees verder". Vul hier aan waar de link naar toe gaat (de Over de VNSC pagina). Visueel hoeft dit niet zichtbaar te zijn.

Bevinding 42: Op pagina https://vnsc.eu/actueel/ is een navigatie om tussen de pagina's te kunnen navigeren. De naam van de links luiden nu '1', '2', '3', etc. Voor ziende bezoekers is het duidelijk dat het hier gaat om paginanummers, maar bezoekers die het scherm niet kunnen zien, weten niet dat deze links naar volgende pagina's verwijzen. Vul de toegankelijke naam van deze links daarom aan met het woord 'pagina ' zodat het linkdoel voor screenreadergebruikers duidelijk is.
Een soortgelijk probleem zien we terug op pagina https://vnsc.eu/?s=toegankelijkheid en https://vnsc.eu/actueel/archief/.

Bevinding 43: In de footer op elke pagina staat een LinkedIn logo met link zonder toegankelijke naam. Omdat de link daarmee geen linkdoel heeft, is het voor blinden en slechtzienden die gebruikmaken van een screenreader niet duidelijk waar de link heen gaat. Voeg een toegankelijke naam waarin het linkdoel is omschreven toe om dit probleem op te lossen. Dit probleem zien we ook terug bij het LinkedIn logo met link op pagina https://vnsc.eu/contact/.

Bevinding 44: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu staat een afbeelding boven de koptekst "Toegankelijkheid van het Kanaal Gent-Terneuzen". In deze afbeelding zit een link naar pagina Meld je aan voor het Scheldesymposium. heeft geen toegankelijke naam. Omdat de link daarmee geen linkdoel heeft, is het voor blinden en slechtzienden die gebruikmaken van een screenreader niet duidelijk waar de link heen gaat. Voeg een toegankelijke naam waarin het linkdoel is omschreven toe om dit probleem op te lossen.
Het linkdoel van meerdere links op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu is ook niet goed te bepalen. Links als "Lees het interview" en "Meld je aan" hebben nu niet voldoende context met de bovenstaande content om te voldoen. Het advies is om de linktekst aan te vullen met teksten als "met Hans Mooren" en "voor de MONEOS-studiedag". Een link onder een kop heeft niet context met die bovenstaande kop.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 45: Wanneer je inzoomt en de mobiele versie van de website actief is komt er een hamburger menu icoon tevoorschijn. De focus op dit element is niet zichtbaar.
Zorg ervoor dat bezoekers die met het toetsenbord navigeren weten welk element de focus heeft door een duidelijke focusrand toe te voegen.

Bevinding 46: Op het moment dat een toetsenbordgebruiker probeert om door het magazine op pagina https://vnsc.eu/scheldemagazine-2023/ te navigeren is de positie van de toetsenbordfocus meerdere malen niet zichtbaar. De focus komt op onderdelen in de bedieningsbalk onderin zonder dat die balk in beeld komt. Dit komt ook voor door na het openklappen van het toegankelijkheidsmenu met de tabtoets het magazine in te tabben. De toetsenbordfocus zit dan soms verborgen achter het nog openstaande menu en dat is niet toegestaan.

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 47: Op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu ontbreekt een taalaanduiding van de inhoud van de pagina. Deze moet in de HTML-code worden opgegeven door middel van een lang-attribuut bij het HTML-element. Dit attribuut moet dan de landcode van de taal bevatten, in dit geval "nl".
Een soortgelijk probleem zien we terug op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu.

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 48: Op pagina https://vnsc.eu/404 is de paginatitel in het Engels: "Page not found". Vertaal de paginatitel naar het Nederlands. Een soortgelijk probleem zien we terug op pagina https://vnsc.eu/?s=toegankelijkheid (de zoekresultatenpagina). Ook hier is de pagina titel in het Engels, namelijk "You searched for toegankelijkheid - VNSC". Vertaal de Engelse teksten naar het Nederlands.

Bevinding 49: Wanneer je op pagina https://vnsc.eu/scheldesymposium-2023-in-beeld/ op een afbeelding klikt, wordt er een foto slider geopend. De afsluitknop van de slider heeft als naam 'Close'. Vertaal de Engelse teksten naar het Nederlands.

Bevinding 50: Op pagina https://vnsc.eu/scheldemagazine-2023/ staat een Nederlandstalig iFrame met een magazine. Er staan in de iFrame bijvoorbeeld twee knoppen om door de pagina's van het magazine te navigeren. De toegankelijke naam van deze knoppen zijn "Go to previous page" en "Go to next page".
Dit geldt overigens voor vrijwel alle knoppen in de iFrame. Vertaal de toegankelijke naam van deze knoppen naar het Nederlands.

3.2 Voorspelbaar

3.2.2 Bij input (Niveau A)

Informatie over succescriterium 3.2.2 Bij input

Uitkomst: Onvoldoende

Bevinding 51: Op pagina https://vnsc.eu/actueel/ staat een keuzelijst om het aantal resultaten aan te passen. Na het veranderen van die instelling wordt de pagina opnieuw geladen. Het is niet toegestaan om een pagina opnieuw te laden na het aanpassen van een keuzelijst als deze. Er zijn verschillende oplossingen mogelijk. Een daarvan is om het select-element te vervangen door een tweetal knoppen met namen als "Toon 6 resultaten per pagina". Een andere optie om een aparte knop toe te voegen om het veranderen van het aantal resultaten te bevestigen. Dit onderdeel heeft nu ook geen naam en voldoet om die reden ook niet aan succescriterium 4.1.2.

3.3 Assistentie bij invoer

3.3.2 Labels of instructies (Niveau A)

Informatie over succescriterium 3.3.2 Labels of instructies

Uitkomst: Onvoldoende

Bevinding 52: Op pagina https://vnsc.email-provider.eu/memberforms/subscribe/standalone/form/?a=6jsymewzpf&l=4orr0tggju staat een formulier waar bij de verplichte velden een * wordt getoond. Nergens binnen het formulier staat vermeld dat dit betekent dat dit veld verplicht is. Plaats een melding bovenaan, binnen het formulier, bijvoorbeeld: ‘Velden met een sterretje (*) zijn verplicht'.)

3.3.3 Foutsuggestie (Niveau AA)

Informatie over succescriterium 3.3.3 Foutsuggestie

Uitkomst: Onvoldoende

Bevinding 53: Op pagina https://vnsc.email-provider.eu/memberforms/subscribe/standalone/form/?a=6jsymewzpf&l=4orr0tggju staat een formulier waar je een e-mailadres kan invullen om je te abonneren op de nieuwsbrief. Wanneer je het veld leeg laat, verschijnt de melding (Dit veld mag niet leeg zijn (E-mailadres), maar het is niet duidelijk in welk formaat het e-mailadres ingevuld met worden. Zorg dat het voor bezoekers duidelijk is hoe zij dit formulierveld moeten invullen.

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 54: Op pagina https://vnsc.eu/ staat een zoekknop in de zoekbalk. Deze knop heeft geen toegankelijke naam. Het is voor screenreadergebruikers nu niet duidelijk wat de knop doet.

Bevinding 55: Op pagina https://laposta.nl/f/ss4orr0tggju staat een inschrijfformulier voor de nieuwsbrief. In het formulier staat een invoerveld wat door middel van de stylesheet (CSS) uit beeld is geplaatst (met position: absolute en left: -5000px;).
Dit veld heeft geen toegankelijke naam, waardoor bezoekers niet weten wat zij hier in moeten vullen. Zorg ervoor dat het voor alle bezoekers altijd duidelijk is welke input gevraagd wordt of zorg dat het veld verborgen is voor alle bezoekers (bijvoorbeeld door "hidden" als type te gebruiken in plaats van "text'). Dit probleem heeft betrekking op SC 1.3.1 en SC 4.1.2.

Bevinding 56: De link in de afbeelding (onder de visuele kop "Toegankelijkheid van het Kanaal Gent-Terneuzen") die leidt naar https://vnsc.eu/scheldesymposium-2023-meld-je-aan/ op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu heeft geen toegankelijke naam. Omdat de link daarmee geen linkdoel heeft, is het voor blinden en slechtzienden die gebruikmaken van een screenreader niet duidelijk waar de link heen gaat. Voeg een toegankelijke naam waarin het linkdoel is omschreven toe om dit probleem op te lossen. Ditzelfde probleem zien we ook terug bij de afbeeldingen in de nieuwsbrief op pagina https://vnsc.email-provider.eu/web/6jsymewzpf/prastca6du/4orr0tggju/s8vnhoyrvu en https://vnsc.email-provider.eu/web/6jsymewzpf/x2jdv46lcf/4orr0tggju/s8vnhoyrvu.

Bevinding 57: Op pagina https://vnsc.eu/contact/ is een Google Maps kaart via een iFrame geplaatst. Daar ontbreekt het title-attribuut. Plaats het title-attribuut in dit iFrame met een goede omschrijving van de inhoud van het iFrame, bijvoorbeeld "Kaart met locatie van het Uitvoerend Secretariaat van de VSNC".

Bevinding 58: In de footer op elke pagina staat een LinkedIn logo met link zonder toegankelijke naam. Omdat de link daarmee geen linkdoel heeft, is het voor blinden en slechtzienden die gebruikmaken van een screenreader niet duidelijk waar de link heen gaat. Voeg een toegankelijke naam waarin het linkdoel is omschreven toe om dit probleem op te lossen. Dit probleem zien we ook terug bij het LinkedIn logo met link op pagina https://vnsc.eu/contact/.

Bevinding 59: De paginering op pagina https://vnsc.eu/?s=toegankelijkheid en https://vnsc.eu/actueel/ bevat een inactieve link (‘vorige’) als de bezoeker zich op de eerste pagina bevindt. Dat de link inactief is, is visueel aan de kleur te herkennen, en voor bezoekers die navigeren via de muis doordat de muisaanwijzer niet verandert als deze naar de link gebracht wordt. Voor bezoekers die gebruik maken van voorleessoftware wordt dit echter als normaal werkende link voorgelezen, wat verwarrend kan werken. Zorg dat het ook voor hulpsoftware herkenbaar is als de link inactief is, dit kan door het attribuut disabled toe te voegen.

Bevinding 60: Op pagina https://vnsc.eu/actueel/ staat een keuzelijst om het aantal resultaten per pagina aan te passen. Dat select-element heeft nu geen naam. Dit probleem kan op meerdere manieren opgelost worden. Het advies is om een altijd zichtbaar label met de tekst "Aantal berichten" toe te voegen.

Bevinding 61: Op pagina https://vnsc.eu/scheldesymposium-2023-in-beeld/ hebben de knoppen (hierin staan afbeeldingen) geen toegankelijke naam die de functie van de knop duidelijk maakt. De eerste knop heeft helemaal geen toegankelijke naam (de afbeelding die hierin staat is voor hulpsoftware verborgen via een leeg alt-attribuut), de overige knoppen hebben een naam gekregen via de alternatieve tekst van de afbeelding (die wel beschrijft wat op de afbeelding te zien is).

Bevinding 62: Wanneer je op pagina https://vnsc.eu/scheldesymposium-2023-in-beeld/ op een foto klikt, wordt er een slider geopend. Met de '<' en '>' symbolen kun je door de foto's navigeren. Deze symbolen hebben geen toegankelijke naam. Het is voor screenreadergebruikers nu niet duidelijk wat de knop doet. Dit probleem zien we ook terug bij de slider met logo's op pagina https://vnsc.eu/over-de-vnsc/partners/.

Bevinding 63: Wanneer je op https://vnsc.eu/ en elke andere pagina inzoomt naar de mobiele versie (vanaf 175%) wordt de knop voor het mobiele menu actief. Deze knop heeft als aria-label="Toggle mobile menu". Dit beschrijft de functie van de knop niet goed genoeg. Kies een beschrijvende, Nederlandstalige naam voor dit aria-label. Bij deze knop wordt ook de staat van de knop (of deze ingevouwen of uitgevouwen is) niet voorgelezen, voeg hiervoor aria-expanded toe aan de knop. Een soortgelijk probleem komt voor bij de sluitknop wanneer het menu is uitgevouwen.

Bevinding 64: Op pagina https://vnsc.eu/over-de-vnsc/ staat een grijs blok met daarin een lijst.
In deze lijst staan links, beginnend met de link "Over de VNSC". Naast de link "Schelderaad en samenwerking" staat een knop om het submenu in- en uit te klappen. Deze knop heeft geen toegankelijke naam waardoor bezoekers niet weten wat de knop doet. Het is hier tevens een goed idee om een aria expanded attribuut toe te voegen, waarmee de status (in- of uitgevouwen) wordt voorgelezen door hulpsoftware.

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: 2025-01-29 19:31:35 v2.4-011