Issues:
Audit digitale toegankelijkheid website Atlas Limburg
(Alleen de bevindingen)
Scope van de evaluatie
| Naam website | Atlas Limburg |
|---|---|
| Datum | 27 oktober 2023 |
| Scope van de website |
Binnen de scope van het onderzoek valt:
|
| Conformiteitsdoel | WCAG 2.1 niveau AA |
Uitgebreide toetsresultaten
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: De kaart op pagina https://portal.prvlimburg.nl/viewer/app/default is geplaatst binnen een img-element zonder alternatieve tekst. Voeg minimaal een beschrijvende alternatieve tekst toe binnen het alt-attribuut.
Bevinding 2: Op pagina https://portal.prvlimburg.nl/viewer/app/default staat het logo van de provincie Limburg. Deze afbeelding heeft geen alternatieve tekst. De alternatieve tekst van een logo moet minimaal de naam van de organisatie bevatten. Als de afbeelding als link dient kan er ook een beschrijvend linkdoel aan de alternatieve tekst toegevoegd worden.
Bevinding 3: Op pagina https://portal.prvlimburg.nl/viewer/app/default staan aan de linkerkant een rijtje met SVG-afbeeldingen (zoeken, printen, bookmark maken etc.). Deze afbeeldingen hebben betekenis maar de naam ontbreekt. Los dit op met een title-element met een alternatieve tekst als eerste child-element toe te voegen of door een aria-label op het a-element toe te voegen en de svg te verbergen voor hulpsoftware met aria-hidden. Dit geldt ook voor de afbeeldingen aan de bovenkant van de kaart (slepen, zoomen, volledig kaartbeeld etc.). Deze afbeeldingen hebben betekenis maar de naam ontbreekt. Er volgt dus geen beschrijving door screenreadersoftware. (De elementen worden overigens wel door de screenreader als knoppen geïdentificeerd, maar er wordt nu een generieke "schakelknop niet ingeschakeld" opgelezen.).
Bevinding 4: Op pagina https://portal.prvlimburg.nl/viewer/app/default verschijnt in het filterpaneel rechts een legenda onder het tabblad 'Legenda', indien men een filter kiest onder het tabje "Bibliotheek". Als men bijvoorbeeld "Economie en bedrijvigheid" aanvinkt, komen bedrijventerreinen op de kaart in beeld. De legenda is een afbeelding van tekst, zonder alternatieve beschrijving. Er is daardoor voor blinde bezoekers geen andere wijze om te weten wat er op deze afbeelding aanwezig is. Zorg voor een alternatieve manier van het presenteren van de legenda, bijvoorbeeld middels een lijst of tabel. Zie tevens SC 1.4.1 en 1.4.5
Bevinding 5: De X en - iconen om de dialoogvensters te sluiten op de hele website hebben geen alternatieve tekst. Daarnaast zijn deze iconen met CSS op de pagina geplaatst. Dit betekent dat wanneer bezoekers een eigen stylesheet gebruiken, bijvoorbeeld om het uiterlijk van de tekst op de pagina aan te passen, deze iconen niet meer zichtbaar zijn. Plaats daarom alleen puur decoratieve content met CSS op de website.
Bevinding 6: In het dialoogvenster 'Download bestanden' op pagina https://portal.prvlimburg.nl/viewer/app/default staan iconen waarmee bezoekers naar een vorige, volgende, eerste of laatste pagina kunnen navigeren. Deze iconen hebben geen alternatieve tekst, waardoor het voor bezoekers die gebruik maken van voorleessoftware niet duidelijk is waar deze elementen voor dienen.
Bevinding 7: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/app/default de optie 'Print kaartbeeld' kiezen verschijnt na een laadanimatie een afbeelding van een printvoorbeeld. Deze afbeelding heeft geen alternatieve tekst en is niet verborgen voor hulpsoftware. Voeg ofwel een alternatieve tekst toe binnen een alt-attribuut, of voeg een leeg alt-attribuut toe.
Bevinding 8: In PDF https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.pdf komen meerdere bevindingen op dit succescriterium voor:
- Op pagina 1 staat onderaan een logo van de organisatie. Dit logo heeft geen alternatieve tekst middels een toegankelijkheidstag, waardoor er "120413_IPO_BIJ12_Logo_Wide_RGB" voorgelezen wordt. Zorg dat het logo een tekstalternatief krijgt.
- Op de voorpagina staat een decoratieve afbeelding van klaprozen. Deze afbeelding heeft geen beschrijving en is 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.
- Op pagina 10 komt een figuur voor zonder alternatieve tekst.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 9: Op de pagina https://portal.prvlimburg.nl/viewer/app/default staan rechtsboven "Niet Ingelogd"/"Inloggen" en een Gebruikers icoontje. Dit icoon staat met een <img> tag binnen een <ul> (unordered list). Dit element moet in een <li> (list) tag staan.
Bevinding 10: Op pagina https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml worden koppen gebruikt die niet als koppen zijn opgemaakt, bijvoorbeeld "Broedvogelbestand vlakdekkend - 1e ronde 1990-1997". Gebruik een kop-element zoals het h2-element om deze teksten op te maken. Volg daarbij een logische, aflopende koppenstructuur. Dit probleem doet zich veelvuldig voor op de website.
Aanvullend advies: Het is gebruikelijk om de content van een pagina te laten beginnen met een H1; op een homepage hoeft deze niet in beeld te staan, en volstaat het om deze kop de naam te geven van de website. Voor een gewone pagina volstaat de titel van de pagina. De afwezigheid van een H1 is een best practice voor AA status en geen reden tot afkeur.
Bevinding 11: Het menu op onder andere pagina https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml is opgemaakt met een tabel-element. Aangezien dit geen tabel is, gaat het hier om presentatiedoeleinden en moet de tabelstructuur verborgen worden voor hulpsoftware. Beter is om hier helemaal geen tabelstructuur te gebruiken maar tabs (zie 4.1.2). Dit omdat deze elementen nu geen juiste rol hebben, en niet bedienbaar zijn met het toetsenbord. Een tabel voor presentatiedoeleinden komt op meerdere pagina's voor, waaronder op pagina https://portal.prvlimburg.nl/viewer/action/login?tocLayer=&debug=false&name=default&tocService=&version=.
Bevinding 12: Wanneer een bezoeker via de kaart een locatie aanklikt, verschijnt een dialoogvenster. In dit dialoogvenster staat meerdere keren de linktekst 'Codelijst' en 'Meer'. Wanneer bezoekers op 'Meer' klikken verschijnt nog een dialoogvenster. De informatie in dit venster is opgemaakt als tabel, met visuele kopaanduidingen, maar de tabelkoppen ontbreken. Zorg ervoor dat als er visuele koppen aanwezig zijn, deze ook programmatisch aanwezig zijn door tabelkoppen toe te voegen. Dit geldt ook voor de gegevens in het dialoogvenster 'Download bestanden'.
Bevinding 13: In het dialoogvenster 'Download bestanden' op pagina https://portal.prvlimburg.nl/viewer/app/default staan een select-element met visueel de naam 'Shape'. Dit element heeft geen label, waardoor het voor bezoekers die gebruik maken van voorleessoftware niet duidelijk wat hier geselecteerd moet worden. Zorg ervoor dat het voor alle bezoekers duidelijk is welke invoer van hen verwacht wordt.
Bevinding 14: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/app/default de optie 'Print kaartbeeld' kiezen verschijnt een dialoogvenster met meerdere invoerelementen. Deze elementen missen een toegankelijke naam om labels niet op de juiste manier zijn gekoppeld aan de invoerelementen. Zorg ervoor dat het voor alle bezoekers duidelijk is welke invoer van hen verwacht wordt.
Bevinding 15: Het invoerveld in de zoekfunctie op pagina https://portal.prvlimburg.nl/viewer/app/default mist een toegankelijke naam omdat het label niet op de juiste manier gekoppeld is. Zorg ervoor dat het voor alle bezoekers duidelijk is welke invoer van hen verwacht wordt.
Bevinding 16: Het is voor ziende bezoekers duidelijk dat de uitklapbare elementen in het filtermenu aan de rechterkant van pagina https://portal.prvlimburg.nl/viewer/app/default uitgeklapt zijn of niet. Deze informatie is echter niet beschikbaar voor hulpsoftware. Maak bijvoorbeeld een knop van de pijl om de categorie uit te klappen en geef het attribuut aria-expanded true of false mee.
Bevinding 17: In PDF https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.pdf komen meerdere toegankelijkheidsfouten voor:
- De PDF mist correcte semantische opmaak, zoals kop-elementen voor kopteksten en een correcte lijstopmaak.
- Er worden tabellen gebruikt voor de opmaak van content, waar dit niet gepast is. Dit is verwarrend voor bezoekers die gebruik maken van voorleessoftware. Verwijder de tabelopmaak op plaatsen waar geen daadwerkelijke tabel geplaatst is.
- Op pagina 2 van 22 in het Colofon wordt gebruik gemaakt van een tabel “Versiebeheer/wijzigingshistorie”. De koppen zijn goed gemarkeerd met een th-element. Echter, hulpsoftware kan de relatie tussen deze kop- en datacellen niet bepalen. De koppen moeten geassocieerd worden met de onderliggende cellen. Zorg dat de cellen een relatie hebben met de koppen. Dit kan bijvoorbeeld door het scope-attribuut in het th-element te plaatsen.
- Er worden regelmatig leestekens gebruikt om witruimte op te vullen. Bijvoorbeeld de inhoudsopgave op pagina 4 middels punten tussen de titels en de corresponderende pagina's. Er valt te lezen dat 1. Inleiding te vinden is op pagina 5. Schermleessoftware leest hier echter "één inleiding achtennegentig punt vijf".
Bevinding 18: De PDF op pagina https://portal.prvlimburg.nl/themas/landschap/data/Legenda_uitleg_Landschapskader_NML.pdf is niet gecodeerd en daardoor is er voor hulpsoftware (zoals voorleessoftware) geen informatie beschikbaar om de PDF te interpreteren. Omdat codes ontbreken kan de PDF niet volledig onderzocht worden (alle succescriteria met betrekking tot de PDF-codelaag zoals semantische koppen en alt-teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.
Bevinding 19: Advies: Op meerdere pagina's, zoals op pagina https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml, staan teksten die beter als opsomming opgemaakt kunnen worden om ze beter leesbaar te maken voor bezoekers die gebruik maken van bijvoorbeeld voorleessoftware, zoals de tekst onder 'Metadata auteur' in het tabblad 'Metametadata'.
1.3.4 Weergavestand (Niveau AA)
Informatie over succescriterium 1.3.4 Weergavestand
Uitkomst: Onvoldoende
Bevinding 20: Indien de weergavestand van pagina https://portal.prvlimburg.nl/viewer/app/default op staand (portretmodus) wordt getoond, gaat functionaliteit en informatie verloren.
Bij een weergave van 320px, een veel voorkomend mobiel formaat, dekt het filtermenu rechts het gehele oppervlak van de kaart. Tevens zijn links in het hoofdmenu zoals "Home" "Help" en "Contact" niet meer zichtbaar.
Bij weergave van 768px, een veel voorkomend tablet formaat, staan de links in het hoofdmenu over elkaar heen, zoals "Inloggen" en "Contact".
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 21: Op pagina https://portal.prvlimburg.nl/viewer/action/login?tocLayer=&debug=false&name=default&tocService=&version= staat een inlogformulier waar men gebruikersnaam & wachtwoord 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 het wachtwoord autocomplete="email".
1.4 Onderscheidbaar
1.4.1 Gebruik van kleur (Niveau A)
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevinding 22: Op pagina https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml onder het sub kopje "Dekking" staat groente tekst (HEX #2E8B57) zoals bijvoorbeeld "Omgrenzende rechthoek in decimale graden". Op het blote oog ziet het eruit als een stijlkeuze, maar dit betreft een uitklapbaar element. Slechtzienden en kleurenblinden kunnen hierdoor mogelijk niet herkennen dat er een interactieve functie is. Zorg ervoor dat deze elementen in de lopende tekst ook herkenbaar zijn aan minimaal één andere eigenschap, bijvoorbeeld door dit tekstueel te vermelden. Een alternatief zou zijn de uitklapfunctie van de tekst te verwijderen en dit middels een icoontje te regelen.
Bevinding 23: Op pagina https://portal.prvlimburg.nl/viewer/app/default verschijnt in het filterpaneel rechts een legenda onder het middelste tabje, indien men een filter kiest onder het tabje "Bibliotheek". Als men bijvoorbeeld "Economie en bedrijvigheid" aanvinkt, komen bedrijventerreinen op de kaart in beeld. De legenda bestaat dan uit een reeks gekleurde blokjes met beschrijving. Kleur is hier het enige visuele middel om informatie over te brengen. Slechtziende en kleurenblinde bezoekers kunnen de getoonde informatie niet onderscheiden. Zorg ervoor dat ieder item in de legenda en corresponderende elementen op de kaart op minimaal één andere visuele manier toegankelijk is. Zie tevens SC 1.1.1 en 1.4.5
Bevinding 24: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/app/default in het dialoogvenster 'Tekenen' bij 'Opslaan als bestand' de invoervelden niet invullen, krijgt de bezoeker alleen een foutmelding in de vorm van rood omrande invoervelden. Zorg ervoor dat kleur niet de enige vorm van informatie is voor bezoekers.
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 25: Op pagina's https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml en https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml staan bovenaan een reeks tabjes. Het contrast is te laag indien een tab met hover of toetsenbord de focus ontvangt, of het huidige tabblad is. Het contrast van de witte tekst (HEX# FFFFFF) op de lichtblauwe achtergrond (HEX #A9BECF) is te laag. De contrastverhouding is hier 1,9:1, waar dit minimaal 4,5:1 moet zijn.
Bevinding 26: In PDF https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.pdf wordt gebruik gemaakt van oranje tekst (HEX #CF6045) op een witte achtergrond (HEX #FFFFFF), bijvoorbeeld "2.4.1 Schema validatie". De contrastverhouding is hier 3,9:1, waar dit minimaal 4,5:1 moet zijn.
Bevinding 27: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat er meerdere tekstuele contrastproblemen voorkomen.
1.4.4 Herschalen van tekst (Niveau AA)
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Onvoldoende
Bevinding 28: Op pagina https://portal.prvlimburg.nl/viewer/app/default staat in de HTML-code bij meta name="viewport" de volgende instellingen: "maximum-scale=1" en "user-scale=0". Op mobiel of tablet kunnen bezoekers met bijvoorbeeld een Android browser daarom niet inzoomen. Laat deze instelling weg. Zie tevens SC 1.4.10
1.4.5 Afbeeldingen van tekst (Niveau AA)
Informatie over succescriterium 1.4.5 Afbeeldingen van tekst
Uitkomst: Onvoldoende
Bevinding 29: Op pagina https://portal.prvlimburg.nl/viewer/app/default verschijnt in het filterpaneel rechts een legenda onder het middelste tabje, indien men een filter kiest onder het tabje "Bibliotheek". Als men bijvoorbeeld "Economie en bedrijvigheid" aanvinkt, komen bedrijventerreinen op de kaart in beeld. De legenda bestaat dan uit een reeks gekleurde blokjes met beschrijving. Dit betreft echter onder "Bedrijfskavels 2022" één afbeelding, terwijl er 12 verschillende blokjes opgesomd staan. Het is belangrijk dat bezoekers tekst kunnen aanpassen, bijvoorbeeld om de tekstgrootte of regelafstand te vergroten. Met tekst in een afbeelding kan dit niet. Plaats deze informatie daarom bij voorkeur alléén, of in ieder geval óók als platte tekst op de pagina. Zie tevens SC 1.1.1 en 1.4.1
Bevinding 30: In PDF https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.pdf staat op pagina 21 van 22 een afbeelding met tekst, te weten "Figuur 1: Processchema levering natuurkwantiteit VRN". Slechtzienden kunnen deze tekst niet aanpassen om de leesbaarheid te verhogen. De enige tekst op de afbeelding komt op pagina 20 voor, maar niet alles. Blinden en slechtzienden missen hierdoor bijvoorbeeld de toelichting en een link naar een derde partij. Plaats deze tekst daarom ook als platte tekst op de pagina.
1.4.10 Reflow (Niveau AA)
Informatie over succescriterium 1.4.10 Reflow
Uitkomst: Onvoldoende
Bevinding 31: Indien bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% dan verdwijnt op pagina https://portal.prvlimburg.nl/viewer/app/default een deel van de functionaliteiten buiten beeld. De kaartlagen in het filterpaneel rechts zijn bijvoorbeeld niet meer toegankelijk en er is geen vervangende scrollbalk. De items in het hoofdmenu zitten over elkaar heen. Zorg ervoor dat de functionaliteiten van de pagina bewaard blijven. Zie tevens SC 1.4.4
Bevinding 32: Wanneer bezoekers met een schermgrootte van 1280x1024px inzoomen naar vanaf 200% dan verdwijnt op pagina https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml (en gelijksoortige pagina's) een deel van de blauwe menubalk bovenin uit beeld. Ter vervanging verschijnt een scrollbalk om de tekst te kunnen bekijken. Vermijd de scrollbalk in de leesrichting (horizontaal) en zorg ervoor dat de menubalk geheel zichtbaar blijft.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 33: Op pagina https://portal.prvlimburg.nl/viewer/app/default staat een horizontale slider met de naam "Transparantie". Het contrast van de grijze knop (HEX #D2D0D0) op de witte achtergrond (HEX #FFFFFF) is te laag. De contrastverhouding is hier 1,5: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 34: Op pagina https://portal.prvlimburg.nl/viewer/app/default staan in het filtermenu rechts een kolom lichtblauwe checkboxes (HEX #5FA2DD) op een witte achtergrond (HEX #FFFFFF). De contrastverhouding is hier te laag, teweten 2,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. Dit geldt ook voor de pijlen die aangeven dat de categorie uitgeklapt kan worden.
Bevinding 35: In onder andere het invoerveld in het dialoogvenster 'Tekenen' op pagina https://portal.prvlimburg.nl/viewer/app/default komen knoppen voor, waarin een lichtblauwe focusrand (HEX #DAE4EE) verschijnt bij focus. De contrastratio is hier 1,2:1 waar dat minimaal 3:1 moet zijn. Dit probleem doet zich in meerdere dialoogvensters voor.
Bevinding 36: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat focusranden om interactieve elementen onvoldoende contrast hebben met de achtergrond.
Bevinding 37: Wanneer een bezoeker met behulp van de tekenfunctie bijvoorbeeld een cirkel op de kaart tekent, is dat zichtbaar door een semi-transparant kleurvlak in een door de bezoeker gekozen kleur. Echter, doordat het vlak doorschijnend is is de contrastwaarde regelmatig te laag. Overweeg om een sterker contrasterende rand toe te voegen. Een vergelijkbaar probleem komt voor bij de andere meet- en tekenfuncties.
1.4.12 Tekstafstand (Niveau AA)
Informatie over succescriterium 1.4.12 Tekstafstand
Uitkomst: Onvoldoende
Bevinding 38: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/app/default de regelhoogte, alinea- en tekstafstand wijzigen naar de waarden zoals beschreven voor dit succescriterium, zijn de tabjes Bibliotheek, Legenda, Filteren en de knop Alle lagen uitschakelen niet meer (goed) leesbaar omdat content buiten beeld raakt. Zorg ervoor dat informatie beschikbaar en leesbaar blijft, ook wanneer bezoekers een eigen tekst opmaak toepassen.
1.4.13 Content bij hover of focus (Niveau AA)
Informatie over succescriterium 1.4.13 Content bij hover of focus
Uitkomst: Onvoldoende
Bevinding 39: Wanneer bezoekers pagina https://portal.prvlimburg.nl/viewer/app/default openen verschijnt er een dialoogvenster met de melding 'Wijziging bodeminformatie'. Wanneer bezoekers met de muis over de sluitknop hoveren verschijnt een tooltip met de tekst 'Close dialog'. Bezoekers kunnen deze content blijft niet staan tot de bezoeker de content zelf verwijderd, bezoekers kunnen niet met de muis over de aanvullende content bewegen en bezoekers kunnen de melding niet zelf weghalen zonder de focus of muishover te verplaatsen. Zorg ervoor dat deze drie dingen wél kunnen of verwijder de tooltip.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.1 Toetsenbord (Niveau A)
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevinding 40: Bezoekers die met het toetsenbord navigeren kunnen in de kaartapplicatie geen locatie op de kaart selecteren met het toetsenbord. Hierdoor hebben zij ook geen toegang tot de dialoogvensters die dan verschijnen, en tot de overige pagina's in de sample. Zorg voor minimaal één volwaardig alternatief, bijvoorbeeld een sitemap van alle pagina's op de website of een lijst onder de kaartapplicatie. Dit geldt ook voor de tekenfunctie.
Bevinding 41: Wanneer bezoekers de zoekfunctie openen kunnen zij selecteren waar zij op zoeken. Wanneer een bezoeker echter met het toetsenbord een andere optie selecteert, verandert de tekst automatisch terug naar ‘Adresgegevens’. Zorg ervoor dat bezoekers dit element ook goed met het toetsenbord kunnen bedienen.
Bevinding 42: Op pagina https://portal.prvlimburg.nl/viewer/app/default verschijnt het dialoogvenster "Wijziging Bodeminformatie". De sluitknop en de knop ‘Ok’ zijn niet bereikbaar en bedienbaar met het toetsenbord. Zorg ervoor dat alle interactieve elementen bereikbaar en bedienbaar zijn met het toetsenbord.
Bevinding 43: Op de pagina https://portal.prvlimburg.nl/viewer/app/default zijn meerdere elementen in de kaartapplicatie niet bereikbaar en bedienbaar met het toetsenbord, bijvoorbeeld de slider en de knop ‘Volledig kaartbeeld’. Zorg ervoor dat interactieve elementen zowel met de muis als met het toetsenbord bedienbaar zijn.
Bevinding 44: In het filtermenu onder het tabblad 'Bibliotheek' op pagina https://portal.prvlimburg.nl/viewer/app/default staan uitklapbare elementen die wel te bedienen zijn met de muis maar niet met het toetsenbord. Maak deze elementen op met bijvoorbeeld het button-element, en voeg een aria-expanded attribuut toe.
Bevinding 45: Op pagina https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml is het niet mogelijk om door de tabs bovenaan de pagina te navigeren. De tabs zijn opgemaakt in een tabel. De links op de pagina zijn wel bereikbaar. Een vergelijkbaar probleem komt voor op pagina https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml. Ook hier is navigeren door de tabs met het toetsenbord niet mogelijk.
Bevinding 46: Wanneer bezoekers pagina https://portal.prvlimburg.nl/viewer/app/default openen verschijnt er een dialoogvenster met de melding 'Wijziging bodeminformatie'. Voor bezoekers die met de muis navigeren is het mogelijk om met een drag and drop functie deze melding te verplaatsen op de pagina. Voor bezoekers die gebruik maken van het toetsenbord is dit niet mogelijk. Zorg ervoor dat interactieve elementen zowel met de muis of met het toetsenbord toegankelijk zijn of zorg voor een toegankelijk volwaardig alternatief. Dit probleem doet zich meerdere keren voor.
Bevinding 47: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat meerdere opties niet bereikbaar en bedienbaar zijn met het toetsenbord.
2.4 Navigeerbaar
2.4.1 Blokken omzeilen (Niveau A)
Informatie over succescriterium 2.4.1 Blokken omzeilen
Uitkomst: Onvoldoende
Bevinding 48: Op elke pagina ontbreekt een mechanisme om de herhalende content over te slaan. Dit kan opgelost worden 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.
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 49: De paginatitel op pagina https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml ontbreekt. Zorg dat er door middel van het title-element een beknopte titel aanwezig is die de inhoud van de pagina beschrijft. Een vergelijkbaar probleem komt voor op pagina https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml.
Bevinding 50: De paginatitel van pagina https://portal.prvlimburg.nl/viewer/action/login?tocLayer=&debug=false&name=default&tocService=&version= beschrijft wel het doel, maar niet de afzender van de pagina. Voeg ook de naam van de website toe aan de paginatitel.
Bevinding 51: De PDF https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.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.
Bevinding 52: De PDF op pagina https://portal.prvlimburg.nl/themas/landschap/data/Legenda_uitleg_Landschapskader_NML.pdf heeft wel een titel, maar de bestandsnaam wordt getoond bij openen. Zorg ervoor dat de titel wordt getoond bij openen.
2.4.3 Focus volgorde (Niveau A)
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevinding 53: Je kunt op de pagina https://portal.prvlimburg.nl/viewer/app/default met de tabtoets door de pagina navigeren nadat de pop-up is weggeklikt. Er is geen logische volgorde in de focus: deze begint namelijk bij de kaartlagen lijst, vervolgens naar de Transparantie slider en vervolgens kom je als laatste bij het hoofdmenu.
Zorg dat de focusvolgorde door webpagina's logisch is, wanneer men met het toetsenbord navigeert. Zie ook SC 2.4.7
Bevinding 54: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat de focusvolgorde op meerdere plaatsen onlogisch of storend is.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 55: Wanneer een bezoeker via de kaart een locatie aanklikt, verschijnt een dialoogvenster. In dit dialoogvenster staat meerdere keren de linktekst 'Codelijst' en 'Meer'. Wanneer linkteksten hetzelfde zijn, moeten ze ook naar dezelfde pagina verwijzen. Dit is nu niet het geval. Zorg ervoor dat linkteksten uniek zijn, door bijvoorbeeld de zichtbare tekst aan te passen of een screenreader-only tekst toe te voegen aan de linkteksten.
Bevinding 56: Advies: In de pop-up op pagina https://portal.prvlimburg.nl/viewer/app/default staat een link naar het Bodemloket. Dit betreft een externe pagina. Zorg dat aan de linktekst duidelijk is dat er naar een andere pagina genavigeerd wordt.
2.4.5 Meerdere manieren (Niveau AA)
Informatie over succescriterium 2.4.5 Meerdere manieren
Uitkomst: Onvoldoende
Bevinding 57: Er is maar één manier om alle pagina's binnen de website te vinden en dat is op pagina https://portal.prvlimburg.nl/viewer/app/default middels het filterpaneel rechts, hier moeten specifieke filters aangezet en een specifieke locatie op de (niet-toegankelijke) kaart geselecteerd worden, waarna een dialoogvenster met een linktekst verschijnt. Voeg nog minimaal één andere manier toe om de pagina’s te bereiken, zoals een zoekfunctie waarbij bezoekers op trefwoord kunnen zoeken of een sitemap.
2.4.7 Focus zichtbaar (Niveau AA)
Informatie over succescriterium 2.4.7 Focus zichtbaar
Uitkomst: Onvoldoende
Bevinding 58: Wanneer op pagina https://portal.prvlimburg.nl/viewer/app/ een onderdelen zoals het hoofdmenu of de knoppenreeks links de focus hebben, is dat niet zichtbaar. Dit is zeer storend gezien de tabvolgorde ook niet optimaal is, hierdoor is het voor toetsenbordgebruikers vrijwel onmogelijk op te weten waar op de pagina ze zich bevinden. Zorg ervoor dat bezoekers die met het toetsenbord navigeren weten welk element de focus heeft door een duidelijke focusrand toe te voegen. Zie tevens SC 2.4.3 Dit probleem komt op meerdere plekken voor, waaronder met de selectievakjes in het dialoogvenster 'Snapping'.
Bevinding 59: In het filtermenu aan de rechter zijkant van pagina https://portal.prvlimburg.nl/viewer/app/default krijgt een onzichtbaar element toetsenbordfocus na 'Alle lagen uitschakelen'. Wanneer een bezoeker nu met de pijltoets naar beneden gaat, verschijnt een sorteerfunctie. Zorg ervoor dat de oorspronkelijke knop om deze functie te openen zichtbaar is en voorzien is van een toegankelijke naam en rol.
2.5 Input modaliteiten
2.5.2 Aanwijzerannulering (Niveau A)
Informatie over succescriterium 2.5.2 Aanwijzerannulering
Uitkomst: Onvoldoende
Bevinding 60: Op pagina https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml staat een blauwe menubalk, waarvan de content direct verandert wanneer de bezoeker de muisknop indrukt. Links, knoppen en andere interactieve onderdelen mogen niet activeren op het moment dat je de muis indrukt maar pas bij het loslaten, tenzij dat essentieel is.
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 61: Op pagina https://portal.prvlimburg.nl/viewer/app/default 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 lang="nl". Dit probleem doet zich voor op alle getoetste pagina's.
3.1.2 Taal van onderdelen (Niveau AA)
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Voldoende
Bevinding 62: Let op: Op de website komen meerdere keren Engelstalige teksten voor, zoals 'Close dialog' en 'Loading...'. Let op dat zodra de taalinstelling van de pagina goed staat, deze teksten vertaald moeten worden.
3.2 Voorspelbaar
3.2.3 Consistente navigatie (Niveau AA)
Informatie over succescriterium 3.2.3 Consistente navigatie
Uitkomst: Onvoldoende
Bevinding 63: Het menu zoals deze op pagina https://portal.prvlimburg.nl/viewer/app/default wordt getoond, is niet aanwezig op de andere pagina's uit de sample: https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml en https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml.
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevinding 64: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/action/j_security_check geen of ongeldige informatie invullen en het formulier willen verzenden, verschijnt de melding 'Ongeldige inloggegevens'. De bezoeker moet een foutmelding krijgen wanneer een invoerveld niet goed is ingevuld of het formulier niet goed verzonden kan worden. De foutmelding moet beschrijven welke fout is gemaakt en wáár die is gemaakt.
Bevinding 65: Wanneer bezoekers op pagina https://portal.prvlimburg.nl/viewer/action/j_security_check ongeldige informatie invullen en het formulier willen verzenden, verschijnt een foutmelding en de velden worden automatisch geleegd. Als er een fout is gemaakt waardoor het formulier niet verzend, mag het niet zo zijn dat daardoor alle velden weer leeg zijn. Alle eerder ingevulde data moet in het formulier blijven staan.
Bevinding 66: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat het formulier gebruik maakt van HTML5 foutmeldingen, in plaats van eigen foutmeldingen. Deze foutmeldingen zijn kort zichtbaar en niet volledig.
3.3.2 Labels of instructies (Niveau A)
Informatie over succescriterium 3.3.2 Labels of instructies
Uitkomst: Onvoldoende
Bevinding 67: In het dialoogvenster 'Download bestanden' op pagina https://portal.prvlimburg.nl/viewer/app/default staan een select-element met visueel de naam 'Shape'. Dit element heeft geen visueel label, waardoor het voor meerdere doelgroepen onduidelijk is welke input hier van hen gevraagd wordt.
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 68: Meerdere interactieve elementen, zoals de knoppen in de kaartapplicatie, missen een toegankelijke naam. Deze bevindingen worden bij andere succescriteria verder toegelicht.
Bevinding 69: De X en - iconen om de dialoogvensters te sluiten op de hele website hebben zowel geen toegankelijke naam als geen rol. Zie ook succescriterium 1.1.1.
Bevinding 70: De kaartapplicatie bevat meerdere interactieve elementen die wel een naam hebben, maar geen rol. Hierdoor is het alsnog niet duidelijk wat dit element precies doet voor bezoekers die gebruik maken van onder andere hulpsoftware, zoals de opties 'Volledig kaartbeeld', 'Oppervlakte meten' en 'Afstand meten'. Zorg ervoor dat ieder interactief element een naam, rol en waar van toepassing een waarde en een status heeft.
Bevinding 71: De menuitems op onder andere https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml zijn nu niet herkenbaar als interactieve elementen, omdat er een toegankelijke passende rol mist. Maak deze elementen bijvoorbeeld op als tabs: https://www.w3schools.com/howto/howto_js_tabs.asp. Vermijd daarnaast liefst het gebruik van het title-attribuut om deze elementen een rol te geven.
Bevinding 72: In het filtermenu aan de rechterkant van pagina https://portal.prvlimburg.nl/viewer/app/default komen visueel selectievakjes voor, maar deze zijn opgemaakt als div met een role=button. Hierdoor wordt de staat van de selectievakjes niet goed voorgelezen. Gebruik zoveel mogelijk de juiste semantische elementen, die overeenkomen met wat visueel zichtbaar is. Daarnaast hebben deze elementen geen toegankelijke naam. Zorg ervoor dat ieder interactief een toegankelijke naam en rol heeft.
Bevinding 73: Het filtermenu aan de rechterkant van pagina https://portal.prvlimburg.nl/viewer/app/default is opgemaakt met een div-element met de role=treegrid. Deze rol is niet gepast voor dit onderdeel. Lees meer over een treegrid op: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/treegrid_role. Daarnaast bevat dit element nu child-elementen die niet zijn toegestaan.
Bevinding 74: De website maakt gebruik van de service Cyclomedia. Hierin komen meerdere toegankelijkheidsfouten voor, waaronder dat meerdere invoerelementen geen toegankelijke naam hebben.
Bevinding 75: Let op: Meerdere interactieve elementen op de website zijn genest binnen een div-element met de role=presentation. Dit zorgt voor toegankelijkheidsproblemen, zoals het niet bedienbaar zijn met het toetsenbord of het niet juist communiceren van een naam of rol. Plaats interactieve elementen daarom nooit binnen een element met role=presentation.
4.1.3 Statusberichten (Niveau AA)
Informatie over succescriterium 4.1.3 Statusberichten
Uitkomst: Onvoldoende
Bevinding 76: Wanneer de kaart op pagina https://portal.prvlimburg.nl/viewer/app/default geladen wordt verschijnt in de applicatie een laadanimatie (een blauwe laadbalk). Bezoekers die gebruik maken van hulpsoftware krijgen hier geen melding van. Zorg ervoor dat statusupdates ook beschikbaar zijn voor bezoekers die het scherm niet kunnen zien. Bij het laden van de hele pagina verschijnt ook een laadanimatie zonder status update. Dit probleem doet zich op meerdere pagina's voor.
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
- homepagina:
https://portal.prvlimburg.nl/viewer/app/default - pdf #1 voortgangsrapportage natuur:
https://portal.prvlimburg.nl/themas/natuur/data/GLP_Voortgangsrapportage_Natuur_v8.0.pdf - maasvallei:
https://portal.prvlimburg.nl/themas/cultuurhistorie/metadata/maasdal_nz_nl_contouren_ssl.xml - broedvogelbestand vlakdekkend:
https://portal.prvlimburg.nl/themas/natuur/metadata/broedvogels_vlakdek_ronde1_p.xml - infrastructuur:
https://portal.prvlimburg.nl/themas/landschap/metadata/lk_k1_infrastructuur_l.xml - pdf #2 legenda landschapskader:
https://portal.prvlimburg.nl/themas/landschap/data/Legenda_uitleg_Landschapskader_NML.pdf - Inloggen:
https://portal.prvlimburg.nl/viewer/action/login?tocLayer=&debug=false&name=default&tocService=&version= - gebiedinrichting VRN 2022:
https://portal.prvlimburg.nl/themas/natuur/metadata/gebiedinrichting.xml
Ondersteunende technieken
Bronnen
-
Evaluatiedocument WCAG 2.0
www.drempelvrij.nl/over-het-waarmerk -
Web Content Accessibility Guidelines (WCAG) 2.0 (Geautoriseerde Nederlandse vertaling)
www.w3.org/Translations/WCAG20-nl -
Website Accessibility Conformance Evaluation Methodology (WCAG-EM)
www.w3.org/WAI/eval/conformance -
Web Content Accessibility Guidelines (WCAG)
www.w3.org/WAI/intro/wcag -
How to Meet WCAG 2.1 Quick Reference
www.w3.org/WAI/WCAG21/quickref/
Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.