Issues:
Audit digitale toegankelijkheid website Metamorfoze
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Metamorfoze |
---|---|
Datum | 20 juni 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: In de footer van elke pagina staat een logo van de KB nationale bibliotheek. 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. Voeg een alt-attribuut toe aan dit img-element.
Bevinding 2: In de footer op elke pagina staat een afbeelding van een rode M op zijn kant. Deze afbeelding heeft geen tekst alternatief. Dit is een logo en heeft daarom een tekstalternatief nodig. Voeg een alt-attribuut aan de afbeelding toe met tekst alt=”Logo Metamorfose”.
Bevinding 3: In de footer op elke pagina staat een LinkedIn logo. Deze afbeelding heeft geen tekst alternatief en dit is ook niet nodig omdat de linktekst 'volg ons op LinkedIn' voldoende informatie geeft. Maar de afbeelding heeft wel een leeg alt-attribuut (alt="") nodig, zodat hulpsoftware weet dat de afbeelding genegeerd kan worden.
Bevinding 4: Bij de verplichte velden in het formulier op pagina metamorfoze.nl/contact staat een sterretje. Hulpsoftware leest dit niet altijd voor. Zorg voor een alternatieve tekst, of maak op een andere manier duidelijk welke velden verplicht zijn.
Bevinding 5: Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes staan rechts foto's die allemaal dezelfde toegankelijke tekst hebben 'Jubileumfeest Metamorfoze'. Deze tekst beschrijft de foto's niet. Geef een beschrijvende toegankelijke tekst of laat het alt attribuut leeg als het om een illustratieve afbeelding gaat.
Bevinding 6: Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/de-verschuiving-van-dienstverlening-van-analoog-naar-digitaal-archieven staat een afbeelding van een diagram. De alternatieve tekst van de afbeelding is een herhaling van de titel van het blog. Deze tekst beschrijft de afbeelding niet. Bezoekers die afhankelijk zijn van voorleessoftware krijgen twee keer dezelfde tekst te horen. Het lijkt er op dat het hier om een illustratieve afbeelding gaat, in dat geval kan een leeg alt attribuut meegegeven worden. Hetzelfde komt vaker in de website voor. Bijvoorbeeld op pagina metamorfoze.nl/kennis-onderzoek/lexicon heeft de foto bij het artikel over 'Autonoom verval' de toegankelijke tekst 'Autonoom verval'.
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 metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes wordt een video getoond. In de video komt gesproken woord voor, maar de ondertiteling ontbreekt. Zorg ervoor dat mensen met een auditieve beperking ook weten welke informatie in het audiospoor voorkomt door een ondertiteling aan de video toe te voegen. Hetzelfde komt vaker voor in de website, bijvoorbeeld bij de video op pagina metamorfoze.nl/kennis-onderzoek/lexicon onder 'Boekverpakken'.
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 metamorfoze.nl/kennis-onderzoek/lexicon onder 'Boekverpakken' is er in de video op verschillende plaatsen tekst in beeld, bijvoorbeeld rond 0:0 het logo van Metamorfose en de naam van de spreker. 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 scherm-voorleessoftware 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.
Bevinding 9: Advies: Op de pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes een video waar het logo 'Metamorfose 20 jaar' aan het begin en/of eind in beeld komt. Als je dat niet kan zien mis je dat dit een video van Metamorfose is. De tekst '20 jaar metamorfose' wordt wel uitgesproken in de video, daarom is dit niet af te keuren. Advies: Voeg deze informatie toe aan de audiodescriptie, of laat alle informatie uitspreken door de voiceover 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 pagina metamorfoze.nl/kennis-onderzoek/lexicon onder 'Boekverpakken' is er in de video op verschillende plaatsen tekst in beeld, bijvoorbeeld rond 0:0 het logo van Metamorfose en de naam van de spreker. 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.
Bevinding 11: Advies: Op de pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes een video waar het logo 'Metamorfose 20 jaar' aan het begin en/of eind in beeld komt. Als je dat niet kan zien mis je dat dit een video van Metamorfose is. De tekst '20 jaar metamorfose' wordt wel uitgesproken in de video, daarom is dit niet af te keuren. Advies: Laat alle informatie uitspreken door een voiceover waardoor de audiodescriptie overbodig wordt.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 12: Op pagina metamorfoze.nl/projecten is de paginering een lijst waarbij één lijstitem de rol='presentation' heeft gekregen. Daardoor is het geen geldig lijst item meer en mag niet in de lijst voorkomen. Zorg voor een goed opmaak van lijsten.
Bevinding 13: In de header van elke pagina is een zoekveld met daarnaast een knop met een vergrootglas. De toegankelijke naam van de knop is 'Toepassen'. Zorg er voor dat visuele informatie beschikbaar is voor hulpsoftware. 'Zoeken' is een betere naam.
Op pagina metamorfoze.nl/over-ons/medewerkers zijn koppen opgemaakt met het strong-element, bijvoorbeeld 'Louise Rahardjo'. Het strong-element is 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). Hetzelfde komt vaker voor in de website, bijvoorbeeld op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes bij de kop 'Jubileumboek van Irma Boom'. Zie ook pagina metamorfoze.nl/kennis-onderzoek/lexicon onder “Boekverpakken”.
Bevinding 14: Op de pagina metamorfoze.nl/kennis-onderzoek/kennisblog/de-verschuiving-van-dienstverlening-van-analoog-naar-digitaal-archieven staat onder de kop 'Lees het artikel' een aantal stukken tekst cursief. Hier is het em-element gebruikt, dat is niet de bedoeling. Het em-element is bedoeld voor het benadrukken van een woord of delen van een zin. Zorg dat de alinea via de stylesheet opgemaakt wordt of maak gebruik van het <i>-element.
Bevinding 15: Advies: Op veel pagina's bijvoorbeeld op pagina metamorfoze.nl/contact volgt op een kop van niveau 2 'Kruimelpad' een kop van niveau 1. Gebruik kopniveaus op een correcte volgorde. Bezoekers die gebruikmaken van scherm-voorleessoftware 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, et cetera. Visueel mag de titel van de pagina niet bovenaan staan.
Bevinding 16: In het pdf-document “Hanteringsinstructies” komen de visuele koppen niet overeen met de codes. Zo is de titel op het eerste blad is opgemaakt met een alinea-element. Op pagina 2 staat een kop 3 met een alinea eronder. Beide zijn opgemaakt met h3-element. Op pagina 5 staat een kop, gevolgd door tussenkopjes, alinea’s en opsommingen. Alleen opsommingen zijn correct opgemaakt. Alle kopteksten zitten in alinea-elementen. Op pagina 4 staat een opsomming die over twee pagina’s loopt. In de codes bestaat deze opsomming uit twee losse lijsten. Hierdoor wordt een andere informatiestructuur aan een blinde bezoeker voorgelezen.
1.3.2 Betekenisvolle volgorde (Niveau A)
Informatie over succescriterium 1.3.2 Betekenisvolle volgorde
Uitkomst: Onvoldoende
Bevinding 17: Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog staan blokken met een afbeelding en een kop. 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. Opmerking: Op pagina metamorfoze.nl/over-ons/medewerkers wordt dezelfde volgorde aangehouden maar aangezien da afbeeldingen de naam van de medewerker bevat is hier geen onduidelijkheid. Toch is het gebruikelijk om de kop voor de afbeelding te plaatsen.
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 18: Op pagina metamorfoze.nl/contact 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 19: Op de homepagina onder nieuws hebben links die al eens bezocht zijn een grijze kleur tekst (HEX #808080) op een witte achtergrond. Deze tekst heeft een te laag contrast. De contrastverhouding is 4,0:1 waar dit minimaal 4,5:1 moet zijn. Deze grijze kleur komt op meerdere plaatsen in de website voor, bijvoorbeeld in kruimelpaden zoals op pagina metamorfoze.nl/over-ons/toegankelijkheid de links 'Metamorfose' en 'Over ons' en in de paginering op pagina metamorfoze.nl/projecten de link '7'.
Bevinding 20: Op de homepagina staat rode tekst (HEX #DB001B) op lichtgrijze achtergrond (HEX #E2E2E2), bijvoorbeeld de tekst 'Voorstel indienen?'. Deze tekst heeft een te laag contrast. De contrastverhouding is 4,0:1 waar dit minimaal 4,5:1 moet zijn.
Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog staan blokken met foto's en links. De kleur van de rode achtergrond onder de witte tekst is afhankelijk van de foto er onder. Daardoor heeft bijvoorbeeld de tekst 'De verschuiving van dienstverlening ...' op de roze achtergrond (HEX #E23248) een te laag contrast. De contrastverhouding is 4,4:1 waar dit minimaal 4,5:1 moet zijn.
1.4.4 Herschalen van tekst (Niveau AA)
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Onvoldoende
Bevinding 21: Op elke pagina staat in de HTML-code bij meta name="viewport" de volgende instellingen: "minimum-scale=1.0" en "maximum-scale=1.0". Op mobiel of tablet kunnen bezoekers daarom in veel gevallen niet inzoomen. Laat deze instelling weg.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 22: Op pagina https://www.metamorfoze.nl/contact hebben de grijze randen (HEX #E2E2E2) van de invoervelden een te laag contrast met de witte achtergrond. De contrastverhouding is hier 1,3:1, waar dit minimaal 3,0:1 moet zijn.
Bevinding 23: Aan het begin en het eind van de video op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succesis het logo 'Metamorfose 20 jaar' rood op zwartwit video achtergrond afgebeeld. Met name de transparante 20 jaar heeft een te laag contrast met de achtergrond. De contrastverhouding is op sommige plaatsen minder dan 2,0:1, waar dit minimaal 3,0:1 moet zijn.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.1 Toetsenbord (Niveau A)
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevinding 24: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staan begrippen. Als op een begrip met een muis wordt geklikt, opent een verborgen sectie met uitleg. Deze functionaliteit is niet beschikbaar voor bezoekers die de website met alleen toetsenbord navigeren. Zorg ervoor dat alle interactieve elementen met het toetsenbord te bedienen zijn.
2.1.2 Geen toetsenbordval (Niveau A)
Informatie over succescriterium 2.1.2 Geen toetsenbordval
Uitkomst: Onvoldoende
Bevinding 25: Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes staan foto’s in de rechter kolom die als links fungeren naar de grote weeergave van de foto. Als de bezoeker de foto fullscreen ziet, is er geen mogelijkheid meer om terug naar de website te keren. De website moet worden afgeloten om uit deze toetsenbordval te komen. Zorg voor een sluitknop of laat de afbeeldignen met een Exc toets sluiten.
2.2 Genoeg tijd
2.2.1 Timing aanpasbaar (Niveau A)
Informatie over succescriterium 2.2.1 Timing aanpasbaar
Uitkomst: Onvoldoende
Bevinding 26: Het formulier op pagina metamorfoze.nl/contact maakt alleen gebruik van HTML5-veldcontroles. Deze foutmeldingen blijven te kort staan. Een foutmelding moet blijven staan, zodat te allen tijde duidelijk is wat de fout was, tot deze goed wordt verbeterd. Zorg voor zelfgemaakte foutmeldingen die net zo lang in beeld blijven totdat de bezoeker ze afsluit.
2.4 Navigeerbaar
2.4.1 Blokken omzeilen (Niveau A)
Informatie over succescriterium 2.4.1 Blokken omzeilen
Uitkomst: Onvoldoende
Bevinding 27: De homepagina bevat wel een skiplink (een mechanisme om naar een ander deel van de pagina te springen), maar de skiplink werkt niet. Zorg dat bezoekers direct naar de hoofdinhoud van een pagina kunnen springen, zonder dat zij daar extra handelingen voor moeten uitvoeren.
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 28: In de metadata van beide pdf-documenten is de titel niet correct aangegeven. In het document “Snelgids beoordeling offertes(..)” luidt de titel “AB_2022.1_eindversie.pdf”. In het document “Hanteringsinstructies Archieven en Collecties” is de titel niet ingevuld. De titel dient een korte beschrijving van de inhoud van het bestand te zijn. Voor gebruikers van hulpsoftware is het voor de navigatie tussen documenten belangrijk dat de titel duidelijk maakt waar ze zijn. Dit kan worden ingesteld via de bestandseigenschappen. Hier moet ook worden ingesteld dat de titel wordt getoond in de titelbalk en niet de bestandsnaam, zoals nu het geval is.
2.4.3 Focus volgorde (Niveau A)
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevinding 29: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staan begrippen die als interactieve elementen fungeren om de zichtbaarheid van verborgen content te schakelen. Deze elementen maken geen deel van de focusvolgorde. Zorg ervoor dat deze elementen ook focus krijgen.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 30: Op de homepagina staat een hoofdartikel met zichtbare tekst: 'Nu online 150 jaar landbouwarchief Archief Wilhelminapolder te zien via Zeeuws Archief'. De tekst die voorleessoftware leest is 'Paarden in de wei van de Wilhelminapolder, door Multicolor, Rotterdam, ca 1960. Zeeuws Archief, Koninklijke Maatschap De Wilhelminapolder, toegang 250, inv. nr 1081. Nu online 150 jaar landbouwarchief Archief Wilhelminapolder te zien via Zeeuws Archief.' Hierdoor is het linkdoel niet duidelijk voor bezoekers die afhankelijk zijn van voorleessoftware. Zorg er voor dat een linktekst het linkdoel kort en duidelijk weergeeft. Hetzelfde probleem komt vaker in de website voor, bijvoorbeeld op pagina metamorfoze.nl/kennis-onderzoek/kennisblog bij de blokken met een foto die linken naar blogposts.
Bevinding 31: Op de homepagina staat onder het artikel 'Ethanol op de lijst van CMR-stoffen – Hoe houden we het veilig?' een link met de toegankelijke linktekst 'Lees verder'. Vermijd linkteksten als ‘Lees meer’ en ‘Klik hier’, 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.
Bevinding 32: Op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes zijn de foto's aan de rechterkant links naar het volledige fotobestand. Elke foto heeft dezelfde linktekst 'Jubileumfeest Metamorfoze' die het linkdoel onvoldoende beschrijft. Geef een duidelijke en unieke linktekst waarin staat dat een afbeelding wordt geopend met informatie over de afbeelding.
2.4.5 Meerdere manieren (Niveau AA)
Informatie over succescriterium 2.4.5 Meerdere manieren
Uitkomst: Onvoldoende
Bevinding 33: Er is maar één manier om bijvoorbeeld de pagina metamorfoze.nl/kennis-onderzoek/lexicon binnen deze website te vinden en dat is via de link op pagina metamorfoze.nl/kennis-onderzoek/kennisblog. De pagina metamorfoze.nl/over-ons/toegankelijkheid kan alleen via de link op pagina metamorfoze.nl/over-ons gevonden worden. Zorg dat er nog een manier is om elke pagina te kunnen bereiken, bijvoorbeeld via de zoekfunctie.
2.4.6 Koppen en labels (Niveau AA)
Informatie over succescriterium 2.4.6 Koppen en labels
Uitkomst: Voldoende
Bevinding 34: Advies: De kop boven de pagina https://www.metamorfoze.nl/zoeken?search_api_fulltext=pop is zoeken. Daaronder staat geen zoekveld maar een aantal zoekresultaten. De kop zoekresultaten zou duidelijker zijn.
2.4.7 Focus zichtbaar (Niveau AA)
Informatie over succescriterium 2.4.7 Focus zichtbaar
Uitkomst: Onvoldoende
Bevinding 35: Wanneer op de homepagina het blok met de titel '150 jaar landbouwarchief' focus heeft, is dat niet zichtbaar. De drie kleinere blokken daaronder, bijvoorbeeld het blok met de titel 'Onderzoek papierconservering' hebben hetzelfde probleem. Zorg ervoor dat bezoekers die met het toetsenbord navigeren weten welk element de focus heeft door een duidelijke focusrand toe te voegen.
Bevinding 36: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staan begrippen die als interactieve elementen fungeren om de zichtbaarheid van verborgen content te schakelen. Deze elementen hebben geen focusindicator.
Bevinding 37: Wanneer op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes de afbeeldingen rechts focus hebben, is dat niet zichtbaar. Zorg ervoor dat bezoekers die met het toetsenbord navigeren weten welk element de focus heeft door een duidelijke focusrand toe te voegen. Hetzelfde probleem komt vaker voor in de website, bijvoorbeeld op pagina metamorfoze.nl/kennis-onderzoek/kennisblog bij alle blokjes met afbeelding die naar een blogpost linken.
2.5 Input modaliteiten
2.5.3 Label in naam (Niveau A)
Informatie over succescriterium 2.5.3 Label in naam
Uitkomst: Onvoldoende
Bevinding 38: In de header van elke pagina staat een zoekveld met daarin een placeholder-tekst 'Zoeken op trefwoord(en)'. Het veld heeft geen naam, daardoor komt de naam niet overeen met wat er op het scherm zichtbaar is. Zorg ervoor dat de visuele naam in de toegankelijke naam aanwezig is, liefst vooraan.
Bevinding 39: In de footer staat een logo van de Koninklijke Bibliotheek. De afbeelding fungeert als een link. De zichtbare tekst moet in de toegankelijke naam van de link voorkomen om stembediening mogelijk te maken. Dit is nu niet het geval. Voeg een alt-attribuut aan de afbeelding waarin zichtbare tekst voorkomt.
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 40: Op pagina metamorfoze.nl/english is de taalaanduiding van de hele pagina Nederlands. De pagina is echter in het Engels. Zorg voor de juiste taal-codering in de HTML zodat hulpsoftware de tekst op correcte wijze voorleest. Pas daarbij op dat onder andere de tekst 'Metamorfoze is het Nationaal Programma voor het behoud van ...' in het Nederlands is, hiervoor moet in de code een taalwisseling aangegeven worden om te voldoen aan 3.1.2.
Bevinding 41: Op pagina https://www.metamorfoze.nl/antibot als het contactformulier met foutieve invoer wordt verstuurd, verschijnt een foutmelding waarin kop1 en een alinea daaronder Engelstalig is. Deze teksten hebben een taalwissel nodig. Beter nog, vertaal de foutmelding in het Nederlands.
Bevinding 42: In de metadata van het pdf-document “Snelgids beoordeling offertes(..)” is de taal niet ingesteld. De taal hoort ingesteld te worden, zodat hulpsoftware de informatie uit het bestand in de correcte taal kan overdragen aan de bezoeker. Dit kan worden ingesteld via de bestandseigenschappen.
3.1.2 Taal van onderdelen (Niveau AA)
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Onvoldoende
Bevinding 43: Onderaan het artikel op pagina metamorfoze.nl/kennis-onderzoek/kennisblog/de-verschuiving-van-dienstverlening-van-analoog-naar-digitaal-archieven staat een titel van een publicatie in de Engelse tekst. Deze tekst heeft een taalwissel nodig.
Bevinding 44: Advies: Onderaan pagina metamorfoze.nl/projecten is een paginering. De toegankelijke linktekst van bijvoorbeeld de link 3 is 'Go to page 3'. Deze tekst in Engels talig. Hiervoor moet in de code een taalwisseling aangegeven worden. Dit kan door de omliggende html-code een lang="en" toe te voegen. Beter nog is om hier Nederlands te gebruiken. Overigens hebben de links 'Next' en 'Last' in de paginering een Nederlandstalige toegankelijke tekst. Advies is om de visuele tekst ook Nederlandstalig te maken. Dit probleem met de paginering komt vaker voor in de website, bijvoorbeeld op pagina metamorfoze.nl/zoeken?search_api_fulltext=document.
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevinding 45: Het formulier op pagina metamorfoze.nl/contact maakt alleen gebruik van HTML5-veldcontroles. Deze foutmeldingen worden niet door alle browsers en hulpsoftware even goed ondersteund. De melding is soms kortaf, onvolledig of blijft te kort staan. Ook kan de tekstgrootte niet aangepast worden zodat sommige mensen de tekst mogelijk niet kunnen lezen. Voeg zelf foutmeldingen toe aan het formulier om dit probleem op te lossen.
3.3.2 Labels of instructies (Niveau A)
Informatie over succescriterium 3.3.2 Labels of instructies
Uitkomst: Onvoldoende
Bevinding 46: Op pagina metamorfoze.nl/contact is een formulier waar bij de verplichte velden een sterretje (*) 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'. Nog mooier is om per veld in tekst aan te geven dat het veld verplicht is.
3.3.3 Foutsuggestie (Niveau AA)
Informatie over succescriterium 3.3.3 Foutsuggestie
Uitkomst: Onvoldoende
Bevinding 47: Het formulier op pagina https://www.metamorfoze.nl/contact maakt alleen gebruik van HTML5-veldcontroles. De foutsuggestie bij het e-mail veld wordt niet door alle browsers en hulpsoftware even goed ondersteund. Ook kan de tekstgrootte niet aangepast worden zodat sommige mensen de tekst mogelijk niet kunnen lezen. Leg aan de bezoeker uit wat hoe de fout het beste kan worden opgelost.
4. Robuust
4.1 Compatibel
4.1.1 Parsen (Niveau A)
Informatie over succescriterium 4.1.1 Parsen
Uitkomst: Voldoende
Bevinding 48: Advies: Op elke pagina komen dubbele id's voor, namelijk id="path" en id="Shape". Dit kon vroeger problemen opleveren met hulpsoftware. Zorg dat id's unieke waarden hebben op een pagina. Overigens komt dit succescriterium in WCAG 2.2 te vervallen.
4.1.2 Naam, rol, waarde (Niveau A)
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 49: In de header van elke pagina staat een zoekveld. Dit veld heeft geen naam. Op pagina metamorfoze.nl/zoeken?search_api_fulltext=document ontbreekt ook de placeholder tekst 'Zoeken op trefwoord(en)'. Het is voor blinde bezoekers niet duidelijk waar dit invoerveld voor dient. Voeg een toegankelijke naam toe aan het zoekveld om dit probleem op te lossen.
Bevinding 50: In de footer van elke pagina staat een logo van de KB Nationale Bibliotheek. Deze afbeelding is een link zonder toegankelijkheidsnaam. 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 toegankelijkheidsnaam toe waarin het linkdoel is omschreven om dit probleem op te lossen.
Bevinding 51: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staat een iframe zonder toegankelijkheidsnaam. Zorg dat iframes een naam hebben middels een title-attribuut. Gebruikers van hulpsoftware weten niet wat er in dit iframe staat en of ze deze daarom willen openen of overslaan. Voeg een beschrijvende en unieke title toe.
Bevinding 52: Op pagina metamorfoze.nl/projecten is een kaart van Google 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 "Metamorfoze projecten".
Bevinding 53: Op pagina metamorfoze.nl/projecten is een kaart van Google via een iframe geplaatst. In de kaart zijn een aantal elementen met de role="button", zoals de zoom-in en zoom-uit knop en alle plaats markeringen, die geen naam hebben. Het is voor screenreadergebruikers nu niet duidelijk wat de knoppen doen. Geef de knoppen een goede naam, bijvoorbeeld 'zoom-in' en de naam van het project waar dat geopend wordt door de plaats markering.
Bevinding 54: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staan lexicon termen die open klappen als er op geklikt wordt. Deze veranderen niet van naam wanneer bezoekers er op klikken. Zorg ervoor dat de visuele verandering ook doorgegeven wordt aan screenreadergebruikers. De status (open of dicht) moet ook aan hulpsoftware worden doorgegeven.
4.1.3 Statusberichten (Niveau AA)
Informatie over succescriterium 4.1.3 Statusberichten
Uitkomst: Onvoldoende
Bevinding 55: Op pagina metamorfoze.nl/kennis-onderzoek/lexicon staan lexicon termen die open klappen als er op geklikt wordt. Er verschijnt nieuwe content zonder dat de voorleessoftware daarvan op de hoogte wordt gesteld. Zorg voor een oplossing waarmee de nieuwe content wordt voorgelezen.
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
- Home:
https://www.metamorfoze.nl/front - Contact (formulier):
https://www.metamorfoze.nl/contact - Zoekresultaten:
https://www.metamorfoze.nl/zoeken?search_api_fulltext=document - Video:
https://www.metamorfoze.nl/kennis-onderzoek/kennisblog/van-laaiend-tot-lyrisch-jubileumfeest-groot-succes - iframe en tabel:
https://www.metamorfoze.nl/projecten - Andere taal:
https://www.metamorfoze.nl/english - 404:
https://www.metamorfoze.nl/fout - Toegankelijkheid:
https://www.metamorfoze.nl/over-ons/toegankelijkheid - Overzicht blog:
https://www.metamorfoze.nl/kennis-onderzoek/kennisblog - Uitklap functie:
https://www.metamorfoze.nl/kennis-onderzoek/lexicon - PDF:
https://www.metamorfoze.nl/sites/default/files/documents/AB_2022.1_30-31_beoordelen_offerte.pdf - PDF:
https://www.metamorfoze.nl/sites/default/files/documents/MM%20AC%20Hanteringsinstructies%202023.pdf - Bericht verstuurd:
https://www.metamorfoze.nl/antibot - blogpost:
https://www.metamorfoze.nl/kennis-onderzoek/kennisblog/de-verschuiving-van-dienstverlening-van-analoog-naar-digitaal-archieven - Medewerkers:
https://www.metamorfoze.nl/over-ons/medewerkers
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.