Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website van Bibliotheek Dalfsen

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Bibliotheek Dalfsen
Datum 20 juni 2025
Scope van de website Binnen de scope van het 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: 103

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 pagina https://www.bibliotheekdalfsen.nl/ staat bovenaan een logo met de tekst “de Bibliotheek Dalfsen”. De alt-tekst van dit logo is “Bibliotheek Dalfsen”. Deze alt-tekst is niet voldoende. Omdat het logo in een link staat zonder zichtbare linktekst, fungeert de alt-tekst als linktekst. Daarom moet de alt-tekst beschrijven dat het om een logo gaat en dat de link leidt naar de homepagina.

Bevinding 2: Op pagina https://www.bibliotheekdalfsen.nl/ staan in de header naast de link “Inloggen” afbeeldingen die functioneren als links naar Facebook en Instagram. Deze afbeeldingen hebben geen tekstalternatieven. Daardoor bevatten de links geen inhoud en zijn ze niet toegankelijk voor bezoekers die hulpsoftware gebruiken. Om de links toegankelijk te maken, moeten de afbeeldingen tekstalternatieven krijgen die het doel van de link beschrijven.

Bevinding 3: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda/volwassenen-18/4347-oefenpunt-dinsdag-17-juni-2025 staan onder de knop “Terug” links naar social media “Facebook” en “Twitter” die worden weergegeven als afbeeldingen. Deze afbeeldingen hebben geen tekstalternatief. Daardoor hebben de links geen inhoud en zijn ze ontoegankelijk voor hulpsoftware. De afbeeldingen moeten voorzien worden van tekstalternatieven die aangeven wat het doel van de link is.

Bevinding 4: Op pagina https://www.bibliotheekdalfsen.nl/ staan onder de kop “Nieuws van de Bibliotheek Dalfsen” twee artikelen die elk bestaan uit een afbeelding die als link dient en een kop die ook als link dient. De afbeeldingen hebben een leeg alt-attribuut. Daardoor hebben de links op de afbeeldingen geen inhoud. De afbeeldingen moeten tekstalternatieven krijgen die het linkdoel beschrijven. Een betere oplossing is om de link van de afbeelding te verwijderen. Aangezien naast elke afbeelding al een link staat in de kop van het artikel, kan het klikbare gebied van die link met JavaScript worden uitgebreid naar de afbeelding. Zo blijft er één link over met een duidelijk linkdoel en blijft de afbeelding aanklikbaar.

Bevinding 5: Op pagina https://www.bibliotheekdalfsen.nl/ staan onder de kop “In de bieb” drie decoratieve afbeeldingen. De alt-attributen van deze afbeeldingen bevatten alleen een spatie: alt=” “. Daardoor zijn de afbeeldingen niet verborgen voor schermlezers. Een decoratieve afbeelding moet verborgen worden voor hulpsoftware. Gebruik hiervoor een leeg alt-attribuut: alt=””.

Bevinding 6: Op pagina https://www.bibliotheekdalfsen.nl/ staan onder de koppen “Lid worden”, “Meer met de computer” en “Nederlands leren” decoratieve afbeeldingen met een alt-attribuut dat alleen een spatie bevat. Ook op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staan onder de koppen “Taalspreekuren”, “Taalcafé” en “Contact” decoratieve afbeeldingen met alt=” “. Deze afbeeldingen zijn niet verborgen voor hulpsoftware. Decoratieve afbeeldingen moeten een leeg alt-attribuut hebben zodat ze genegeerd worden door schermlezers.

Bevinding 7: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact.html staan onder de kop “Heb je een vraag? Neem contact met ons op via:” drie afbeeldingen, waarvan twee een alt-tekst hebben: “Naar facebook” en “Naar ons contactformulier”. Omdat de afbeeldingen samen met link en tekst bedoeld zijn als een geheel, is het beter om elke afbeelding een leeg alt-attribuut te geven. De afbeelding, tekst en link kunnen samengevoegd worden in een visueel blok (card). Deze hele card kan klikbaar worden gemaakt met JavaScript.

Bevinding 8: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice.html staan onder de kop “Formulieren voor aanpassingen lidmaatschap:” vier afbeeldingen met tekst en link. De afbeeldingen maken deel uit van een visueel blok. Daarom moet elke afbeelding een leeg alt-attribuut krijgen. De afbeelding, link en tekst kunnen in één card worden opgemaakt die volledig klikbaar gemaakt wordt met JavaScript.

Bevinding 9: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen staan bij elk evenement afbeeldingen die als decoratief bedoeld zijn. De afbeeldingen bevatten echter tekstalternatieven. Omdat de afbeelding geen aanvullende informatie geeft ten opzichte van de linktekst bij het evenement, moet het alt-attribuut leeg zijn. De afbeelding, link en tekst kunnen als één geheel worden gepresenteerd in een klikbare card.

Bevinding 10: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat onder de kop “Taalpunt” een link met de tekst “Leren”. Voor deze link is via CSS een pijlsymbool toegevoegd met een ::before-pseudo-element. Dit symbool wordt door schermlezers voorgelezen als “before”. Omdat het om een decoratief icoon gaat, moet het verborgen worden voor hulpsoftware.

Bevinding 11: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda/volwassenen-18/4347-oefenpunt-dinsdag-17-juni-2025 staat onder de kop van het artikel een afbeelding met alt-tekst “Oefenpunt”. De tekst op de afbeelding herhaalt de kop erboven en bevat geen aanvullende informatie. De afbeelding kan als decoratief worden beschouwd en moet daarom een leeg alt-attribuut krijgen.

Bevinding 12: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023 staat bovenaan een logo dat via een img-element is geplaatst. Dit logo heeft geen alt-attribuut. Daardoor wordt de bestandsnaam voorgelezen door schermlezers. Een informatief logo moet altijd een alt-tekst hebben die de volledige zichtbare tekst bevat. Als het logo geen link is, moet in de alt-tekst ook het woord ‘Logo’ worden opgenomen. Hetzelfde probleem komt voor op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs en op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers.

Bevinding 13: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staan onder de kop “Maakpunt” drie afbeeldingen die functioneren als knoppen om foto’s te openen. Deze knoppen bestaan uitsluitend uit een afbeelding, maar de afbeeldingen hebben geen tekstalternatief. Omdat de afbeelding de enige inhoud van de knop is, moet de alternatieve tekst het doel of de functie van de knop beschrijven. Dit kan door een alt-tekst toe te voegen aan het img-element, een aria-label te gebruiken of een visueel verborgen tekst toe te voegen die beschikbaar is voor schermlezers.

Bevinding 14: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staan onder de koppen “Schrijversfestival” en “Nationale Voorleeswedstrijd” ook knoppen die alleen uit een afbeelding bestaan. Deze afbeeldingen hebben geen tekstalternatief. De alternatieve tekst moet duidelijk maken wat de functie of het doel van de knop is, zodat bezoekers die hulpsoftware gebruiken begrijpen wat er gebeurt als ze op de knop klikken.

Bevinding 15: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staat onder de kop “Activiteiten in de bibliotheek” een carrousel. Elke slide bevat een afbeelding en bijbehorende tekst, waardoor de afbeelding toegankelijk is. Eén van de slides, namelijk slide nummer 8, bevat echter geen tekst. In dit geval moet een beschrijvende alt-tekst toegevoegd worden aan de afbeelding, zodat ook deze slide toegankelijk is voor hulpsoftware.

Bevinding 16: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staan onder de kop “E-books & Luisterboeken” infografieken die informatief zijn. Deze afbeeldingen hebben lege alt-attributen. Omdat de afbeeldingen belangrijke informatie bevatten, moet die informatie beschikbaar zijn voor hulpsoftware. Dit kan door de informatie zichtbaar op de pagina te plaatsen of door de afbeelding via een img-element te tonen met een beschrijvende alt-tekst.

Bevinding 17: In het PDF-document op https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-3-functieprofiel-vrijwillige.pdf staat bovenaan het logo van “de Bibliotheek Dalfsen”. De afbeelding is toegevoegd via een figure-element en heeft een automatisch gegenereerde beschrijving. Deze beschrijving is niet voldoende. Bezoekers die het document laten voorlezen, krijgen daardoor niet te horen wat op de afbeelding staat. Voeg een beschrijvende alt-tekst toe aan het logo, zodat ook deze bezoekers weten wat op het logo te zien is.

Bevinding 18: In het PDF-document op https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-4-functieprofiel-vrijwillige.pdf staat hetzelfde logo bovenaan het document. Ook hier is de afbeelding voorzien van een automatisch gegenereerde beschrijving die niet voldoende informatie geeft. Voeg een beschrijvende alt-tekst toe zodat het logo begrijpelijk is voor bezoekers die het document laten voorlezen.

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 19: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat onder de kop “De ervaring van Gerda” een video waarin een voice-over te horen is. De video bevat automatisch gegenereerde ondertitels. Deze ondertitels zijn niet voldoende, omdat ze onnauwkeurig zijn en er geen punctuatie in voorkomt. Video’s waarin gesproken wordt, moeten altijd ondertiteling bevatten die exact overeenkomt met de gesproken tekst. Alleen zo krijgen bezoekers die de video niet (goed) kunnen horen volledige en correcte informatie.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 20: Op pagina https://www.bibliotheekdalfsen.nl/ staat in de header een groep met twee keuzerondjes (“Catalogus” en “Site”) voorafgegaan door de tekst “Zoeken in”. Deze elementen vormen visueel een groep, maar deze relatie is in de HTML niet vastgelegd. Om dit toegankelijk te maken, moet de groep worden ingesloten in een fieldset-element met een bijbehorende legend. In het legend-element moet de tekst “Zoeken in” worden geplaatst. Zo wordt voor hulpsoftware duidelijk dat het om een keuzegroep gaat.

Bevinding 21: Op pagina https://www.bibliotheekdalfsen.nl/ is de hoofdnavigatie in een lijst gezet. De ul heeft een role=navigation attribuut. Hierdoor wordt het een landmark. Dit heeft als gevolg dat de lijstitems niet in meer in een lijst staan. Semantisch is dat niet correct en het is ook niet toegestaan vanuit de HTML-standaard. Verwijder het attribuut.

Bevinding 22: Op pagina https://www.bibliotheekdalfsen.nl/ staat een carrousel met grijze stippen onderaan. Deze stippen geven aan hoeveel slides er zijn en welke slide actief is. De actieve slide wordt visueel onderscheiden, maar deze informatie ontbreekt in de HTML. Hierdoor weten bezoekers die schermlezers gebruiken niet welke slide actief is. Deze informatie moet beschikbaar worden gemaakt met behulp van ARIA-technieken of een tekst die visueel verborgen is maar toegankelijk voor hulpsoftware.

Bevinding 23: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact.html is de tekst “Contactgegevens” bedoeld als kop, maar deze is niet gemarkeerd als heading-element. Voor bezoekers die hulpsoftware gebruiken, is deze tekst daardoor niet herkenbaar als kop. Markeer deze tekst met een heading-element, zodat duidelijk is dat het een kop is en de pagina beter scanbaar wordt.

Bevinding 24: Op pagina https://www.bibliotheekdalfsen.nl/ volgt de kop “Horeca” direct na de kop “In de bieb”, en beide hebben hetzelfde kopniveau (h3), zonder inhoud ertussen. Als twee koppen van hetzelfde niveau direct onder elkaar staan, dan klopt de structuur niet. Dit moet worden aangepast zodat de koppen hiërarchisch correct zijn gemarkeerd. De structuur van de tekst moet de inhoud weerspiegelen.

Bevinding 25: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact.html volgen de koppen “Heb je een vraag? Neem contact met ons op via” (h3) en “Telefoon” (h3) elkaar direct op, zonder tussenliggende inhoud. Dit duidt op een onjuiste kopstructuur. De niveaus van de koppen moeten worden aangepast om de hiërarchie van de inhoud goed weer te geven.

Bevinding 26: Op pagina https://www.bibliotheekdalfsen.nl/word-lid-van-de-bibliotheek.html volgen de koppen “Kies uit deze abonnementen” (h3) en “Gratis basis” (h3) elkaar direct op. Ook hier is de hiërarchische structuur van de koppen niet correct. Pas de kopniveaus aan, zodat de structuur van de pagina logisch en toegankelijk is voor hulpsoftware.

Bevinding 27: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html staan bij het formulier extra instructies bij de velden “E-mailadres” en “Wil je een bijlage meesturen?”. Schermlezers in formuliermodus slaan vaak inhoud over die zich tussen invoervelden bevindt. Hierdoor worden deze instructies niet altijd aangekondigd. De relatie tussen het invoerveld en de instructie is niet vastgelegd in de HTML. Gebruik het attribuut aria-describedby op het invoerveld om deze relatie duidelijk te maken. Dit attribuut moet verwijzen naar het id van de instructie, zodat hulpsoftware de juiste uitleg aan het veld kan koppelen.

Bevinding 28: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html en op pagina https://www.bibliotheekdalfsen.nl/klantenservice/Adreswijziging.html komen vergelijkbare problemen voor bij verschillende invoervelden met aanvullende instructies. Ook hier moet het attribuut aria-describedby worden toegevoegd aan de velden, waarbij verwezen wordt naar de tekst die uitleg geeft. Zo krijgen bezoekers die hulpsoftware gebruiken de juiste informatie.

Bevinding 29: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/Adreswijziging.html bevat het formulier een groep met vier identieke invoervelden voor “Initialen en achternaam”, voorafgegaan door de tekst “Naam van meeverhuizende huisgenoten:”. De velden lijken visueel gegroepeerd, maar deze relatie is niet in de HTML vastgelegd. De individuele labels geven onvoldoende context over de bedoeling van de groep. Gebruik een fieldset-element met daarin de vier invoervelden en plaats de groepsnaam “Naam van meeverhuizende huisgenoten:” in een legend-element. Zo wordt voor hulpsoftware duidelijk dat deze velden bij elkaar horen.

Bevinding 30: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger.html zijn de teksten “Functieprofielen” en “Belangstelling?” bedoeld als tussenkoppen, maar ze zijn niet gemarkeerd als heading-element. Bezoekers die hulpsoftware gebruiken kunnen hierdoor moeilijk navigeren. Markeer deze teksten als koppen met een heading-element, zodat ze functioneren als structurele ankerpunten op de pagina.

Bevinding 31: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs zijn meerdere teksten, zoals “BoekStart Voorleespret” en “Boekstartdag”, bedoeld als koppen, maar niet als zodanig gemarkeerd. Dit belemmert het gebruik van hulpsoftware. Zet deze teksten om in heading-elementen zodat ze onderdeel worden van de structurele opbouw van de pagina.

Bevinding 32: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023 staat de kop “Jaarverslag” direct gevolgd door een andere kop van hetzelfde niveau: “2023”. Er staat geen inhoud tussen deze twee koppen. Dit wijst op onjuist gebruik van kopniveaus. Pas de kopstructuur aan zodat de hiërarchie van de informatie duidelijk is voor bezoekers die schermlezers gebruiken.

Bevinding 33: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staan de koppen “Jeugd & Onderwijs” en “Leesplezier en taalontwikkeling bij kinderen van 0 tot 18 jaar” direct onder elkaar en beide zijn gemarkeerd als h1. Omdat er geen inhoud tussen staat, is dit geen correcte toepassing van kopniveaus. De structuur moet worden aangepast zodat de tweede kop een lager niveau krijgt, passend binnen de hiërarchie van de pagina.

Bevinding 34: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staat de kop “Cijfers” direct gevolgd door de kop “Bibliotheek Dalfsen 2023”. Beide zijn van hetzelfde niveau, zonder inhoud ertussen. Ook hier is sprake van een onjuiste kopstructuur. Corrigeer de niveaus, zodat de structuur logisch en toegankelijk is.

Bevinding 35: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staat onder de kop “Activiteiten in de bibliotheek” een carrousel. Elke slide bevat een tekst die gemarkeerd is met een h2-element, maar de tekst functioneert niet als kop en heeft geen inhoud eronder. Het kop-element wordt hier uitsluitend gebruikt voor visuele opmaak. Een h2 zonder structurele functie is verwarrend voor bezoekers die hulpsoftware gebruiken. Vervang het h2-element door een p-element en gebruik CSS om het gewenste uiterlijk toe te passen.

Bevinding 36: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staan in de secties onder de koppen “Leden”, “Uitleningen” en “Digitaal” teksten met lange reeksen van puntjes. Deze leestekens worden door hulpsoftware niet uitgesproken. Hierdoor kunnen bezoekers die hulpsoftware gebruiken denken dat er inhoud ontbreekt. Verwijder deze symbolen of vervang ze door toegankelijke visuele scheiding die ook voor schermlezers begrijpelijk is.

Bevinding 37: In het PDF-document op https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-3-functieprofiel-vrijwillige.pdf zijn alle koppen visueel vormgegeven, maar in de tags niet als koppen gemarkeerd. Voorbeelden hiervan zijn “Vrijwilliger publieksservice”, “Werkzaamheden” en “Inzet”. De visuele structuur wijkt hierdoor af van de tagstructuur van het document. Vervang de p-tags door h-tags, zodat de structuur in de tags overeenkomt met de visuele structuur van het document.

Bevinding 38: In het PDF-document op https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-4-functieprofiel-vrijwillige.pdf zijn de koppen, zoals “Vrijwilliger Taalpunt”, “Activiteiten (per activiteit een link)” en “Profiel”, visueel als kop weergegeven, maar niet als zodanig gemarkeerd in de tags. Ook hier komt de structuur van de tags niet overeen met de visuele structuur. Vervang de p-tags door h-tags zodat de inhoud voor hulpsoftware correct is gestructureerd.

Bevinding 39: In het PDF-document op https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-4-functieprofiel-vrijwillige.pdf staat op pagina 7 onder de kop “Wat ga je doen?” een lijst met vier items. In de tags is deze lijst verdeeld over twee L-tags en is een deel van de inhoud van het tweede item als losse paragrafen gemarkeerd. Inhoud die eruitziet als een lijst moet in de tagstructuur ook als lijst gemarkeerd zijn. Alleen dan krijgen blinde bezoekers dezelfde structuur aangeboden als ziende bezoekers. Plaats alle lijstitems in één L-tag en zorg dat de volledige inhoud van elk item in het juiste list-item blijft staan.

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 40: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html bevat het formulier invoervelden voor persoonlijke gegevens zoals voornaam, achternaam en e-mailadres. Deze velden missen het attribuut autocomplete. Door dit attribuut toe te voegen kunnen browsers en hulpsoftware helpen bij het invullen van gegevens, bijvoorbeeld door automatisch eerder ingevoerde informatie aan te bieden. Voor elk veld moet het juiste attribuut worden gebruikt, zoals autocomplete="given-name" voor voornaam, autocomplete="family-name" voor achternaam en autocomplete="email" voor e-mailadres. Op deze pagina staat een overzicht van de juiste waarden: https://www.w3.org/Translations/WCAG22-nl/#input-purposes.

Bevinding 41: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html ontbreekt het autocomplete-attribuut ook bij invoervelden voor persoonlijke gegevens. Voeg het attribuut toe aan elk relevant veld zodat hulpsoftware en browsers ondersteuning kunnen bieden bij het invullen.

Bevinding 42: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/Adreswijziging.html missen vergelijkbare invoervelden voor persoonlijke informatie eveneens het attribuut autocomplete. Deze velden moeten worden voorzien van het juiste attribuut, zodat gebruikers sneller en met minder fouten het formulier kunnen invullen.

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevinding 43: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html in het formulier gebruiken de selectievakjes een aangepaste indicator voor toetsenbordfocus die alleen te zien is als een verandering van de achtergrondkleur.
Het gebruik van alleen kleur om focus aan te geven is hier echter niet voldoende, omdat de contrastverhouding tussen de gefocuste en niet-gefocuste staat van de achtergrondkleur minder dan 3,0:1 is. Voor bezoekers met een visuele beperking of kleurenblindheid is zo’n subtiele kleurverandering vaak niet duidelijk genoeg. En ook mensen die met het toetsenbord navigeren moeten goed kunnen zien op welke plek van de pagina ze zijn. Daarvoor moet er een duidelijk zichtbare focusindicator zijn. Hiervoor kan het beste een extra visuele aanduiding toegevoegd worden. Denk aan een dikkere rand, een onderstreping of een verandering van achtergrond met de voldoende contrast ratio. Een soortgelijk probleem is er met select-elementen onder de "Geboortedatum".
Een soortgelijk probleem doet zich voor op de https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html pagina met het veld "Wil je een bijlage meesturen?

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 44: Op de website staat in de header een zoekveld met een plaatshoudertekst. In de hover-toestand heeft deze tekst een grijze kleur (HEX #757575) tegen een lichtgrijze achtergrond (HEX #EDEDED). De contrastratio is 3,9:1. In de focus-toestand staat dezelfde tekst tegen een oranje achtergrond, met een contrastratio van 3,8:1. Deze waarden voldoen niet aan de vereiste minimale contrastratio van 4,5:1 voor kleine tekst. Zorg dat de plaatshoudertekst altijd voldoende contrast heeft ten opzichte van de achtergrond.

Bevinding 45: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen staat in de filters een invoerveld met de plaatshoudertekst “Zoek op trefwoord” in grijs (HEX #A1A1A1) tegen een witte achtergrond. De contrastratio is 2,6:1. Dit is lager dan de vereiste minimumwaarde van 4,5:1. Zorg dat de plaatshoudertekst voldoende contrast heeft met de achtergrond.

Bevinding 46: Op pagina https://www.bibliotheekdalfsen.nl/zoekresultaten.website.html?q=dalfsen staat in de zijbalk onder de kop “Verfijnen op resultaten” een uitschuifmenu “Type”. Wanneer dit element toetsenbordfocus krijgt, verandert de kleur van de koptekst van zwart naar oranje (HEX #FF7320) tegen een witte achtergrond. De contrastratio van 2,7:1 is lager dan de vereiste minimumwaarde van 4,5:1 voor kleine tekst die niet vetgedrukt is. Zorg voor voldoende contrast in de gefocuste toestand.

Bevinding 47: Op pagina https://www.bibliotheekdalfsen.nl/zoekresultaten.website.html?q=dalfsen hebben de getallen die het aantal resultaten per filtercategorie aangeven een te laag contrast. Deze donkergrijze tekst (HEX #757575) staat tegen een lichtgrijze achtergrond (HEX #EDEDED) en heeft een contrastratio van 3,9:1. Deze waarde ligt onder de vereiste minimumwaarde van 4,5:1. Zorg voor voldoende contrast tussen tekst en achtergrond.

Bevinding 48: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen wordt het bericht “Geen evenementen aanwezig” getoond wanneer er geen zoekresultaten zijn. Deze tekst heeft een blauwe kleur (HEX #0DCAF0) tegen een witte achtergrond. De contrastratio van 2,0:1 is onvoldoende voor kleine tekst. Zorg dat deze tekst een contrastratio heeft van minimaal 4,5:1.

Bevinding 49: Op pagina https://www.bibliotheekdalfsen.nl/word-lid-van-de-bibliotheek.html staat naast de kop “Of je gaat volledig digitaal!” een afbeelding met daarin tekst. De witte tekst staat op een oranje achtergrond (HEX #F57921). De contrastratio is 2,7:1. Voor kleine tekst is een minimale contrastratio van 4,5:1 vereist. Voor grote tekst geldt een minimum van 3,0:1. Zorg dat de tekst in de afbeelding voldoet aan deze richtlijnen.

Bevinding 50: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger.html staan onder de kop “Alle vrijwilligersfuncties” uitklapbare onderdelen (accordions). Wanneer een accordion focus krijgt met het toetsenbord, verandert de koptekst van zwart naar oranje (HEX #FF7320) tegen een witte achtergrond. De contrastratio is 2,7:1. Aangezien deze tekst kleiner is dan 24px en niet vetgedrukt, moet het contrast minimaal 4,5:1 zijn. Pas de kleuren aan zodat dit contrast wordt bereikt.

Bevinding 51: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staat onder de kop “Voorleestent en andere voorleesmomenten” grijze tekst (HEX #746B67) op een oranje achtergrond (HEX #FDE5D0). De contrastratio is 4,3:1. Omdat de tekst kleiner is dan 24px en niet vetgedrukt, voldoet deze waarde niet aan de vereiste minimumcontrastverhouding van 4,5:1. Zorg dat de tekstkleur en achtergrondkleur voldoende contrast bieden.

Bevinding 52: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staat onder de kop “Activiteiten in de bibliotheek” een carrousel. De slides bevatten donkere tekst (HEX #39373A) op verschillende achtergronden. Op sommige achtergronden, zoals een zeer donkere kleur (HEX #070602), is de contrastratio slechts 1,7:1. Dit is veel lager dan de vereiste minimumwaarde van 4,5:1 voor kleine tekst. Zorg dat de tekst op alle slides een voldoende hoog contrast heeft ten opzichte van de achtergrond.

Bevinding 53: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers heeft de tekst onder de kop “Digitaal” op sommige plekken onvoldoende contrast. Daar staat de donkere tekstkleur (HEX #39373A) op een blauwe achtergrond (HEX #819DAD), met een contrastratio van 4,1:1. Deze waarde voldoet niet aan de vereiste minimumwaarde van 4,5:1. Pas de kleuren aan zodat de tekst goed leesbaar blijft.

Bevinding 54: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staat de tekst “Cijfers 2023” met een zwarte kleur (HEX #39373A) op een bruine achtergrond (HEX #B7967A). De contrastratio is 4,3:1. Voor kleine tekst is dit niet voldoende. Zorg dat het contrast minimaal 4,5:1 is.

Bevinding 55: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staan onder de kop “E-books & Luisterboeken” informatieve afbeeldingen met infografieken. In deze afbeeldingen worden verschillende combinaties gebruikt van witte tekst en grijze achtergrond (HEX #DEDEDE), samen met oranje kleuren (HEX #ED732A, HEX #EC732B, HEX #EB732B). Deze combinaties hebben onvoldoende contrast. In alle gevallen moet het contrast voor grote tekst minimaal 3,0:1 zijn en voor kleine tekst minimaal 4,5:1. Zorg dat de tekst in de afbeeldingen altijd voldoet aan deze richtlijnen zodat de informatie toegankelijk is.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 56: Wanneer de pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023 wordt bekeken met een schermresolutie van 1280 bij 1024 pixels en wordt ingezoomd tot 400%, is het einde van het woord "Jaarverslag" niet zichtbaar. Zorg dat alles nog werkt en leesbaar is als je inzoomt tot 400% op een scherm van 1280 bij 1024 pixels.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 57: Op pagina https://www.bibliotheekdalfsen.nl/ staat een carrousel. Onder de carrousel zijn drie grijze stippen (HEX #999999) zichtbaar tegen een witte achtergrond. Deze dienen om de actieve slide aan te geven. De contrastratio van 2,8:1 is te laag voor informatieve elementen. Voor dit soort visuele aanduidingen geldt een minimum contrastratio van 3,0:1. Zorg dat deze indicatoren voldoende contrast hebben met de achtergrond.

Bevinding 58: Op pagina https://www.bibliotheekdalfsen.nl/ verandert de kleur van de rand bij toetsenbordfocus op sommige links van zwart naar oranje (HEX #FF7320), bijvoorbeeld bij “Meer spannende boeken”, “Naar het Taalpunt” en “Naar het Infopunt”. De contrastratio van deze oranje rand tegen de witte achtergrond is 2,7:1. Dit is lager dan de vereiste minimumwaarde van 3,0:1 voor focusindicatoren. Pas de kleuren aan zodat het contrast aan de minimale vereisten voldoet.

Bevinding 59: Op pagina https://www.bibliotheekdalfsen.nl/word-lid-van-de-bibliotheek.html komt hetzelfde probleem voor bij links die eruitzien als knoppen, zoals “Ja, ik word lid!” en “Lees meer”. De oranje randkleur in de focustoestand heeft onvoldoende contrast met de achtergrond. Ook hier is de contrastratio lager dan 3,0:1. Dit probleem komt voor op meerdere pagina’s van de site.

Bevinding 60: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html heeft de knop “Verzenden” bij toetsenbordfocus een oranje rand (HEX #FF7320) tegen een witte achtergrond. De contrastratio is 2,7:1. Ook hier voldoet de aangepaste focusindicator niet aan de minimale eis van 3,0:1.

Bevinding 61: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat onder de kop “Taalpunt” een link “Leren” met een aangepaste focusindicator: een oranje rand (HEX #FF7320) tegen een lichtoranje achtergrond (HEX #FDE5D0). De contrastratio van 2,2:1 is te laag. Aangezien dit een visueel aangepaste focusindicator is, moet deze voldoen aan de minimale contrastratio van 3,0:1.

Bevinding 62: Op pagina https://www.bibliotheekdalfsen.nl/zoekresultaten.website.html?q=dalfsen staat in de zijbalk onder de kop “Verfijnen op resultaten” een accordion “Type”. Wanneer dit element toetsenbordfocus krijgt, verandert het pijltje van zwart naar oranje (HEX #FF7320) tegen een witte achtergrond. De contrastratio van 2,7:1 voldoet niet aan de minimale vereiste van 3,0:1 voor informatieve iconen. Pas de kleur aan zodat deze goed zichtbaar blijft bij focus.

Bevinding 63: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen staat onder de kop “Activiteiten | Wat is er in de Bibliotheek te doen?” een filter met een invoerveld “Zoek op trefwoord”. De rand van dit veld is grijs (HEX #CCCCCC) tegen een witte achtergrond. De contrastratio is slechts 1,6:1. De rand van een interactief element moet minimaal een contrastratio van 3,0:1 hebben ten opzichte van de achtergrond. De huidige stijl maakt het moeilijk zichtbaar voor bezoekers met een visuele beperking.

Bevinding 64: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger.html staan onder de kop “Alle vrijwilligersfuncties” uitklapbare onderdelen (accordions). Wanneer een accordion focus krijgt met het toetsenbord, verandert het bijbehorende pictogram (“+” of “–”) van zwart naar oranje (HEX #FF7320) tegen een witte achtergrond. De contrastratio van 2,7:1 is onvoldoende. De minimale contrastratio voor informatieve iconen is 3,0:1. Zorg dat de pictogrammen beter zichtbaar zijn bij focus.

Bevinding 65: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers staan onder de kop “E-books & Luisterboeken” infografieken waarin verschillende kleurcombinaties zijn gebruikt. Daarbij worden witte en grijze teksten (HEX #DEDEDE) gecombineerd met oranje kleuren (HEX #ED732A, HEX #EC732B, HEX #EB732B). Deze combinaties leveren in alle gevallen een te laag contrast op, variërend van minder dan 3,0:1 tot minder dan 4,5:1. Voor grote tekst is een minimum van 3,0:1 vereist, voor kleine tekst 4,5:1. Zorg dat alle informatieve elementen in de afbeeldingen voldoen aan de contrastnormen.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 66: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs toont de menuknop met drie horizontale lijnen een submenu als de muisaanwijzer over deze knop wordt bewogen, maar deze functionaliteit is niet beschikbaar voor gebruikers die alleen een toetsenbord gebruiken. Dit submenu werkt niet voor bezoekers die alleen met het toetsenbord navigeren. Zij kunnen het menu niet oproepen. Zorg dat de inhoud van het menu ook toegankelijk is voor bezoekers die met het toetsenbord navigeren.

2.2 Genoeg tijd

2.2.1 Timing aanpasbaar (Niveau A)

Informatie over succescriterium 2.2.1 Timing aanpasbaar

Uitkomst: Onvoldoende

Bevinding 67: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html maakt het formulier uitsluitend gebruik van HTML5-validatie voor alle invoervelden. De foutmeldingen die hierdoor verschijnen, verdwijnen te snel. Er is dus sprake van een tijdslimiet. Bezoekers krijgen hierdoor mogelijk niet voldoende tijd om de meldingen te lezen of hierop te reageren. Voeg daarom altijd zelf foutmeldingen toe aan het formulier, zodat deze duidelijk zichtbaar blijven en pas verdwijnen wanneer de gebruiker daar zelf actie op onderneemt. Controleer ook of er nog andere formulieren op de website zijn met hetzelfde probleem. Een soortgelijk probleem doet zich ook voor bij formulieren op de pagina's https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html en https://www.bibliotheekdalfsen.nl/klantenservice/Adreswijziging.html.

2.2.2 Pauzeren, stoppen, verbergen (Niveau A)

Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen

Uitkomst: Onvoldoende

Bevinding 68: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staat een carrousel die elke paar seconden een nieuwe afbeelding weergeeft. Deze carrousel kan niet worden gestopt, gepauzeerd of verborgen. Bewegende content kan storend zijn voor mensen met een cognitieve beperking. De bewegende inhoud zorgt voortdurend voor afleiding terwijl ze de tekst op de pagina proberen te lezen. Daarom moet er een manier zijn waarmee bezoekers beweging kunnen stoppen, pauzeren of verbergen. Dit geldt voor alle bewegende, knipperende, scrollende of automatisch actualiserende content die tegelijk met andere informatie wordt getoond, automatisch start en langer dan 5 seconden speelt.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 69: Op pagina https://www.bibliotheekdalfsen.nl/word-lid-van-de-bibliotheek.html ontbreekt een title-element. Dit element moet op elke pagina aanwezig zijn en een unieke tekst bevatten die de inhoud van de pagina beschrijft, bij voorkeur gevolgd door de naam van de organisatie. Deze titel verschijnt in de browsertab en helpt bezoekers om snel te herkennen waar de pagina over gaat, vooral bij het gebruik van meerdere tabbladen of hulpsoftware. Voeg het title-element toe aan de HTML van de pagina en geef het een duidelijke en beschrijvende tekst, zoals bijvoorbeeld: “Lid worden van de bibliotheek – Bibliotheek Dalfsen”.

Bevinding 70: In pdf-document https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-3-functieprofiel-vrijwillige.pdf is de titel niet ingesteld in documenteigenschappen. Zelfs als er een titel op de eerste pagina staat, moet ook in de pdf-instellingen een documenttitel ingesteld worden. Als een pdf geopend wordt in een pdf-lezer (zoals Adobe Acrobat of een browser), staat de bestandsnaam meestal bovenaan in de titelbalk, bijvoorbeeld document123.pdf. Maar als een documenttitel in de pdf-metadata is ingesteld, dan wordt die titel in plaats van de bestandsnaam getoond. Dit maakt het document toegankelijker voor bezoekers met verschillende beperkingen. Zij kunnen dan snel en gemakkelijk zien of het document relevant is. Dit kan aangepast worden in de bestandseigenschappen van het bronbestand of van het pdf-document.
Hetzelfde probleem met de titel staat in het pdf-document https://www.bibliotheekdalfsen.nl/dam/bestanden/Vrijwilligers/241106_vrijwilligersbeleidbijlage-3-4-functieprofiel-vrijwillige.pdf.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 71: Op pagina https://www.bibliotheekdalfsen.nl/zoekresultaten.website.html?q=dalfsen is de volgorde van de toetsenbordfocus niet logisch. Na het activeren van de zoekknop in de header verspringt de focus direct naar de zoekresultaten, terwijl visueel gezien de filters in de zijbalk boven de resultaten staan. Pas de volgorde van de focus aan zodat deze aansluit op de visuele structuur: eerst de filters, daarna de zoekresultaten. Zo kunnen bezoekers die met het toetsenbord navigeren de inhoud beter volgen en bedienen.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 72: Op pagina https://www.bibliotheekdalfsen.nl/ staan in de header naast de link “Inloggen” iconen van Facebook en Instagram die functioneren als links. Deze links hebben geen tekstalternatief, waardoor het doel van de links niet duidelijk is voor bezoekers die hulpsoftware gebruiken. Voeg een duidelijke beschrijving toe aan elke link, bijvoorbeeld met een tekstalternatief of aria-label, zodat duidelijk is dat de links leiden naar de Facebook- en Instagrampagina van de bibliotheek.

Bevinding 73: Op pagina https://www.bibliotheekdalfsen.nl/ staan onder de kop “Nieuws van de Bibliotheek Dalfsen” afbeeldingen die als links functioneren, maar een leeg alt-attribuut hebben. Daardoor hebben deze links geen inhoud en is het linkdoel onduidelijk. Voeg betekenisvolle inhoud toe aan de links, bijvoorbeeld een tekst binnen het a-element of een aria-label, zodat hulpsoftwaregebruikers weten waar de link naartoe leidt.

Bevinding 74: Op pagina https://www.bibliotheekdalfsen.nl/ staat in de carrousel onder de kop een dia met de tekstlink “Meer” onder het blokje “Boetevrij & gratis lidmaatschap tot 27 jaar”. Deze linktekst geeft geen duidelijke aanwijzing over de bestemming van de link. Vervang deze tekst of breid deze uit met een beschrijvende linktekst, bijvoorbeeld “Lees meer over boetevrij & gratis lidmaatschap tot 27 jaar”. Als dit visueel te lang is, kan het gedeelte buiten beeld worden geplaatst voor visuele gebruikers, maar wel toegankelijk blijven voor hulpsoftware.

Bevinding 75: Op pagina https://www.bibliotheekdalfsen.nl/word-lid-van-de-bibliotheek.html staat onder de kop “Of je gaat volledig digitaal!” een link met de tekst “Lees meer”. Deze tekst maakt niet duidelijk waar de link naartoe leidt. Ook de links “Ja, ik word lid!” geven zonder extra context geen duidelijke bestemming aan. Zorg dat alle linkteksten helder beschrijven wat de bezoeker kan verwachten na het aanklikken, bijvoorbeeld door aan te vullen met de naam van de actie of het onderwerp. Visueel kan dit verborgen worden als het ontwerp dit vereist.

Bevinding 76: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen staan meerdere links met de tekst “Meer lezen” die niet duidelijk maken waar ze naartoe leiden. Zorg dat deze linkteksten worden aangevuld met context, zodat het linkdoel helder wordt. Ook hier kan aanvullende tekst visueel verborgen worden als dat beter past binnen de vormgeving.

Bevinding 77: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat onder de kop “Taalpunt” een link met de tekst “Leren” die wordt aangekondigd als “before Leren” door hulpsoftware. Deze toegankelijke naam is onduidelijk en verwarrend. Zorg dat de toegankelijke naam alleen de relevante linktekst bevat en dat deze tekst duidelijk maakt waar de link naartoe leidt.

Bevinding 78: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs staan onder de carrousel links met de tekst “Vorige” en “Volgende” waarin niet-leesbare tekens voorkomen, zoals “less” en “greater” symbolen. Deze symbolen verstoren de begrijpelijkheid van de linktekst. Verwijder de tekens en zorg dat de linkteksten duidelijk en beschrijvend zijn, zodat het doel van de link voor iedereen begrijpelijk is.

Bevinding 79: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers komt hetzelfde probleem voor met de links onderaan de pagina. De linkteksten bevatten symbolen die niet goed worden uitgesproken door hulpsoftware. Verwijder deze symbolen en geef de links beschrijvende teksten.

Bevinding 80: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda/volwassenen-18/4347-oefenpunt-dinsdag-17-juni-2025 staan onder de knop “Terug” links naar Facebook en Twitter. Deze links bestaan alleen uit iconen zonder tekstalternatief. Omdat er geen inhoud is, is het doel van de links niet duidelijk voor hulpsoftware. Het toevoegen van een title-attribuut is niet voldoende. Voeg daarom een tekstalternatief of aria-label toe dat duidelijk maakt waar de links naartoe leiden.

2.4.6 Koppen en labels (Niveau AA)

Informatie over succescriterium 2.4.6 Koppen en labels

Uitkomst: Onvoldoende

Bevinding 81: Op pagina https://www.bibliotheekdalfsen.nl/ staat bovenaan een carrousel met een knop “Volgende” voor navigatie. Deze knop werkt correct, maar de toegankelijke naam is niet beschrijvend genoeg. Voor bezoekers die hulpsoftware gebruiken is het niet duidelijk wat er precies gebeurt bij activering van de knop. Pas de toegankelijke naam aan naar “Volgende slide” om duidelijk te maken dat hiermee naar de volgende dia in de carrousel wordt genavigeerd.

Bevinding 82: Op dezelfde pagina staat onder de kop “Nieuwe boeken” nog een carrousel met knoppen “Vorige” en “Volgende”. Ook hier zijn de toegankelijke namen van deze knoppen niet voldoende beschrijvend. Verander deze naar respectievelijk “Vorige slide” en “Volgende slide” zodat het doel van de knoppen duidelijk wordt.

Bevinding 83: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat onder de kop “De ervaring van Gerda” een iframe met daarin een video. Het iframe heeft het title-attribuut “Video”. Deze titel is te algemeen en geeft geen informatie over de inhoud van de ingesloten video. Geef het iframe een unieke en betekenisvolle titel, zodat bezoekers die schermlezers gebruiken begrijpen waar de video over gaat.

Bevinding 84: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html bevat de video bedieningsknoppen met foutieve informatie over toetsenbordbediening. De afspeelknop heeft bijvoorbeeld de toegankelijke naam “Afspelen sneltoets k”, terwijl deze sneltoets niet beschikbaar is. Dit kan verwarrend zijn voor bezoekers die afhankelijk zijn van hulpsoftware. Verwijder of corrigeer deze verwijzingen naar niet-bestaande sneltoetsen in de toegankelijke namen van de knoppen.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 85: Wanneer de website voor het eerst wordt bezocht, verschijnt er bovenaan de pagina een cookiebanner. Bij het klikken op de knop “Lees hier meer over cookies” wordt een dialoogvenster geopend. In dit venster is de toetsenbordfocus niet zichtbaar op de “X”-knop waarmee het venster gesloten kan worden. De focus moet altijd duidelijk zichtbaar zijn op interactieve elementen zoals knoppen. Bezoekers die met het toetsenbord navigeren moeten kunnen zien waar de focus zich bevindt, zodat ze weten wanneer ze een knop kunnen activeren. Zorg dat de “X”-knop een goed zichtbare focusindicator krijgt.

Bevinding 86: Op alle pagina’s van de website, bijvoorbeeld op https://www.bibliotheekdalfsen.nl/, is in de header de toetsenbordfocus niet zichtbaar op de twee keuzerondjes “Catalogus” en “Site”. Deze elementen zijn met het toetsenbord bereikbaar, maar zonder zichtbare focus kunnen bezoekers die toetsenbordnavigatie gebruiken niet bepalen welk element actief is. Zorg dat beide radio buttons een goed waarneembare focusindicator krijgen.

Bevinding 87: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs is de toetsenbordfocus niet zichtbaar op de links “Vorige” en “Volgende” onder de carrousel. Zonder zichtbare focusindicator is het voor bezoekers niet duidelijk waar ze zich bevinden. Deze focus moet altijd zichtbaar zijn op interactieve elementen. Pas de opmaak aan zodat de focus goed zichtbaar is bij gebruik van het toetsenbord.

Bevinding 88: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers is hetzelfde probleem aanwezig bij de links “Vorige” en “Volgende” onderaan de pagina. De toetsenbordfocus is hier niet zichtbaar. Ook deze links moeten een duidelijke focusindicator krijgen.

Bevinding 89: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda/volwassenen-18/4347-oefenpunt-dinsdag-17-juni-2025 is de focus niet zichtbaar op de link “Terug”. Zonder zichtbare focus kunnen bezoekers die afhankelijk zijn van toetsenbordnavigatie deze link niet bedienen. Zorg dat de link een goed zichtbare focus krijgt.

Bevinding 90: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen is de toetsenbordfocus niet zichtbaar op de links met de tekst “Meer lezen”. Ook hier ontbreekt een focusindicator. Deze links moeten een visueel waarneembare focus krijgen zodat bezoekers weten welke link actief is.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 91: In de header van de website staat een invoerveld voor zoeken. De placeholder-tekst is "Waar ben je naar op zoek?", maar de toegankelijke naam van het invoerelement is "Zoekopdracht". Als de toegankelijke naam van een element niet hetzelfde is als de zichtbare tekst (in dit geval de placeholder-tekst), is het voor bezoekers die gebruikmaken van spraaksoftware niet mogelijk om het element te bedienen. Zij spreken een commando uit door de zichtbare tekst voor te lezen. Als deze niet voorkomt in de toegankelijke naam die in de code staat, werkt het commando niet. Zorg dat de toegankelijke naam de zichtbare tekst bevat, en zet deze tekst het liefst vooraan in de naam. De toegankelijke naam mag ook precies hetzelfde zijn als de zichtbare tekst.

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 92: Op pagina https://www.bibliotheekdinkelland.nl/ is het lang-attribuut onjuist ingesteld op "nl_NL". De juiste waarde voor het lang-attribuut is "nl-NL", met een koppelteken in plaats van een underscore. Dit is belangrijk zodat hulpsoftware de juiste uitspraakregels kan toepassen voor Nederlandse inhoud. Pas het lang-attribuut aan naar "nl-NL" op deze pagina.

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 93: Op pagina https://www.bibliotheekdalfsen.nl/leren/nederlands-leren.html staat een kopje "Уроки мови для українців" zonder taalcode. Deze tekst wordt nu voorgelezen volgens de uitspraakregels van de primaire taal van de pagina. Die is ingesteld in het lang-attribuut op het html-element, in dit geval op “nl”. De schermlezer moet hier echter op de taal van deze zin overschakelen. Geef deze anderstalige inhoud daarom een lokaal lang-attribuut met de juiste waarde. Als de tekst bijvoorbeeld in het Oekraïens is, voeg je `lang="uk"` toe aan het element. Een soortgelijke uitgave staat op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen met het evenement "Taallessen voor Oekraïners / Уроки мови для українців (5)" dat ook veel tekst in het Oekraïens bevat.

Bevinding 94: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs, onder het kopje "Activiteiten in de bibliotheek", staat een carrousel. In een van de dia's staat een link met de tekst"Read more" in het Engels, wat afwijkt van de primaire taal van de pagina. Deze tekst wordt nu voorgelezen volgens de uitspraakregels van de primaire taal van de pagina. Die is ingesteld in het lang-attribuut op het html-element, in dit geval op “nl”. De schermlezer moet hier echter op de taal van deze zin overschakelen. Geef deze anderstalige inhoud daarom een lokaal lang-attribuut met de juiste waarde. Als de tekst bijvoorbeeld in het Engels is, voeg je `lang="en"` toe aan het element. Of vertaal deze link naar het Nederlands.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 95: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html wordt in het formulier de HTML5-validatie gebruikt, waarbij standaard HTML5-foutberichten worden weergegeven voor alle invoervelden als het formulier wordt verzonden met onjuiste gegevens. Deze foutmeldingen worden niet door alle browsers en schermlezers even goed ondersteund. Elke browser toont de meldingen anders, en niet altijd op een toegankelijke manier: de melding is soms kortaf en onvolledig. Voeg daarom altijd zelf foutmeldingen toe aan het formulier. Controleer of er nog meer formulieren zijn die dit probleem hebben. Een soortgelijk probleem doet zich ook voor bij invoervelden op de pagina's https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html en https://www.bibliotheekdalfsen.nl/klantenservice/Adreswijziging.html.

Bevinding 96: Op pagina https://www.bibliotheekdalfsen.nl/klantenservice/contact/contactformulier.html staat een formulier met een aantal verplichte velden die zijn gemarkeerd met een sterretje. Als een sterretje wordt gebruikt om verplichte velden aan te geven, geef dan een instructie boven het formulier zoals "Velden gemarkeerd met * zijn verplicht". Zie ook het formulier op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html.

3.3.2 Labels of instructies (Niveau A)

Informatie over succescriterium 3.3.2 Labels of instructies

Uitkomst: Onvoldoende

Bevinding 97: Op pagina https://www.bibliotheekdalfsen.nl/over-ons/word-vrijwilliger/aanmeldformulier-vrijwilliger.html is een formulier aanwezig. De select-elementen onder "Geboortedatum" hebben geen permanent label. Invoervelden moeten een label hebben dat altijd zichtbaar is. Dat kan een tekst zijn of een afbeelding (icoon). Een placeholder-tekst kan niet als label dienen, omdat deze tekst verdwijnt als de bezoeker begint te typen. Een invoerveld zonder zichtbaar label kan mensen in de war brengen, omdat ze niet weten wat ze moeten invullen. Voeg een label toe in de vorm van een tekst of een icoon. Hetzelfde probleem doet zich voor met het veld "Zoek op trefwoord" op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen.

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 98: Op alle pagina’s van de website https://www.bibliotheekdalfsen.nl/ opent de knop “Lees hier meer over cookies” een dialoogvenster, maar in de code wordt deze functionaliteit niet aangegeven. Voeg aan de knop het attribuut aria-haspopup="dialog" toe om aan te geven dat de knop een dialoogvenster opent. De cookiebanner heeft niet de juiste rol om aan te geven dat dit een dialogvenster is.

Bevinding 99: Op alle pagina's van de website staan in de header naast "Inloggen" de links "Facebook" en "Instagram". Deze links hebben geen toegankelijke namen. Als gevolg hiervan kunnen gebruikers van ondersteunende technologieën het doel of de bestemming van deze links niet bepalen. Wijs ze toegankelijke namen toe die hun doel duidelijk omschrijven.
Ditzelfde probleem is te zien op pagina https://weblocal.bibliotheekdalfsen.nl/agenda/volwassenen-18/4347-oefenpunt-dinsdag-17-juni-2025 met links naar sociale media "Facebook" en "Twitter" onder de knop "Terug".

Bevinding 100: Op alle pagina's van de website heeft de zoekbalk in het bovenste menu een zoekknop zonder toegankelijke naam. Hierdoor is het voor bezoekers die een schermlezer gebruiken niet duidelijk wat deze knop doet. Geef een toegankelijke naam aan de knop.

Bevinding 101: Op pagina https://www.bibliotheekdalfsen.nl/, onder het kopje "Nieuws van de Bibliotheek Dalfsen", missen de links die bestaan uit afbeeldingen toegankelijke namen. Hierdoor begrijpen bezoekers die een schermlezer gebruiken niet wat de bestemming of de functie is van de link. Daarnaast zijn deze links verborgen met aria-hidden. Geef deze link een toegankelijke naam die het doel van de link beschrijft. Dit vereist het verwijderen van het aria-hidden attribuut en het anders opbouwen van deze cards. Zorg dat enkel de titel van het artikel een link is en maak met JavaScript de hele card klikbaar.

Bevinding 102: Op pagina https://weblocal.bibliotheekdalfsen.nl/agenda?referer=dalfsen onder de kop “Activiteiten | Wat is er in de Bibliotheek te doen?” zijn de select-elementen aanwezig. Zie bijvoorbeeld het select-element met de zichtbare tekst "Voor welke leeftijd". De toegankelijke namen ontbreken. Hierdoor zijn elementen niet toegankelijk. Geef de select-elementen toegankelijke namen.

Bevinding 103: Op pagina https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/jeugd-onderwijs opent een menuknop met drie horizontale regels het navigatiemenu. Deze knop heeft momenteel geen toegankelijke naam. Zorg dat de knop een toegankelijke naam krijgt, en dat deze naam van de knop de functie van de knop beschrijft. Zorg ook dat de naam mee verandert als de functie van de knop verandert (“menu openen” of “menu sluiten”).
Hetzelfde probleem kan worden gevonden op andere pagina's van dit subdomein, bijvoorbeeld https://weblocal.bibliotheekdalfsen.nl/jaarverslag-2023/cijfers.

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-07-04 16:45:22 v2.4-011