Issues:
Content-audit digitale toegankelijkheid website Bibliotheek Kennermerwaard
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Bibliotheek Kennermerwaard |
---|---|
Datum | 1 mei 2025 |
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 header van elke pagina staat het logo van de Bibliotheek Kennemerwaard. De alternatieve tekst van het logo is "Bibliotheek Kennemerwaard". Dit beschrijft niet de functie/unieke eigenschappen van deze afbeelding. Voor bezoekers die niet kunnen zien, is het belangrijk dat ze kunnen herkennen dat hier een logo te zien is. Wijzig de tekst bijvoorbeeld naar "Logo Bibliotheek Kennemerwaard". Tevens staat er een aria-hidden="true" element op het logo. Door aria-hidden="true" toe te voegen aan een HTML-element worden dat element en alle elementen die erin genest zijn verwijderd voor hulpsoftware, zodat het niet zichtbaar is of aangekondigd wordt voor bezoekers van ondersteunende technologieën zoals schermleessoftware. Dat is niet wenselijk, bezoekers die gebruik maken van hulpsoftware hebben er baat bij om te weten welke website ze bezoeken. Haal het aria-hidden="true" element van het logo af.
Bevinding 2: Op https://www.bibliotheekkennemerwaard.nl/lidmaatschap heeft de afbeelding bij "Bibliotheek aan huis" de alt-tekst "Bezoekers senioren bibliotheek tas bibliotheek aan huis". Dat beschrijft niet wat er op de foto te zien is. Verzorg een beschrijvende alt-tekst, of maak de afbeelding decoratief door het alt-attribuut in de code leeg te laten. Dit geldt onder andere ook voor de foto naast de kop "Als lid kun je meer!" op https://www.bibliotheekkennemerwaard.nl/uitgebreide-beschrijving-abonnementen (die foto komt ook voor op https://www.bibliotheekkennemerwaard.nl/doneren, met dezelfde alt-tekst), de foto bij de kop "Werken bij bibliotheek Kennermerwaard" op https://www.bibliotheekkennemerwaard.nl/werken-bij-vacatures
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 3: Op https://www.bibliotheekkennemerwaard.nl/democratische-fitness wordt een video getoond. Deze video heeft een automatisch gegenereerde ondertiteling. Op een aantal plekken, bijvoorbeeld op 0:37, 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 4: In de video op https://www.bibliotheekkennemerwaard.nl/gastlenen wordt het verhaal verteld doormiddel van tekst in beeld. Er is geen voice-over of transcriptie aanwezig die deze informatie uit de video toegankelijk maakt voor (doof)blinden. Voeg een van deze zaken toe. We raden een voice-over aan, zodat men ook voldoet aan succescriterium 1.2.5
1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 5: In de video op https://www.bibliotheekkennemerwaard.nl/gastlenen wordt het verhaal verteld doormiddel van tekst in beeld. Er is geen voice-over aanwezig die de informatie uit de video toegankelijk maakt voor (doof)blinden. Voeg een geluidsspoor toe met een voice-over die alle informatie in de video uitspreekt.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 6: Op de pagina https://www.bibliotheekkennemerwaard.nl/levelup staat onder de kop "Level-up in de klas" een stuk tekst cursief. Hier is het em-element gebruikt, dat is niet de bedoeling. Het 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. Dit komt ook op https://www.bibliotheekkennemerwaard.nl/nieuws/bibliotheek-kennemerwaard-en-humanitas-werken-samen-voor-de-voorleesexpress (bij de laatste zinnen op de pagina).
Bevinding 7: Op https://www.bibliotheekkennemerwaard.nl/democratische-fitness komt onder de kop "Meer democratisch zelfvertrouwen" een opsomming voor. Deze is nu niet opgemaakt met de juiste code. Gebruik het ul- en li-element om opsommingen weer te geven.
Bevinding 8: Op https://www.bibliotheekkennemerwaard.nl/lidmaatschap wordt er onder "Overige tarieven" in de uitgeklapte content gebruik gemaakt van het strong-element voor de opmaak van koppen. Dit is niet toegestaan, dat element is bedoeld om een woord of enkele woorden in een zin nadruk te geven. Gebruik CSS om de koppen vet op te maken.
Bevinding 9: Op https://www.bibliotheekkennemerwaard.nl/doneren staat de tekst "Welke keuze je ook maakt, dankzij jouw bijdrage kan iedereen meedoen in onze samenleving. Bedankt!" in een kop. Het is echter geen kop, omdat er geen inhoud onder volgt. Om tekst groter te maken als het geen kop is, maak gewoon gebruik van CSS.
Bevinding 10: Op https://www.bibliotheekkennemerwaard.nl/openingstijden is de naam van elke gemeente vet opgemaakt met het strong-element. Dit is niet toegestaan omdat dit element niet is bedoeld voor opmaak, maar om een woord of enkele woorden in een zin nadruk te geven. Omdat hier de naam van de gemeente een functie als kop heeft, is het op te lossen door er koppen van te maken. Hetzelfde komt vaker voor in de website, bijvoorbeeld op pagina https://www.bibliotheekkennemerwaard.nl/levelup onder de kop "De levels van Level Up!" de teksten "Level 1", "Level 2" etc.
1.3.2 Betekenisvolle volgorde (Niveau A)
Informatie over succescriterium 1.3.2 Betekenisvolle volgorde
Uitkomst: Onvoldoende
Bevinding 11: Het volgend probleem behoeft mogelijk een technische oplossing. Op de homepagina https://www.bibliotheekkennemerwaard.nl/ staan onder de kop "Nieuws" een aantal kaarten met links naar nieuwsartikelen. De toegankelijke tekst van een kaart begint met "Lees verder" en de plaatsingsdatum van het artikel. De titel van het artikel moet het eerste element zijn in de html volgorde zodat duidelijk is waar de informatie bij hoort. Hetzelfde probleem komt op meer plaatsen in de website voor, bijvoorbeeld op pagina https://www.bibliotheekkennemerwaard.nl/klantenservice.
1.4 Onderscheidbaar
1.4.1 Gebruik van kleur (Niveau A)
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevinding 12: Op pagina https://www.bibliotheekkennemerwaard.nl/klantenservice-contact staat een formulier. Als een bezoeker een formulierveld verkeerd of niet invult, is dat alleen zichtbaar doordat dat veld van kleur verandert. Zorg ervoor dat informatie niet alleen van kleur afhankelijk is om dit probleem op te lossen. Dit komt ook voor op https://www.bibliotheekkennemerwaard.nl/levelup.
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 13: In de footer van elke pagina staan vier oranje links (#FF7320) naar "Werken bij", "Geef een gift", "Contact" en "Cookie-instellingen". Deze tekst biedt te weinig contrast in combinatie met de donkergrijze achtergrond (HEX #39373A). De contrastverhouding is hier 4,3:1 waar dit minimaal 4,5: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 14: Als in het menu in de header van elke pagina op een link geklikt wordt, bijvoorbeeld "Over ons" dat krijgt die link een oranje kleur om aan te geven dat dit de huidige pagina is. De oranje tekst (HEX #FF7320) op witte achtergrond heeft een te laag contrast. De contrastverhouding is hier 2,7:1 terwijl dat ten minste 4,5:1 moet zijn.
Bevinding 15: Op pagina https://www.bibliotheekkennemerwaard.nl/ staan onder de koptekst h2 "Speciaal voor" drie afbeeldingen met daaronder een link. Wanneer je met de muis over de link gaat (hover) of de links toetsenbordfocus hebben, krijgen ze een oranje kleur (HEX #FF7320). In combinatie met de witte achtergrond biedt deze kleur te weinig contrast. De contrastverhouding is hier 2,7:1 waar dit minimaal 4,5: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 speelt ook op andere pagina's, bijv. https://www.bibliotheekkennemerwaard.nl/zoeken?q=boeken en bij de link naar de privacyverklaring in de cookiemelding.
Bevinding 16: Op https://www.bibliotheekkennemerwaard.nl/klantenservice-contact heeft de tekst van de foutmelding (HEX #FF4B52) een contrastverhouding van 2,5:1 met de roze (HEX #FFD5D6), waar het minimaal 4,5:1 moet zijn. En de Dit komt ook voor op https://www.bibliotheekkennemerwaard.nl/levelup.
Bevinding 17: Op https://www.bibliotheekkennemerwaard.nl/werken-bij-vacatures zijn er links naar het meerjarenbeleidsplan en het jaarverslag. Wanneer je met de muis over de link gaat (hover) of de links toetsenbordfocus hebben, krijgen ze een oranje kleur (HEX #FF731F). In combinatie met de achtergrond (HEX #FCE4D0 ) biedt deze kleur te weinig contrast. De contrastverhouding is hier 2,2:1 waar dit minimaal 4,5: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 komt ook voor op https://www.bibliotheekkennemerwaard.nl/over-ons, https://www.bibliotheekkennemerwaard.nl/boekenweek, https://www.bibliotheekkennemerwaard.nl/volwassenen.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 18: Op https://www.bibliotheekkennemerwaard.nl/klantenservice-contact hebben de links onder "Neem contact met ons op" zijn onderlijnd met een witte lijn. Dit heeft onvoldoende contrast met de oranje achtergrond (HEX #FCE4D0). De contrastverhouding is 1,2:1 waar het minstens 3:1 moet zijn.
Bevinding 19: Op https://www.bibliotheekkennemerwaard.nl/klantenservice-contact hebben de lichtgrijze randen van de invoervelden (HEX #E4E4E4) een contrastverhouding van 1,3:1 met de witte achtergrond. Dit moet minimaal 3:1 zijn. Dit speelt ook op https://www.bibliotheekkennemerwaard.nl/levelup.
Bevinding 20: Op https://www.bibliotheekkennemerwaard.nl/nieuws/bibliotheek-kennemerwaard-en-humanitas-werken-samen-voor-de-voorleesexpress is de link "VoorleesExpress" onder "Meer weten of meedoen met de VoorleesExpress?" oranje onderlijnd (HEX #FF731F) . Dit heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 2,7:1 waar het minstens 3:1 moet zijn. Dit komt ook voor op https://www.bibliotheekkennemerwaard.nl/openingstijden.
Bevinding 21: Op https://www.bibliotheekkennemerwaard.nl/collectie krijgt het zoekveld onder de kop "Zoek in de collectie" een oranje focusindicator (HEX #FF731F). Dit geeft een contrastverhouding van 2,2:1 met de achtergrond (HEX #FCE4D0), waar minstens 3:1 verwacht wordt.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.4 Enkel teken sneltoets (Niveau A)
Informatie over succescriterium 2.1.4 Enkel teken sneltoets
Uitkomst: Onvoldoende
Bevinding 22: Op de pagina https://www.bibliotheekkennemerwaard.nl/gastlenen wordt gebruikgemaakt van de videospeler van YouTube. Deze videospeler maakt gebruik van bediening door enkele tekentoetsen, bijvoorbeeld f voor fullscreen. Deze functionaliteit is iets wat mensen die gebruik maken van spraaksoftware in de weg kan staan. Deze mensen zijn juist afhankelijk van die korte commando's om met spraaksoftware hun computer te bedienen. Los dit op door de embedcode van de YouTube-video aan te passen, zodat de bediening met tekentoetsen uit staat. Voeg de volgende eigenschap aan de embedcode toe: 'disablekb=1'. Met deze aanpassing zorg je ervoor dat je voldoet aan dit succescriterium.
2.4 Navigeerbaar
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 23: De paginatitel op https://www.bibliotheekkennemerwaard.nl/zoeken?q=boeken heeft nu als titel "404 - Deze pagina kan niet worden getoond.". Dit is niet een titel die de inhoud van de pagina beschrijft. Zorg ervoor dat uit de titel het duidelijk wordt dat deze pagina over zoekresultaten gaat.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 24: Op https://www.bibliotheekkennemerwaard.nl/zoeken?q=boeken hebben de pagina's in de paginering onder de zoekresultaten geen duidelijke linktekst. De linktekst is enkel het cijfer. Voeg het woord "pagina" toe om de context en het doel van deze links te optimaliseren voor hulpsoftware.
Bevinding 25: Op https://www.bibliotheekkennemerwaard.nl/lidmaatschap zijn de verschillende typen lidmaatschappen die gekozen kunnen worden opgemaakt als cards. Hierdoor maakt alle tekst deel uit van de linktekst binnen het <a> element. Een linktekst moet een korte beschrijving van het linkdoel zijn. Maak de titel de eigenlijke link en de gehele card klikbaar met JavaScript om dit op te lossen. Dit speelt ook op https://www.bibliotheekkennemerwaard.nl/uitgebreide-beschrijving-abonnementen en op https://www.bibliotheekkennemerwaard.nl/collectie bij de uitgelichte boeken onder "Lees de populairste boeken van februari".
3. Begrijpelijk
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevinding 26: Wanneer bezoekers op pagina https://www.bibliotheekkennemerwaard.nl/klantenservice-contact geen of foutieve invoer invullen, verschijnen er generieke foutmeldingen bovenaan de pagina. Een goede foutidentificatie vermeld welke fout is gemaakt, en waar de fout is gemaakt. Bijvoorbeeld 'Het veld XXXX is niet ingevuld’. Dat een veld verplicht is, is een foutsuggestie zoals omschreven bij succescriterium 3.3.3.
3.3.2 Labels of instructies (Niveau A)
Informatie over succescriterium 3.3.2 Labels of instructies
Uitkomst: Onvoldoende
Bevinding 27: Op pagina https://www.bibliotheekkennemerwaard.nl/klantenservice-contact is 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'. Dit komt ook voor op https://www.bibliotheekkennemerwaard.nl/nieuwsbrief.
3.3.3 Foutsuggestie (Niveau AA)
Informatie over succescriterium 3.3.3 Foutsuggestie
Uitkomst: Onvoldoende
Bevinding 28: Op https://www.bibliotheekkennemerwaard.nl/klantenservice-contact wordt bij het invoeren van een ongeldig e-mailadres (met komma in plaats van punt) wel een foutmelding gegeven, maar wordt er niet aangegeven hoe de fout opgelost kan worden. Geef een voorbeeld van een correct e-mailadres als foutsuggestie. Dit komt ook voor op https://www.bibliotheekkennemerwaard.nl/levelup en https://www.bibliotheekkennemerwaard.nl/nieuwsbrief
4. Robuust
4.1 Compatibel
4.1.2 Naam, rol, waarde (Niveau A)
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 29: Op https://www.bibliotheekkennemerwaard.nl/ zijn er cards aanwezig onder "Nieuws" en "Speciaal voor". In de code en accessibility tree is er geen linktekst aanwezig voor elke card. Hoewel de links door een screenreader goed worden voorgelezen, is er mogelijk toch impact voor bijv. spraakbesturing. Dit vereist mogelijk een technische oplossing. Daarom raden we aan de titel van een bericht de link te maken en de gehele card klikbaar te maken met JavaScript. Dit speelt ook op onder anderen https://www.bibliotheekkennemerwaard.nl/zoeken?q=boeken en https://www.bibliotheekkennemerwaard.nl/nieuwsoverzicht, https://www.bibliotheekkennemerwaard.nl/werken-bij-vacatures
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.bibliotheekkennemerwaard.nl/ - Klantenservice:
https://www.bibliotheekkennemerwaard.nl/klantenservice - Contactformulier:
https://www.bibliotheekkennemerwaard.nl/klantenservice-contact - Zoekresultaten:
https://www.bibliotheekkennemerwaard.nl/zoeken?q=boeken - Video en iframe:
https://www.bibliotheekkennemerwaard.nl/gastlenen - Formulier:
https://www.bibliotheekkennemerwaard.nl/levelup - Video en opsomming:
https://www.bibliotheekkennemerwaard.nl/democratische-fitness - Over ons:
https://www.bibliotheekkennemerwaard.nl/over-ons - 404:
https://www.bibliotheekkennemerwaard.nl/404 - Collectie:
https://www.bibliotheekkennemerwaard.nl/collectie - Lidmaatschap:
https://www.bibliotheekkennemerwaard.nl/lidmaatschap - Doneren:
https://www.bibliotheekkennemerwaard.nl/doneren - Nieuwsoverzicht:
https://www.bibliotheekkennemerwaard.nl/nieuwsoverzicht - Nieuwsbericht:
https://www.bibliotheekkennemerwaard.nl/nieuws/bibliotheek-kennemerwaard-en-humanitas-werken-samen-voor-de-voorleesexpress - Werken bij:
https://www.bibliotheekkennemerwaard.nl/werken-bij-vacatures - Open sollicitatie:
https://www.bibliotheekkennemerwaard.nl/open-sollicitatie-bibliotheek-kennemerwaard - Openingstijden:
https://www.bibliotheekkennemerwaard.nl/openingstijden - Boekenweek:
https://www.bibliotheekkennemerwaard.nl/boekenweek - Volwassenen:
https://www.bibliotheekkennemerwaard.nl/volwassenen - Willekeurige sample 1:
https://www.bibliotheekkennemerwaard.nl/uitgebreide-beschrijving-abonnementen - Willekeurige sample 2:
https://www.bibliotheekkennemerwaard.nl/nieuwsbrief
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.