Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website van Bibliotheek Barneveld

(Alleen de bevindingen)

Scope van de evaluatie

Naam website De bibliotheek Barneveld
Datum 15 augustus 2025
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op bibliotheekbarneveld.nl
  • Alle PDF's op bibliotheekbarneveld.nl
  • Alle pagina's op barneveld-kootwijkerbroek-voorthuizen.op-shop.nl.
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: 99

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.bibliotheekbarneveld.nl/ staat in de header een logo. De alt-tekst van dit logo is “Bibliotheek Barnveld”. Deze alt-tekst is niet voldoende. Omdat het logo in een link staat en er geen zichtbare linktekst is, wordt de alt-tekst ook als linktekst gebruikt. Daarom moet in de alt-tekst worden vermeld dat het om een logo gaat en dat de link naar de homepagina verwijst. Dit probleem komt voor op alle pagina’s van de website en op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/.

Bevinding 2: Op pagina https://www.bibliotheekbarneveld.nl/ staat in de header een knop met een vergrootglasicoon. Dit icoon is een informatieve afbeelding die is toegevoegd met een CSS-pseudo-element. Er is geen tekstalternatief beschikbaar. Wanneer een knop alleen uit een afbeelding bestaat, moet worden aangegeven wat de functie van de knop is. Als deze informatie ontbreekt, is de functie van de knop niet duidelijk voor hulpsoftware. De beschrijving moet worden toegevoegd via een alt-tekst bij het img-element, een aria-label of een tekst die visueel verborgen is, maar wel toegankelijk is voor hulpsoftware.

Bevinding 3: Op pagina https://www.bibliotheekbarneveld.nl/ staan onder de kop “In de Bibliotheek” drie decoratieve afbeeldingen. Eén afbeelding heeft als alt-tekst “Kopiëren & printen”, wat een herhaling is van een onderliggende kop. De andere twee afbeeldingen gebruiken een spatie als waarde van het alt-attribuut: alt=” “. Daardoor worden deze afbeeldingen niet verborgen voor hulpsoftware. Een decoratieve afbeelding geeft geen extra informatie en moet worden verborgen voor hulpsoftware. Voor afbeeldingen in een img-element kan hiervoor een leeg alt-attribuut worden gebruikt: alt="". Omdat deze afbeeldingen ook als link fungeren, moet op een andere manier een toegankelijke naam worden aangeboden. Op pagina https://www.bibliotheekbarneveld.nl/ komt een vergelijkbaar probleem voor bij afbeeldingen onder de koppen “Computercursussen”, “Lid worden” en “Taalcursussen”. Deze afbeeldingen zijn decoratief, maar worden niet verborgen voor hulpsoftware. Omdat ze ook als link dienen, moet er een alternatieve manier worden gebruikt om een toegankelijke naam aan de link te geven.

Bevinding 4: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html staat naast de kop “Minima; Voor mensen met een minimuminkomen” een logo van de gemeente Barneveld met een leeg alt-attribuut. Als het alt-attribuut leeg is (alt=""), negeren schermlezers de afbeelding. Een lege alt-tekst betekent dat de afbeelding puur decoratief is en geen informatie geeft. Informatieve afbeeldingen moeten altijd een alt-tekst krijgen. Voeg een alt-tekst toe die de volledige tekst van het logo bevat.

Bevinding 5: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html staat onder de kop “Jeugd | 0-6 jaar” een pijl-icoon naast de link “Jeugd & Educatie”. Dit icoon is toegevoegd met CSS via een ::before pseudo-element en wordt door schermlezers aangekondigd als “before”. Een decoratieve afbeelding geeft geen extra informatie en moet worden verborgen voor hulpsoftware. Dit probleem komt ook voor op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html bij de link “Informatiepunt”, op pagina https://www.bibliotheekbarneveld.nl/over-ons/jaarverslag.html bij de link “Terug naar Over ons” en op enkele andere pagina’s.

Bevinding 6: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html staan onder de kop “Jeugd | 0-6 jaar” afbeeldingen met alt-tekst die als decoratief kunnen worden aangemerkt. Deze afbeeldingen moeten een leeg alt-attribuut krijgen. Daarna moet van deze links een card worden gemaakt. Alleen de tekst “Ga naar de boekentips op onderwerp” mag een link zijn. Door middel van JavaScript moet de hele card (afbeelding en tekst samen) klikbaar worden gemaakt.

Bevinding 7: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html komt een vergelijkbaar probleem voor bij aanklikbare afbeeldingen onder de knop “Bekijk ook de boeken op onderwerp”. Dit probleem doet zich ook voor op pagina https://www.bibliotheekbarneveld.nl/collectie/inspiratie.html onder de koppen “Speciaal voor jeugd & jongeren”, “Digitale bronnen” en “Wat vind je van deze pagina’s?”. Deze afbeeldingen moeten als decoratief worden gemarkeerd met een leeg alt-attribuut en via JavaScript moet de hele card klikbaar worden gemaakt, waarbij alleen de linktekst een link is.

Bevinding 8: Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html staan onder de kop “Websites van de overheid” verschillende logo’s. Voor de meeste logo’s is de zichtbare tekst gelijk aan de bijbehorende kop, wat kan worden gezien als een toegankelijke alternatieve tekst. Sommige logo’s bevatten echter meer informatie dan in de kop staat. In die gevallen moet alle tekst uit het logo worden opgenomen in het tekstalternatief. Dit geldt voor de logo’s “Centraal Justitieel Incassobureau Ministerie van Justitie en Veiligheid”, “Dienst Uitvoering Onderwijs Ministerie van Onderwijs, Cultuur en Wetenschap”, “LBIO Landelijk Bureau Inning Onderhoudsbijdragen” en “Logius Ministerie van Binnenlandse Zaken en Koninkrijksrelaties”.

Bevinding 9: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ hebben de afbeeldingen bij de evenementen alt-tekst die de kop van evenementen herhaalt. Een blinde bezoeker hoort dezelfde informatie twee keer. Dit kan worden opgelost door twee links samen te voegen en de afbeelding een leeg alt-attribuut te geven.

Bevinding 10: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ staat bovenaan een slider met dia’s die bestaan uit een afbeelding en een tekst. De afbeeldingen hebben alt-teksten die de bijbehorende kopteksten herhalen, zoals “Zomerspeurtocht | Zomer voor alle prentenboeken!”. Omdat deze afbeeldingen geen extra informatie geven die niet al in de koppen staat, kunnen ze als decoratief worden beschouwd. De alt-attributen van deze afbeeldingen moeten daarom leeg zijn (alt=""), zodat gebruikers van hulpsoftware geen overbodige informatie te horen krijgen.

Bevinding 11: Op pagina https://www.bibliotheekbarneveld.nl/collectie/inspiratie.html staan onder de kop “Nog meer boekentips” twee afbeeldingen die functioneren als link. De alt-attributen van deze afbeeldingen zijn leeg (alt=""), waardoor ze verborgen zijn voor hulpsoftware. Deze afbeeldingen zijn interactief, maar er is geen tekstalternatief aanwezig. Daardoor hebben de links geen inhoud. Om deze links toegankelijk te maken, moet een tekstalternatief aan de afbeeldingen worden toegevoegd dat het linkdoel beschrijft. Zo wordt duidelijk waar de links naartoe leiden voor bezoekers die hulpsoftware gebruiken.

Bevinding 12: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf staan decoratieve afbeeldingen die onterecht zijn getagd als figures zonder beschrijving. Dit komt onder andere voor op pagina’s 1, 3, 4 en meerdere andere pagina’s. De figure-tag is bedoeld voor informatieve afbeeldingen en moet altijd een beschrijving bevatten. Deze afbeeldingen moeten worden gemarkeerd als artefact, zodat ze worden verborgen voor schermlezers.

Bevinding 13: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf is een logo opgenomen als figure, maar zonder tekstalternatief. Dit komt voor op pagina’s 1 en 30. Afbeeldingen die met de figure-tag zijn geplaatst, moeten altijd een beschrijving (alt-tekst) hebben. De figure-tag is alleen bedoeld voor informatieve afbeeldingen. Schermlezers lezen de alt-tekst voor, zodat blinde bezoekers ook alle informatie tot zich kunnen nemen. Omdat de alt-tekst nu ontbreekt, lezen schermlezers alleen “afbeelding” voor. Blinde bezoekers kunnen hierdoor het gevoel krijgen dat ze inhoud missen. Er moeten alt-teksten worden toegevoegd aan deze informatieve afbeeldingen.

Bevinding 14: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf is op pagina 1 een decoratieve afbeelding onterecht getagd als figure zonder beschrijving. De figure-tag is alleen bedoeld voor informatieve afbeeldingen en heeft altijd een beschrijving nodig. Deze afbeelding moet worden gemarkeerd als artefact, zodat ze wordt verborgen voor schermlezers.

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 15: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html staat onder de kop “Voorleesfilmpjes” een video met een voice-over. De video bevat ondertiteling, maar deze is automatisch gegenereerd en daardoor onnauwkeurig. Video’s waarin gesproken wordt, moeten altijd goede ondertiteling krijgen. Zo krijgen bezoekers die de video niet (goed) kunnen horen ook alle informatie. Deze ondertiteling moet exact hetzelfde zijn als wat wordt gezegd. De automatisch gegenereerde ondertiteling voldoet hier niet aan, omdat er punctuatie ontbreekt en er fouten in kunnen zitten.

Bevinding 16: Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html is hetzelfde probleem aanwezig bij de video. Deze video bevat automatisch gegenereerde ondertiteling, die niet nauwkeurig is. Ook hier moet correcte ondertiteling worden toegevoegd die overeenkomt met de gesproken tekst.

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 17: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html staat onder de kop “Voorleesfilmpjes” een video. Aan het einde van de video, vanaf 0:53, wordt het logo van “De Voorleeshoek” getoond. Bezoekers die blind of slechtziend zijn, missen hierdoor informatie. Het beste is om een audiobeschrijving toe te voegen die de visuele elementen in de video beschrijft, zoals namen, functies, logo’s en teksten. Een andere oplossing is het plaatsen van een geschreven tekst (een media-alternatief). Maar om te voldoen aan succescriterium 1.2.5 moet er in ieder geval een audiobeschrijving aanwezig zijn.

Bevinding 18: Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html staat onder de kop “Hoe kunnen we je helpen?” een video. Aan het begin van de video, tussen 0:02 en 0:05, wordt de tekst “Heeft u vragen over de overheid?” getoond, samen met het logo van “de Bibliotheek informatiepunt Digitale Overheid”. Aan het einde van de video, vanaf 1:08, wordt hetzelfde logo opnieuw weergegeven.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 19: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html voldoet de video niet aan succescriterium 1.2.5 omdat audiodescriptie ontbreekt. Voor deze video is een audiobeschrijving verplicht (niveau AA), omdat er voldoende ruimte is binnen het bestaande audiotrack om de visuele informatie te beschrijven. Een media-alternatief is in dit geval niet meer toegestaan als oplossing. Dit is belangrijk voor mensen die de video’s niet (goed) kunnen zien. Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html komt hetzelfde probleem voor bij de video. Ook hier moet een audiobeschrijving worden toegevoegd, omdat een media-alternatief niet meer voldoet aan de eisen van succescriterium 1.2.5.

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 alle pagina’s van de website, bijvoorbeeld op pagina https://www.bibliotheekbarneveld.nl/, staat in de header een groep van twee keuzerondjes (“Catalogus” en “Site”), voorafgegaan door de tekst “Zoeken in”. Visueel vormen deze elementen een groep, maar die relatie is niet vastgelegd in de HTML. Dit kan worden opgelost door de elementen in een fieldset-element te plaatsen. Een fieldset met interactieve inhoud moet een naam hebben. Hiervoor kan het legend-element worden gebruikt. Plaats hierin de tekst “Zoeken in”.

Bevinding 21: Op pagina https://www.bibliotheekbarneveld.nl/ staat onderaan een carrousel grijze stippen die aangeven 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 hulpsoftware 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 22: Op pagina https://www.bibliotheekbarneveld.nl/ volgt een kop van niveau 3 direct op een andere kop van hetzelfde niveau, namelijk “In de Bibliotheek” en “Kopiëren & printen”. Als twee koppen van hetzelfde niveau direct onder elkaar staan zonder inhoud ertussen, dan is één van de koppen niet op de goede manier gebruikt. Pas de tekst aan, zodat de kopregelniveaus de structuur van de tekst correct weergeven.

Bevinding 23: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html staan de koppen “Kies uit deze abonnementen” en “BoekStart & Jeugd t/m 17 jaar” direct onder elkaar zonder inhoud ertussen. Hierdoor wordt de structuur van de pagina niet correct weergegeven. De kopniveaus moeten worden aangepast, zodat ze aansluiten op de inhoudsstructuur.

Bevinding 24: Op pagina https://www.bibliotheekbarneveld.nl/over-ons.html staan de koppen “Vestigingen” en “Barneveld - Hoofdvestiging”, en ook de koppen “Bestuur en Personeel” en “Raad van Toezicht” direct onder elkaar zonder tussenliggende inhoud. De structuur van de pagina moet worden aangepast door het juiste kopniveau toe te passen, zodat duidelijk is welke onderdelen bij elkaar horen.

Bevinding 25: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html staan onder de kop “Kies uit deze abonnementen” twee ul-elementen direct achter elkaar, terwijl ze samen één lijst vormen. Door de lijst op te splitsen in twee afzonderlijke ul-elementen, wordt de inhoud voor hulpsoftware als twee losse lijsten gepresenteerd. Dit kan tot verwarring leiden. Deze items moeten in één ul-element worden geplaatst. Op pagina https://www.bibliotheekbarneveld.nl/404.html komt een vergelijkbaar probleem voor, waarbij meerdere ul-elementen direct na elkaar staan terwijl ze visueel en inhoudelijk één lijst vormen. Ook hier moeten de items worden samengevoegd in één ul-element, zodat de structuur van de lijst voor hulpsoftware duidelijk en logisch is.

Bevinding 26: Op pagina https://www.bibliotheekbarneveld.nl/over-ons.html staat onder de kop “ANBI” een tekstblok dat visueel bestaat uit twee alinea’s, gescheiden door witruimte. In de code is dit echter als één p-element opgemaakt. Deze visuele structuur moet correct worden weergegeven in de HTML. Elke alinea moet in een apart p-element worden geplaatst, zodat het aantal visuele alinea’s gelijk is aan het aantal p-elementen.

Bevinding 27: Op pagina https://www.bibliotheekbarneveld.nl/home/Toegankelijkheid.html zijn de teksten “Huidige status” en “Contact” visueel vormgegeven als koppen, maar ze zijn niet opgemaakt als heading-elementen. Bezoekers die hulpsoftware gebruiken kunnen hierdoor deze secties niet herkennen of er direct naartoe navigeren. Deze koppen moeten worden omgezet in heading-elementen om de structuur van de pagina toegankelijk te maken.

Bevinding 28: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Wijziging-abonnement.html is de tekst “Automatische incasso” visueel een kop, maar ontbreekt de markering als heading-element. Ook hier geldt dat deze kop in een heading-element moet worden geplaatst, zodat hulpsoftware de structuur correct kan interpreteren. Op pagina https://www.bibliotheekbarneveld.nl/over-ons.html zijn de teksten “Cultuur daar geef je om!”, “Bezoldiging” en “Inkomen” visueel als koppen gepresenteerd, maar niet als heading gemarkeerd. Deze teksten moeten worden omgezet naar heading-elementen om de inhoud van de pagina toegankelijk te maken voor hulpsoftware.

Bevinding 29: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Adreswijziging.html bevat het formulier een groep van vier invoervelden met het label “Initialen en achternaam”, voorafgegaan door de tekst “Naam van meeverhuizende huisgenoten:”. Visueel vormen deze velden een groep, maar deze relatie is niet vastgelegd in de HTML. De individuele labels geven onvoldoende context over de bedoeling van de groep. Dit kan worden opgelost door een fieldset-element te gebruiken waarin de vier invoervelden zijn opgenomen. 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.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html staat onder de kop “Kom naar de Bibliotheek voor al je vragen over de overheid” een tabel. In deze tabel zijn de cellen met de namen van bibliotheken gemarkeerd met het th-element, terwijl dit gegevenscellen zijn. Dit is niet correct. Gebruik voor cellen met gegevens het td-element, zodat de tabelsemantiek juist blijft en de structuur voor hulpsoftware klopt.

Bevinding 31: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ bevat de zijbalk met filters groepen keuzevakjes onder de labels “Categorie”, “Locatie”, “Tag” en “Wanneer”. Visueel zijn de checkboxen gegroepeerd, maar deze relatie is niet in de code vastgelegd. Hierdoor herkent hulpsoftware niet dat de checkboxen bij het groepslabel horen. De individuele labels worden voorgelezen zonder context. Dit kan worden opgelost door gebruik te maken van fieldset- en legend-elementen. Andere oplossingen zijn ook mogelijk, zolang de relatie tussen de groep en de checkboxen duidelijk is voor hulpsoftware.

Bevinding 32: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie is de tekst “Thomas Borggrefe” gemarkeerd met een strong-element in plaats van een kop-element. Het strong-element is niet bedoeld voor koppen. Koppen zijn bedoeld om de structuur van een tekst aan te geven en moeten altijd worden gemarkeerd met een kop-element, zoals h3. Alleen op die manier begrijpt hulpsoftware de hiërarchie en de betekenis van de tekst. Het strong-element is wel geschikt om nadruk te geven aan een woord of een deel van een zin.

Bevinding 33: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie wordt het em-element verkeerd gebruikt in de tekst die begint met “Theatermaker Thomas Borggrefe laat zich…”. Het em-element heeft een semantische functie: het geeft aan dat een tekstdeel extra nadruk krijgt. Dit element mag niet worden gebruikt voor alleen een visueel effect, zoals cursieve tekst. Gebruik hiervoor CSS.

Bevinding 34: Op https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ is een slider aanwezig. De items in de slider zijn in een lijst gezet. De lijstitems (li-elementen) hebben in de code allemaal echter de role=button. Hierdoor bevat de lijst (ul-element) geen lijstitems meer, maar knoppen. En dat is niet toegestaan volgens de HTML-standaard.

Bevinding 35: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf zijn alle koppen niet als headings gemarkeerd. Dit geldt bijvoorbeeld voor “Jaarverslag 2024” op pagina 1, “Inhoud” op pagina 2, “Voorwoord” en “Huis van Ontmoeting” op pagina 3 en vergelijkbare koppen op andere pagina’s in het document. De visuele structuur komt hierdoor niet overeen met de structuur van de tags in het document. Vervang de p-tag door de h-tag, zodat de tagstructuur overeenkomt met de visuele structuur van het document.

Bevinding 36: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf zijn ook alle koppen visueel als kop weergegeven, maar niet gemarkeerd met heading-tags. De visuele en semantische structuur van het document komen hierdoor niet overeen. De p-tags moeten worden vervangen door h-tags.

Bevinding 37: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf is een inhoudsopgave opgenomen. De links naar de pagina’s in de inhoudsopgave zijn echter niet voorzien van de Reference-tag. Deze tag is noodzakelijk zodat schermlezers de inhoudsopgave correct kunnen interpreteren. De juiste tags voor de inhoudsopgave zijn: TOC, TOCI, Reference en Link. In hetzelfde PDF-document staat onderaan pagina 3 een lijst met drie items. Deze lijst is niet correct gemarkeerd in de tags. Inhoud die visueel is vormgegeven als een lijst, moet ook als lijst worden gemarkeerd in de tagstructuur. Alleen dan krijgen blinde bezoekers dezelfde informatiestructuur aangeboden als ziende bezoekers. De lijst moet worden gemarkeerd met de L- en Li-tags. Op pagina 26 staat onder de kop “Financiële middelen” een lijst die niet correct is gemarkeerd. Ook deze lijst moet worden voorzien van de juiste lijststructuur met L- en Li-tags, zodat de informatie duidelijk en correct toegankelijk is voor hulpsoftware.

Bevinding 38: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf staan op pagina 3 voetnoten die niet zijn voorzien van de vereiste Reference- en Note-tags. Doordat deze tags ontbreken, kan voorleessoftware niet herkennen welke voetnoot bij welke verwijzing in de hoofdtekst hoort. Hierdoor worden de voetnoten als losse tekst voorgelezen, zonder duidelijke koppeling aan de juiste plek in de tekst. Dit kan verwarrend zijn voor mensen die afhankelijk zijn van schermlezers. Een vergelijkbaar probleem komt voor op pagina’s 8 en 18 van hetzelfde document.

Bevinding 39: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf staat op pagina 6 onder de kop “Zomerlezen” een datatabel. In deze tabel ontbreken de th-tags. Bij een datatabel moeten de cellen in de koprij worden gemarkeerd met th-tags, zodat schermlezers de relatie tussen de kop en de onderliggende datacellen begrijpen. De datacellen zelf moeten met td-tags worden gemarkeerd. Dit probleem komt ook voor bij alle andere tabellen in het document, vanaf pagina 18 en verder.

Bevinding 40: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf zijn meerdere infographic-achtige elementen opgenomen waarin gegevens visueel worden gepresenteerd via opmaak, iconen en kleur. In de tagstructuur zijn deze infographics echter niet goed weergegeven. Belangrijke informatie is vaak opgesplitst in losse span-elementen zonder duidelijke semantische samenhang. Hierdoor ontvangen schermlezergebruikers gefragmenteerde inhoud, zonder inzicht in de relaties tussen getallen, labels of visuele groeperingen. Dit belemmert het begrip van de informatie en maakt het document ontoegankelijk. Voor infographic-inhoud moeten logische gegevensblokken semantisch worden gegroepeerd met passende tags, zoals table, list of duidelijk gestructureerde div- of section-containers. Voeg beschrijvende koppen of bijschriften toe waar nodig en zorg dat de visuele relaties behouden blijven in de leesvolgorde. Zo wordt de informatie begrijpelijk voor gebruikers van hulpsoftware en voldoet het document aan de toegankelijkheidsnormen.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevinding 41: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ is de volgorde van HTML-elementen binnen de event-artikelen niet correct. In de huidige code staat eerst een afbeelding met link, gevolgd door de datum, de kop en daarna overige tekst. Dat kan verwarrend zijn voor bezoekers die een schermlezer gebruiken. Dit kan worden opgelost door alle inhoud die bij een bepaalde kop hoort, in de code onder die kop te plaatsen. De visuele vormgeving mag wel afwijken van de volgorde in de code.

Bevinding 42: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf is de leesvolgorde niet logisch. De tabel op pagina 6 is in de tags pas toegevoegd na de inhoud van pagina 9. Schermlezers lezen een PDF-document in de volgorde van de tags. Als die volgorde niet logisch is, wordt het document moeilijk te volgen voor bezoekers die gebruik maken van hulpsoftware. De tagstructuur moet worden aangepast zodat de leesvolgorde overeenkomt met de visuele en inhoudelijke volgorde. Een vergelijkbaar probleem doet zich voor met de tekst die begint met “Voor mij was de geschiedenis…” op pagina 15. In de tags is deze tekst pas na de inhoud van pagina 16 opgenomen, wat verwarrend is.

Bevinding 43: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf presenteert de visuele opmaak de informatie in een duidelijke en logische volgorde (via infographics), maar de volgorde van de tags volgt deze structuur niet. Hierdoor krijgen gebruikers van hulpsoftware de inhoud in een verwarrende of onlogische volgorde te horen, wat het begrip belemmert. De volgorde van de tags moet overeenkomen met de visuele en logische leesvolgorde, zodat de informatie op een begrijpelijke manier wordt gepresenteerd aan gebruikers van hulpsoftware.

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 44: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html bevat het formulier invoervelden voor persoonlijke informatie, zoals achternaam, e-mailadres en telefoonnummer. Deze velden missen het autocomplete-attribuut. Invoervelden voor persoonlijke informatie moeten het autocomplete-attribuut hebben, zodat browsers en hulpsoftware kunnen helpen bij het invullen. Bijvoorbeeld door velden automatisch in te vullen. Gebruik het autocomplete-attribuut voor alle velden waarin persoonlijke informatie wordt gevraagd. Meer informatie over het gebruik van autocomplete en verplichte waardes is te vinden op: https://www.w3.org/Translations/WCAG22-nl/#input-purposes.

Bevinding 45: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Adreswijziging.html ontbreekt het autocomplete-attribuut eveneens bij de invoervelden voor persoonlijke gegevens. Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Wijziging-abonnement.html komt hetzelfde probleem voor. De persoonlijke invoervelden in dit formulier missen het autocomplete-attribuut. Ook deze velden moeten worden voorzien van het juiste attribuut zodat hulpsoftware en browsers de gebruikers kunnen ondersteunen.

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevinding 46: Bij weergave van de website op een klein scherm verschijnt het mobiele navigatiemenu in de footer. Wanneer de opties “Home”, “Menu” of “Zoeken” via het toetsenbord focus krijgen, verandert de kleur van het icoon en de tekst van wit naar oranje. Deze kleurverandering is het enige visuele verschil ten opzichte van de niet-geselecteerde staat. Voor bezoekers met een visuele beperking of kleurenblindheid is deze verandering niet duidelijk zichtbaar. Er moet een extra visuele focusindicator worden toegevoegd, zoals een dikkere rand, een onderstreping of een verandering van de achtergrondkleur met voldoende contrast.

Bevinding 47: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html wordt bij het invoerveld “Wil je een bijlage meesturen?” een aangepaste focusindicator gebruikt die alleen zichtbaar is via een achtergrondkleurverandering. Het gebruik van alleen kleur om focus aan te geven is niet voldoende, omdat de contrastratio tussen de gefocuste en niet-gefocuste toestand van de achtergrondkleur minder dan 3,0:1 is. Voor bezoekers met een visuele beperking of kleurenblindheid is deze subtiele verandering vaak niet zichtbaar. Ook voor toetsenbordgebruikers moet duidelijk zijn waar de focus zich bevindt. Er moet een extra visuele aanduiding worden toegevoegd, zoals een dikkere rand of onderstreping.

Bevinding 48: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Adreswijziging.html vertoont het invoerveld “Deze ADRESWIJZIGING gaat in per” hetzelfde probleem. De focusindicator is alleen gebaseerd op een verandering in achtergrondkleur met te weinig contrast. Ook hier moet een extra visueel kenmerk worden toegevoegd, zoals een duidelijke rand of onderstreping, zodat het veld goed zichtbaar is tijdens toetsenbordnavigatie.

Bevinding 49: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Wijziging-abonnement.html komt dit probleem voor bij meerdere invoervelden en bij het keuzevakje “Machtiging”. De focus is alleen te herkennen aan een lichte kleurverandering, met onvoldoende contrast. Er moet een extra visueel kenmerk worden toegevoegd om de focus zichtbaar te maken voor toetsenbordgebruikers.

Bevinding 50: Op pagina https://www.bibliotheekbarneveld.nl/collectie/zoeken-in-de-catalogus.html heeft de combobox naast het label “Sorteer op:” een focusindicator die alleen werkt via kleurverandering. De contrastratio tussen de gefocuste en niet-gefocuste toestand voldoet niet aan de minimale eis van 3,0:1. Onderaan dezelfde pagina vertoont de combobox naast “Spring direct naar pagina:” hetzelfde gedrag. Voor beide comboboxen moet een duidelijkere focusindicator worden toegevoegd, zoals een rand of visueel kenmerk dat voldoet aan de contrastvereisten.

Bevinding 51: Op pagina https://www.bibliotheekbarneveld.nl/collectie/zoeken-in-de-catalogus.html wordt in de paginering onder de zoekresultaten kleur als enige visuele indicator gebruikt om de actieve pagina aan te duiden. De achtergrond van de actieve pagina is oranje, maar het onderscheid met de andere pagina’s is minimaal. Deze informatie is daardoor niet duidelijk voor bezoekers met een visuele beperking. Voeg een extra visueel kenmerk toe, zoals een onderstreping of achtergrond met voldoende contrast, om de actieve pagina herkenbaar te maken.

Bevinding 52: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ staan bovenaan vier filters. Wanneer deze worden geopend (nu alleen met een muisklik), tonen de checkboxen en keuzerondjes daarin een aangepaste focusindicator die alleen berust op achtergrondkleur. Het kleurcontrast tussen de gefocuste en niet-gefocuste toestand is te laag (minder dan 3,0:1), waardoor de focus onvoldoende zichtbaar is voor bezoekers met een visuele beperking en voor toetsenbordgebruikers. Voeg een duidelijke focusindicator toe, zoals een rand, een onderstreping of een achtergrondkleur met voldoende contrast.

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 53: In de header van de website is een zoekveld aanwezig. Wanneer dit veld in hover-toestand is, heeft de grijze placeholdertekst (HEX #757575) op een lichtgrijze achtergrond (HEX #EDEDED) een contrastratio van 3,9:1. In focus-toestand heeft dezelfde placeholdertekst op een oranje achtergrond (HEX #FDE5D0) een contrastratio van 3,8:1. Deze contrastverhoudingen zijn te laag. Zorg dat de placeholdertekst een contrastratio van minimaal 4,5:1 ten opzichte van de achtergrond heeft. Een vergelijkbaar probleem doet zich voor bij mobiele weergave van de website, wanneer het menu “Zoeken” wordt geselecteerd voor de velden “Zoeken in de collectie” en “Zoeken binnen de website”.

Bevinding 54: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html staan onder de kop “Veelgestelde vragen over abonnementen” accordeons. Wanneer deze accordeons toetsenbordfocus krijgen, verandert de tekstkleur van de koppen van zwart naar oranje (HEX #FF7320). Deze oranje tekst op een witte achtergrond heeft een contrastratio van 2,7:1. Omdat de tekst kleiner is dan 24px en niet vetgedrukt, moet de minimale contrastratio 4,5:1 zijn. Eenzelfde probleem komt voor op pagina https://www.bibliotheekbarneveld.nl/collectie/zoeken-in-de-catalogus.html bij de accordeons onder de kop “Verfijnen op resultaten” en op pagina https://www.bibliotheekbarneveld.nl/klantenservice/website-en-apps1.html.

Bevinding 55: Op pagina https://www.bibliotheekbarneveld.nl/collectie/zoeken-in-de-catalogus.html staan in de zijbalkfilters aantallen resultaten voor bepaalde categorieën of woorden. Deze aantallen zijn weergegeven in donkergrijze tekst (HEX #757575) op een lichtgrijze achtergrond (HEX #EDEDED), met een contrastratio van 3,9:1. Deze waarde is lager dan de vereiste minimale contrastratio van 4,5:1 voor kleine tekst.

Bevinding 56: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ staat in de beschrijving van het evenement “Bieb Escape Game” de tekst “nog 10 beschikbaar” in groen (HEX #468847) op een witte achtergrond. Deze combinatie heeft een contrastratio van 4,3:1. Omdat het om kleine tekst gaat, is dit onvoldoende. Voor kleine tekst is een minimale contrastratio van 4,5:1 vereist.

Bevinding 57: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/2025/jaarverslag-2024-definitief.pdf komt op meerdere pagina’s oranje tekst (HEX #EE7203) op een witte achtergrond voor en andersom. De contrastratio is 2,98:1, wat te laag is. Voor grote tekst is minimaal 3,0:1 vereist en voor kleine tekst 4,5:1. Voorbeelden hiervan zijn de koppen “Inhoud”, “Voorwoord” op pagina 2, “Voorwoord” en “Huis van Ontmoeting” op pagina 3 en alle oranje teksten vanaf pagina 17 tot het einde van het document.
Op pagina 2 staat de groene tekst (HEX #569B62) “Leven lang leren” op een witte achtergrond, met een contrastratio van 3,4:1. Dit is te laag voor kleine tekst. Vergelijkbare teksten in dezelfde kleur staan op pagina 14 (“Activiteiten”), en op pagina 16 (“Leven lang leren”, “Cursusaanbod” en “Digitaal Burgerschap”). Ook deze teksten voldoen niet aan de vereiste minimale contrastratio van 4,5:1 voor kleine tekst.

Bevinding 58: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf komt veel oranje tekst (HEX #EE7203) voor op een lichtoranje achtergrond (HEX #FDE6D1). Deze combinatie heeft een contrastratio van 2,5:1. Dit is te laag, zowel voor kleine tekst (minimum 4,5:1) als voor grote tekst (minimum 3,0:1). Voorbeelden zijn de teksten “Vestigingen, collectie en abonnementen”, “Verdeling totaal aantal leden”, “14.229” en andere. Er is ook groene tekst (HEX #599B62) te zien op een lichtgroene achtergrond (HEX #E2EADF), met een contrastratio van 2,7:1. Ook dit is onvoldoende. Teksten zoals “Leven lang leren”, “Activiteiten in en om de Bibliotheek”, “186” en andere voldoen niet aan de minimale contrastvereisten.

1.4.4 Herschalen van tekst (Niveau AA)

Informatie over succescriterium 1.4.4 Herschalen van tekst

Uitkomst: Onvoldoende

Bevinding 59: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ zijn bij een schermresolutie van 1280 bij 1024 pixels en een zoomniveau van 200% de links in de header zoals “Activiteiten”, “Cursussen”, “Collectie” en drie andere niet zichtbaar en niet bedienbaar. Als een bezoeker inzoomt, moet alles nog werken. Navigatie-elementen moeten dan nog steeds toegankelijk en bruikbaar zijn voor iedereen, ook voor bezoekers met een visuele beperking die afhankelijk zijn van zoomniveau.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 60: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ zijn bij een schermresolutie van 1280 bij 1024 pixels en een zoomniveau van 200% de links in de header, zoals “Activiteiten”, “Cursussen”, “Collectie” en drie andere, niet zichtbaar en niet bedienbaar. Als een bezoeker inzoomt, moet alles nog werken. Navigatie-elementen moeten ook bij vergroting toegankelijk en bruikbaar blijven.

Bevinding 61: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie zijn bij een schermresolutie van 1280 bij 1024 pixels en een zoomniveau van 400% de teksten in de tabelkoppen niet zichtbaar. Ook is de combobox “Locatie” niet zichtbaar en niet bedienbaar. Wanneer een gebruiker inzoomt, moet de functionaliteit behouden blijven. Alle informatie en interactieve onderdelen moeten dan nog steeds toegankelijk en correct weergegeven worden.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 62: Op pagina https://www.bibliotheekbarneveld.nl/ staat onder de header een carrousel. In de slides van deze carrousel staan links zoals “Cursusoverzicht”, “Alles over de nieuwe expositie” en andere. Deze links gebruiken een aangepaste toetsenbordfocusindicator in de vorm van een oranje rand (HEX #FF7320) op een witte achtergrond. De contrastratio tussen deze kleuren is 2,7:1, wat lager is dan de vereiste minimale contrastratio van 3,0:1 voor aangepaste focusstijlen. Op de site wordt niet de standaard focusindicator gebruikt, maar een via CSS toegevoegde variant. Voor aangepaste focusindicatoren geldt wel een contrastvereiste. Deze moet minimaal 3,0:1 zijn. Een vergelijkbaar probleem komt voor bij andere links op dezelfde pagina, zoals “Meer spannende boeken”, “Hulp in de Bibliotheek” en “Onze computercursussen”. Ook op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html bij de knop “Verzenden”, op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html en op andere pagina’s van de website komt dit probleem voor.

Bevinding 63: Op pagina https://www.bibliotheekbarneveld.nl/ staat onder de carrousel een rij met drie grijze stippen (HEX #999999) op een witte achtergrond. Deze geven aan welke slide actief is. De contrastratio tussen de stippen en de achtergrond is 2,8:1. Dit is te laag voor informatieve visuele aanduidingen. Voor dergelijke indicatoren geldt een minimale contrastratio van 3,0:1. Deze moet verhoogd worden zodat alle gebruikers duidelijk kunnen zien welke slide actief is.

Bevinding 64: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html staan onder de kop “Veelgestelde vragen over abonnementen” accordeons. Wanneer deze elementen toetsenbordfocus krijgen, verandert het “+”- of “–”-icoon van zwart naar oranje (HEX #FF7320). Deze oranje icoon op een witte achtergrond heeft een contrastratio van 2,7:1. Dit is lager dan de minimale vereiste contrastratio van 3,0:1 voor informatieve elementen. Een vergelijkbaar probleem komt voor op pagina https://www.bibliotheekbarneveld.nl/collectie/zoeken-in-de-catalogus.html bij de pijltjes naast de accordeons onder de kop “Verfijnen op resultaten” en op pagina https://www.bibliotheekbarneveld.nl/klantenservice/website-en-apps1.html.

Bevinding 65: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html heeft de link “Jeugd & Educatie” onder de kop “Jeugd | 0-6 jaar” een aangepaste toetsenbordfocusindicator in de vorm van een oranje rand (HEX #FF7320) op een lichtoranje achtergrond (HEX #FDE5D0). De contrastratio tussen deze kleuren is 2,2:1. Dit is te laag voor aangepaste focusstijlen, waarvoor een minimale contrastratio van 3,0:1 geldt. Een vergelijkbaar probleem komt voor op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html bij de link “Informatiepunt” en bij mobiele weergave van de website in het “Zoeken”-menu bij de velden “Zoeken in de collectie” en “Zoeken binnen de website”.

Bevinding 66: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ staat bovenaan een slider met witte pijltjes en een navigatie met stippen. Deze elementen hebben onvoldoende contrast tegen de wisselende achtergrond van de slides. Voor interactieve elementen geldt een minimale contrastratio van 3,0:1. De huidige weergave voldoet niet aan deze eis en moet worden aangepast zodat alle gebruikers, ook bij wisselende achtergronden, kunnen zien welke elementen bedienbaar zijn.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 67: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ staan bovenaan vier filters. Deze filters zijn niet toegankelijk via het toetsenbord. Het is niet mogelijk om de comboboxen te openen en te sluiten met alleen het toetsenbord. Zorg dat alle interactieve elementen, waaronder de filters, met het toetsenbord kunnen worden bediend. Alleen dan zijn ze toegankelijk voor bezoekers die geen muis gebruiken.

2.2 Genoeg tijd

2.2.1 Timing aanpasbaar (Niveau A)

Informatie over succescriterium 2.2.1 Timing aanpasbaar

Uitkomst: Onvoldoende

Bevinding 68: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html maakt het formulier alleen gebruik van HTML5-validatie voor alle invoervelden. De foutmeldingen die daarbij getoond worden, verdwijnen te snel. Er is dus sprake van een tijdslimiet. Daarom moeten foutmeldingen altijd handmatig aan het formulier worden toegevoegd. Zo krijgen bezoekers voldoende tijd om de meldingen te lezen en te begrijpen. Controleer of er nog meer formulieren op de website zijn die ditzelfde probleem hebben. Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Adreswijziging.html komt hetzelfde probleem Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Wijziging-abonnement.html worden foutmeldingen eveneens alleen weergegeven via HTML5-validatie. Deze verdwijnen automatisch en voldoen daardoor niet aan de toegankelijkheidseisen. Ook dit formulier moet worden voorzien van handmatig toegevoegde foutmeldingen zonder tijdslimiet.

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Onvoldoende

Bevinding 69: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ zijn skiplinks aanwezig. Deze links zijn visueel zichtbaar en toegankelijk via het toetsenbord, maar functioneren niet correct. In plaats van de focus naar het bedoelde gedeelte van de pagina te verplaatsen, leiden de skiplinks door naar de homepagina https://www.bibliotheekbarneveld.nl/. Er moet een manier zijn om vaste onderdelen zoals het navigatiemenu over te slaan. Hiervoor wordt een skiplink gebruikt. Een skiplink moet de eerste link op de pagina zijn, mag verborgen zijn, maar moet zichtbaar worden zodra hij toetsenbordfocus krijgt. Zorg dat de skiplinks goed functioneren en dat de focus daadwerkelijk wordt verplaatst naar de juiste content op de pagina.

Bevinding 70: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie is hetzelfde probleem aanwezig. De skiplink is wel zichtbaar en toegankelijk via het toetsenbord, maar verplaatst de focus niet naar het bedoelde onderdeel van de pagina. Ook hier moet de skiplink correct werken en de focus verplaatsen naar het hoofdgedeelte van de pagina.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 71: Op pagina https://www.bibliotheekbarneveld.nl/word-lid-van-de-bibliotheek.html ontbreekt het title-element. Dit element moet op elke pagina aanwezig zijn en unieke tekst bevatten die de inhoud van de pagina beschrijft, bij voorkeur gevolgd door de naam van de organisatie. De tekst in het title-element wordt getoond in de tab van de browser en helpt gebruikers bij het navigeren tussen geopende pagina’s. Voeg een title-element toe aan de pagina met een duidelijke beschrijving van de inhoud.

Bevinding 72: In het PDF-document op https://www.bibliotheekbarneveld.nl/dam/bestanden/infographic_jaarverslag2024-hr.pdf is geen titel ingesteld in de bestandseigenschappen. Ook als er op de eerste pagina visueel een titel staat, moet in de metadata van het document een titel worden ingesteld. Als een pdf wordt geopend in een pdf-lezer of browser, wordt anders alleen de bestandsnaam getoond. Door een documenttitel in te stellen, wordt het document beter herkenbaar en toegankelijk voor bezoekers met een beperking. De titel kan worden toegevoegd via de bestandseigenschappen van het bronbestand of van het pdf-bestand zelf.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 73: Op alle pagina’s van de website https://www.bibliotheekbarneveld.nl/ opent de knop “Lees hier meer over cookies” in de cookiebanner een dialoogvenster. Momenteel kan de toetsenbordfocus dit venster verlaten en terechtkomen op onderliggende inhoud van de pagina. Bij dialoogvensters moet de focus binnen het venster blijven zolang het actief is. Dit voorkomt verwarring en zorgt ervoor dat bezoekers die het toetsenbord gebruiken, correct kunnen navigeren. De focus moet worden vastgezet binnen het dialoogvenster totdat het wordt gesloten via de sluitknop of met de ESC-toets. Een andere oplossing is om het venster automatisch te sluiten zodra de focus het dialoogvenster verlaat.

Bevinding 74: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ komt de toetsenbordfocus in de slider twee keer op dezelfde links terecht. Hierdoor belandt de focus soms op een onzichtbaar interactief element. De toetsenbordfocus mag niet terechtkomen op onzichtbare interactieve elementen zoals links, knoppen of formuliervelden. Als dat wel gebeurt, kunnen bezoekers per ongeluk iets activeren wat ze niet kunnen zien of begrijpen.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 75: Op pagina https://www.bibliotheekbarneveld.nl/ staat onder de header een carrousel. Twee slides in deze carrousel bevatten links met dezelfde vage linktekst “Lees meer”. Ook onder de kop “Loop je digitaal vast?” staat een link met dezelfde tekst. Deze linkteksten beschrijven niet duidelijk waar de link naartoe leidt, wat voor verwarring kan zorgen, vooral voor bezoekers met cognitieve beperkingen of voor gebruikers van schermlezers. Linkteksten die meerdere keren op een pagina voorkomen of nietszeggend zijn, geven geen duidelijke aanwijzing over de bestemming. Zorg dat duidelijk is waar een link naartoe leidt, bijvoorbeeld door de tekst aan te vullen met de titel van de doelpagina. Als het visueel al duidelijk is bij welk onderdeel de link hoort, kan de aanvullende tekst visueel verborgen worden.

Bevinding 76: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ komen vergelijkbare problemen voor. In de slider staan drie links met de tekst “Meer weten?” en in de evenementenlijst staan meerdere links met de tekst “Meer informatie”. Deze teksten geven geen specifieke informatie over de bestemming van de links. Ook hier moet de linktekst worden aangevuld met beschrijvende informatie, zodat gebruikers weten waar de link naartoe leidt. De aanvullende tekst kan visueel verborgen worden als de context op het scherm al voldoende duidelijk is.

Bevinding 77: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html staat onder de kop “Jeugd | 0-6 jaar” de link “Jeugd & Educatie” met een toegankelijke naam “before Jeugd & Educatie”. Deze naam geeft geen duidelijke beschrijving van de bestemming van de link, waardoor onduidelijkheid ontstaat voor gebruikers van schermlezers of bezoekers met cognitieve beperkingen. Zorg dat de toegankelijke naam van de link duidelijk maakt waar de link naartoe leidt.

Bevinding 78: Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html staat een soortgelijk probleem bij de link “Informatiepunt”. De toegankelijke naam geeft onvoldoende informatie over het linkdoel. De naam moet verduidelijkt worden.

Bevinding 79: Op pagina https://www.bibliotheekbarneveld.nl/over-ons/jaarverslag.html is de link “Terug naar Over ons” aanwezig met een ontoereikende toegankelijke naam. Ook hier moet de naam van de link duidelijk aangeven waar de link naartoe leidt. Dit probleem komt op meerdere pagina’s voor en moet op al die plekken worden gecorrigeerd.

2.4.6 Koppen en labels (Niveau AA)

Informatie over succescriterium 2.4.6 Koppen en labels

Uitkomst: Onvoldoende

Bevinding 80: Op pagina https://www.bibliotheekbarneveld.nl/ staat bovenaan een carrousel met een knop “Volgende” om door de slides te navigeren. Deze naam is te beperkt. De toegankelijke naam van deze knop moet worden aangepast naar “Volgende slide” om duidelijk te maken wat de functie is. Een vergelijkbaar probleem is aanwezig bij de knoppen “Vorige” en “Volgende” in de carrousel naast de kop “Nieuwe boeken” op dezelfde pagina, op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html naast de kop “Nieuwe boeken | 0-6 jaar” en op andere pagina’s met carrousels.

Bevinding 81: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html zijn afbeeldingen en links opgenomen in heading-elementen. Dit belemmert de toegankelijkheid voor bezoekers die schermlezers gebruiken, omdat zij via koppen de structuur van een pagina verkennen. Alleen tekst die daadwerkelijk de functie van een kop vervult, mag binnen een heading-element geplaatst worden. Verwijder alle inhoud zoals afbeeldingen en links uit de h3-elementen en laat enkel de tekst staan die de kop aanduidt, zoals “Homepagina” en “Klantenservice”. Een vergelijkbaar probleem komt voor op pagina https://www.bibliotheekbarneveld.nl/404.html en op pagina https://www.bibliotheekbarneveld.nl/collectie/inspiratie.html onder de kop “Speciaal voor jeugd & jongeren”.

Bevinding 82: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html bevat de video bedieningsknoppen met foutieve informatie over toetsenbordbediening. De afspeelknop heeft bijvoorbeeld als 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 verwijzingen naar niet-bestaande sneltoetsen in de toegankelijke namen van de videobediening. Een vergelijkbaar probleem komt voor bij de video op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html.

Bevinding 83: Op pagina https://www.bibliotheekbarneveld.nl/Informatiepunt/informatiepunt-digitale-overheid.html staat onder de kop “Hoe kunnen we je helpen?” een iframe met de titel “Video”. Iframes moeten een goede beschrijving hebben, die meestal wordt toegevoegd via het title-attribuut. De huidige titel geeft alleen het type inhoud aan, maar niet waar de video over gaat. De beschrijving moet uniek en betekenisvol zijn, zodat blinde bezoekers kunnen bepalen of de inhoud relevant is. De titel van het iframe moet daarom worden aangepast om de inhoud van de video duidelijk te beschrijven.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 84: Wanneer de website voor het eerst wordt bezocht, verschijnt er een cookiebanner bovenaan de pagina. Na 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. De toetsenbordfocus moet altijd zichtbaar zijn op interactieve elementen zoals links, knoppen en invoervelden. Bezoekers die met het toetsenbord navigeren moeten goed kunnen zien waar de focus zich bevindt, zodat zij weten wanneer ze op Enter moeten drukken om een knop of link te activeren.

Bevinding 85: Op alle pagina’s van de website, bijvoorbeeld op pagina https://www.bibliotheekbarneveld.nl/, is in de header de toetsenbordfocus niet zichtbaar op de twee keuzerondjes “Catalogus” en “Site”. Interactieve elementen moeten altijd een zichtbare focusindicator hebben, met voldoende contrast ten opzichte van de achtergrond en omliggende elementen.

Bevinding 86: Op pagina https://www.bibliotheekbarneveld.nl/jeugd-en-educatie/0-6.html zijn onder de knop “Bekijk ook de boeken op onderwerp” afbeeldingen aanwezig die als links fungeren en focusbaar zijn. De toetsenbordfocus is hier echter niet zichtbaar. Zorg ervoor dat alle interactieve elementen, waaronder deze afbeeldingslinks, een duidelijke en zichtbare focusindicator hebben. Een vergelijkbaar probleem doet zich voor op pagina https://www.bibliotheekbarneveld.nl/over-ons.html bij de afbeeldingslinks onder de koppen “Jaarverslagen” en “Beleidsplan 2021-2024”.

Bevinding 87: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ is de toetsenbordfocus niet zichtbaar op de links in de paginering. Ook hier moet een zichtbare focusindicator worden toegevoegd, zodat gebruikers die met het toetsenbord navigeren kunnen zien welk element de focus heeft.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 88: In de header van de website is een zoekveld aanwezig met de placeholdertekst “Waar ben je naar op zoek?”. De toegankelijke naam van dit invoerveld is echter “Zoekopdracht”. Omdat de toegankelijke naam niet overeenkomt met de zichtbare tekst, kunnen bezoekers die gebruikmaken van spraaksoftware het veld niet bedienen. Zij geven opdrachten op basis van de zichtbare tekst. Als deze tekst niet voorkomt in de toegankelijke naam, werkt het commando niet. Zorg dat de toegankelijke naam de zichtbare tekst bevat, bij voorkeur aan het begin van de naam. De toegankelijke naam mag ook precies hetzelfde zijn als de zichtbare tekst.

Bevinding 89: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie bevat de tabel een select-element zonder zichtbaar label. De eerste optie “Locatie” fungeert als een pseudo-label, maar verdwijnt zodra een andere waarde wordt gekozen. Hierdoor kunnen bezoekers die gebruikmaken van spraaksoftware het element niet correct bedienen. Het label moet altijd zichtbaar blijven en opgenomen zijn in de toegankelijke naam van het element. Als de zichtbare tekst niet voorkomt in de toegankelijke naam, werkt het stemcommando niet. Zorg dat de toegankelijke naam de zichtbare tekst bevat, bij voorkeur aan het begin. De toegankelijke naam mag ook exact gelijk zijn aan 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 90: Op pagina https://www.bibliotheekbarneveld.nl/ is de waarde van het lang-attribuut onjuist ingesteld als “nl_NL”. De correcte waarde voor het lang-attribuut is “nl-NL”, met een koppelteken in plaats van een underscore. Dit is belangrijk zodat hulpsoftware, zoals schermlezers, de juiste uitspraakregels voor Nederlandse inhoud kan toepassen. Pas het lang-attribuut aan naar “nl-NL” op deze pagina. Dit komt ook voor op https://www.bibliotheekbarneveld.nl/home/Toegankelijkheid.html.

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 91: De slider op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/ bevat navigatiepijlen en stipknoppen met toegankelijke namen in het Engels, zoals “previous slide / item”, “next slide / item”, “slide item 1” enzovoort. Deze teksten worden door schermlezers uitgesproken volgens de uitspraakregels van de hoofdtaal van de pagina, die in dit geval Nederlands is. Hierdoor klinken de Engelse teksten onnatuurlijk of onbegrijpelijk. Vertaal de toegankelijke namen naar het Nederlands, zodat schermlezers ze correct uitspreken en gebruikers begrijpen wat de functie van elk element is.

3.2 Voorspelbaar

3.2.2 Bij input (Niveau A)

Informatie over succescriterium 3.2.2 Bij input

Uitkomst: Onvoldoende

Bevinding 92: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie staat in de tabel een select-element met het label “Locatie”. Wanneer een andere optie wordt geselecteerd, wordt de pagina direct opnieuw geladen. Dit mag niet onverwacht gebeuren. Bezoekers moeten van tevoren gewaarschuwd worden dat het selecteren van een andere optie een herlaadactie veroorzaakt. Een alternatieve oplossing is om een knop toe te voegen waarmee de bezoeker de selectie bevestigt, zodat de actie pas wordt uitgevoerd nadat daar bewust voor is gekozen.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 93: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html maakt het formulier gebruik van HTML5-validatie. Wanneer het formulier met onjuiste of onvolledige gegevens wordt verzonden, verschijnen standaard HTML5-foutmeldingen. Deze foutmeldingen worden niet door alle browsers en schermlezers op een toegankelijke en consistente manier ondersteund. In sommige browsers zijn de meldingen kortaf of onvolledig, wat verwarrend kan zijn voor gebruikers. Voeg daarom altijd zelf foutmeldingen toe aan het formulier, zodat deze duidelijk en toegankelijk zijn. Controleer of er nog meer formulieren zijn die dit probleem hebben. Een vergelijkbaar probleem komt voor op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Adreswijziging.html. Ook hier worden standaard HTML5-foutmeldingen gebruikt, die in toegankelijkheid en duidelijkheid tekortschieten. Voeg handmatige foutmeldingen toe aan het formulier om dit op te lossen. Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/wijzigingen-lidmaatschap/Wijziging-abonnement.html is hetzelfde probleem aanwezig. De standaard foutmeldingen moeten worden vervangen of aangevuld met toegankelijke foutmeldingen die voor iedereen begrijpelijk zijn.

Bevinding 94: Op pagina https://www.bibliotheekbarneveld.nl/klantenservice/contactformulier.html zijn meerdere verplichte velden aangeduid met een asterisk (*). Als hiervoor gekozen wordt, is het belangrijk om boven het formulier een instructie te plaatsen, zoals “Velden met een * zijn verplicht”. Zo wordt het voor alle bezoekers duidelijk wat het sterretje betekent. Dit is een best practice voor toegankelijke formulieren.

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 95: Wanneer de website voor het eerst wordt bezocht, verschijnt er bovenaan een cookiebanner. Na het klikken op de knop “Lees hier meer over cookies” wordt een dialoogvenster geopend. Dit dialoogvenster heeft geen juiste ARIA-rol en geen toegankelijke naam. Hierdoor kunnen schermlezers niet aangeven dat het om een dialoogvenster gaat en ook niet wat de inhoud ervan is. Dit kan worden opgelost door het dialoogvenster het attribuut role="dialog" te geven en een toegankelijke naam toe te voegen via bijvoorbeeld aria-label="Beschrijving van de inhoud".

Bevinding 96: Op alle pagina’s van de website heeft de zoekbalk in het bovenste menu een zoekknop zonder toegankelijke naam. Daardoor is het voor bezoekers die gebruikmaken van schermlezers niet duidelijk wat de knop doet. De knop moet een toegankelijke naam krijgen, bijvoorbeeld met aria-label="Zoeken". Een vergelijkbaar probleem doet zich voor op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/. Dit komt doordat de tekst van de knop wordt verborgen met display:none in de CSS, wat niet is toegestaan. Dit verwijdert namelijk zaken uit de DOM voor iedere bezoeker. Gebruik de CSS clip techniek om zaken enkel visueel te verbergen, maar niet voor hulpsoftware.

Bevinding 97: Wanneer de website https://www.bibliotheekbarneveld.nl/ op een klein scherm wordt bekeken en de optie “Zoeken” in het hoofdmenu wordt geopend, verschijnt er een submenu met invoervelden voor “Zoeken in de collectie” en “Zoeken binnen de website”. De knoppen naast deze velden hebben geen toegankelijke naam. Dit komt doordat de tekst van de knop wordt verborgen met display:none in de CSS, wat niet is toegestaan. Dit verwijdert namelijk zaken uit de DOM voor iedere bezoeker. Gebruik de CSS clip techniek om zaken enkel visueel te verbergen, maar niet voor hulpsoftware.

Bevinding 98: Op kleine schermen worden het hamburgermenu en de zoekoptie op alle pagina's van https://www.bibliotheekbarneveld.nl/ weergegeven als interactieve elementen. Deze zijn echter foutief gecodeerd als invoerelementen met role="checkbox". Hierdoor wordt de functie niet juist doorgegeven aan hulpsoftware. De knop voor het openen en sluiten van het menu moet als knop worden herkend. Gebruik hiervoor een echt button-element of voeg het attribuut role="button" toe. Geef de status van het menu aan met bijvoorbeeld aria-expanded="true" of aria-expanded="false", zodat schermlezers kunnen aangeven of het menu open of gesloten is. Pas deze elementen aan zodat ze correct functioneren voor bezoekers die niet visueel kunnen waarnemen of het menu geopend is.

Bevinding 99: Op pagina https://barneveld-kootwijkerbroek-voorthuizen.op-shop.nl/327/helderman-voorstelling-over-dementie staat in de tabel een select-element “Locatie”. Dit element heeft een leeg label, omdat het in de CSS wordt verborgen met display:none. Dat is niet toegestaan. Daardoor is het niet toegankelijk voor bezoekers die hulpsoftware gebruiken. Verwijder display:none en gebruik een andere techniek die wel op een toegankelijke manier zaken visueel verbergt (de CSS clip techniek bijvoorbeeld).

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-09-11 14:28:44 v2.4-011