Rapport:
Audit digitale toegankelijkheid website Westfriese Bibliotheken

Uitkomst: Onvoldoende

Bevindingen: Het logo bovenaan de website https://www.westfriesebibliotheken.nl/ toont de volledige tekst "de Bibliotheek Westfriese Bibliotheken", maar het alt-attribuut is "Westfriese Bibliotheken".
In het tekstalternatief staat dus niet alle tekst die in het logo te zien is. Dit moet wel. Zo weten bezoekers die het plaatje niet kunnen zien, ook precies wat er staat. Verander het tekstalternatief zodat de volledige tekst van het logo erin staat: "Logo de Bibliotheek Westfriese Bibliotheken". Omdat het logo een link is, moet ook het doel van de link worden aangegeven (naar de homepage gaan).

Op alle pagina's van de website https://www.westfriesebibliotheken.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 de alternatieve tekst aangeven wat de functie van de knop is. Het is niet voldoende om te beschrijven wat er te zien is. Als deze informatie ontbreekt, is de functie van de knop niet duidelijk voor schermlezers. De beschrijving moet worden toegevoegd via een aria-label of een tekst die visueel verborgen is, maar wel toegankelijk is voor schermlezers.

Op pagina https://www.westfriesebibliotheken.nl/collectie.html staat naast de kop "Als lezen lastig is..." een afbeelding met als tekstalternatief "lachende dame in bieb". Deze tekst beschrijft de afbeelding niet correct.
Als dit een informatieve afbeelding is, moet het alt-attribuut een duidelijke en correcte beschrijving van de afbeelding bevatten. In dit geval is de afbeelding echter vooral decoratief en voegt deze geen betekenisvolle informatie toe. Daarom kan het alt-attribuut beter leeg worden gelaten (alt="").
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/activiteiten.html bij de afbeelding boven de kop "Word lid". Verberg de afbeelding met alt="".

Op pagina https://www.westfriesebibliotheken.nl/activiteiten/nationale-voorleesdagen.html zijn in de sectie "Agenda" de afbeeldingen naast de evenementen aanklikbaar en functioneren ze als link. De toegankelijke namen van deze links komen uit de alt-teksten van de afbeeldingen, die dezelfde informatie herhalen als de nabijgelegen evenementkoppen. Hierdoor krijgen schermlezergebruikers dubbele informatie. Geef alternatieve teksten die de naastliggende inhoud niet dupliceren. Een andere oplossing is om de afbeeldingen als decoratief te markeren met een leeg alt-attribuut (alt="") en alleen de evenementkop tot link te maken. Het klikbare gebied kan dan visueel met CSS of JavaScript over de afbeelding worden uitgebreid.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/activiteiten/persoonlijkeontwikkeling.html met een vergelijkbare "Agenda"-sectie, en ook op pagina https://wfb.op-shop.nl/.

Op pagina https://www.westfriesebibliotheken.nl/activiteiten/persoonlijkeontwikkeling.html staat naast de link "Terug naar Activiteiten" onder de kop "Persoonlijke ontwikkeling" een pijltje. Dit icoon is toegevoegd met CSS via een ::before-pseudo-element en wordt door schermlezers uitgesproken als "before". Omdat het een decoratief pictogram betreft dat geen aanvullende informatie bevat, moeten niet alleen het pictogram zelf, maar ook de inhoud ervan worden verborgen voor schermlezers.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html bij de link "Jeugd & Jongeren".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 staan boven de beoordelingssterren twee afbeeldingen met de alt-teksten "School" en "Sprookjes". Deze dupliceren de naastliggende teksten. Omdat deze afbeeldingen geen aanvullende informatie geven, kunnen ze als decoratief worden beschouwd. Het alt-attribuut van deze afbeeldingen moet leeg zijn (alt="") om dubbele informatie voor schermlezergebruikers te voorkomen.

Pagina 1 van het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf bevat een logo "de Bibliotheek Westfriese Bibliotheken" dat als artefact is geplaatst.
Afbeeldingen die als artefact zijn toegevoegd, zijn niet zichtbaar voor schermlezers. De informatie in deze afbeeldingen is daardoor niet toegankelijk voor bezoekers die de tekst laten voorlezen. Informatieve afbeeldingen moeten via een Figure-tag worden geplaatst en een alt-tekst krijgen die de afbeelding duidelijk beschrijft.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html staat een video met automatisch gegenereerde ondertitels. Op 0:54 zegt een jongen "Ik ben er onwijs bij gebaat". In de ondertiteling staat "Ik ben er onwijs bij gebouwd".
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.
Op pagina https://www.westfriesebibliotheken.nl/ontdekwatjeallemaalkan.html staan ook drie video's met automatisch gegenereerde ondertitels. Er zitten geen fouten in deze ondertitels, maar wel ontbreekt de punctuatie, waardoor de betekenis van wat er gezegd wordt niet altijd duidelijk is. Voeg zelfgemaakte ondertitels toe.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/ontdekwatjeallemaalkan.html staan drie video's. Alle drie bevatten ze aan het einde (vanaf 0:26) verschillende teksten waarin de diensten van de bibliotheek worden voorgesteld.
Bezoekers die blind of slechtziend zijn, missen hierdoor informatie. Het beste kan een audiobeschrijving toegevoegd worden 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 ook te voldoen aan succescriterium 1.2.5 moet er sowieso een audiobeschrijving zijn.
Een vergelijkbaar probleem speelt bij de video op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: De video's op pagina https://www.westfriesebibliotheken.nl/ontdekwatjeallemaalkan.html, zoals eerder beschreven bij succescriterium 1.2.3, voldoen niet aan succescriterium 1.2.5, dat een audiobeschrijving voor video's vereist. Specifiek is een audiobeschrijving (Level AA) nodig, omdat er voldoende ruimte is binnen het bestaande audiospoor.
Een media-alternatief is hier niet meer toegestaan als oplossing. Dit is van belang voor mensen die de video's niet (goed) kunnen zien.
Een vergelijkbaar probleem speelt bij de video op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html.

Uitkomst: Onvoldoende

Bevindingen: In de header van de website https://www.westfriesebibliotheken.nl/ staat een groep van twee keuzerondjes ("Catalogus" en "Website"), voorafgegaan door de tekst "Zoeken in". Visueel vormen deze elementen een groep, maar die relatie is niet vastgelegd in de code.
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".

Op pagina https://www.westfriesebibliotheken.nl/Contact.html staat een kop van niveau 3 direct gevolgd door een andere kop van hetzelfde niveau: zie "Veelgestelde vragen" en "Lid worden".
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. Een kop moet altijd content hebben en dat is niet het geval als deze direct wordt opgevolgd door een kop van hetzelfde niveau. Pas de tekst aan, zodat de kopregelniveaus de structuur van de tekst correct weergeven.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/over-ons/visie/verslagen.html bij de koppen "Documenten acrhief" en "ANBI", op pagina https://www.westfriesebibliotheken.nl/collectie.html bij de koppen "Ontdek je volgende lievelingsboek:" en "1. Catalogus: vind je boek", op pagina https://www.westfriesebibliotheken.nl/lid-worden.html bij de koppen "Kies uit de volgende abonnementen" en "Lees je veel? Kies voor Optimaal Genieten" en andere.

Pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html bevat een formulier waarin label-elementen niet expliciet gekoppeld zijn aan de bijbehorende invoervelden.
Label-elementen moeten altijd zijn gekoppeld aan de bijbehorende invoervelden. Hierdoor krijgt het invoerveld een toegankelijke naam en wordt het klikgebied van het label vergroot, wat de toegankelijkheid en bruikbaarheid verbetert. Omdat het invoerveld geen toegankelijke naam heeft, levert dit ook problemen op onder succescriteria 2.5.3 en 4.1.2.

Op pagina https://www.westfriesebibliotheken.nl/404.html staan onder de kop "Zoek je dit?" twee ul-elementen direct achter elkaar, terwijl ze samen één visuele en semantische lijst vormen. Door de lijst op te splitsen in twee afzonderlijke ul-elementen, wordt de inhoud voor schermlezers als twee losse lijsten gepresenteerd. Dit verstoort de logische structuur van de pagina en kan tot verwarring leiden. Deze items moeten in één ul-element worden geplaatst om de semantische samenhang te behouden.

Op pagina https://wfb.op-shop.nl/ staat een filterbalk. Elk filter heeft een lijst met opties die visueel gegroepeerd zijn. Deze groepering is echter niet aanwezig in de HTML-structuur. Wanneer elementen visueel gegroepeerd zijn, moet die relatie ook in de HTML staan, zodat gebruikers van hulpsoftware, zoals schermlezers, de groepering begrijpen.

Op pagina https://wfb.op-shop.nl/ wordt de huidige pagina in de paginering alleen visueel aangeduid — door een andere achtergrondkleur. Deze informatie is niet beschikbaar in de code. Hierdoor kunnen gebruikers van hulpsoftware, zoals schermlezers, niet vaststellen welke pagina op dit moment actief is. Volgens WCAG-succescriterium 1.3.1 moet informatie die visueel wordt overgebracht ook programmatisch beschikbaar zijn.
Voeg aria-current="page" toe aan het element van de huidige pagina in de paginering. Dit geeft programmatisch aan welke pagina op dit moment actief is, zodat de informatie beschikbaar wordt voor hulpsoftware.

Op pagina https://wfb.op-shop.nl/7734/orange-the-world-blauwdruk/02-12-2025 staan verschillende h6-koppen, bijvoorbeeld "Wat als je vader je moeder vermoordt?". Deze zijn goed opgemaakt als kop, maar ze zijn daarnaast ook onterecht opgemaakt met het strong-element. Dit element is hier niet voor bedoeld. Gebruik het strong-element alleen om één of enkele woorden in een lopende tekst nadruk te geven, en gebruik CSS om de kop eventueel een andere visuele weergave mee te geven.
Dit komt ook voor op pagina https://wfb.op-shop.nl/7856/koffie-met-kunst-enkhuizen/22-05-2026 bij koppen als "Kunst Dichterbij".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 zijn de volgende teksten niet als kop gemarkeerd: "Onderwerp", "Inhoud", "Materialen", "Serie", "Toptags".
Bezoekers die hulpsoftware gebruiken hebben niets aan een (tussen)kop die er wel uitziet als kop, maar niet als kop is gemarkeerd. Via de koppen op een pagina kunnen gebruikers van hulpsoftware de inhoud scannen of snel naar een bepaalde sectie navigeren. Maar dat kan alleen als de kop ook echt in de code staat. Als koppen alleen visueel als kop zijn vormgegeven (bijvoorbeeld vetgedrukt), ontstaat bovendien nog een ander probleem: de structuur van de informatie in de code wijkt dan af van de visuele structuur. Dit kan voorkomen worden door koppen altijd te markeren met het juiste HTML-element, op het juiste kopniveau: h1, h2, h3, h4, h5 of h6. Meestal is dit niveau instelbaar via de content-editor in het CMS. De HTML-code voor de kop wordt dan automatisch toegepast.
Hetzelfde probleem speelt op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/853313?qs=hobbit&scope=anything&filterAvailableTitles=false&titleNavRouteName=search&titleNavTotal=19&titleNavIndex=3 bij vergelijkbare teksten.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6, op de tab "Recensies", staat een knop met een "?"-icoon die een dialoogvenster opent. In dat venster zijn de volgende teksten ten onrechte als strong gemarkeerd in plaats van als kop: "Meld je aan en zorg voor een nickname", "Recensie schrijven" en "Recensies van anderen 'liken'".
Het element strong is niet bedoeld om koppen mee te markeren. Dit moet altijd gedaan worden met een kop-element, zoals h2. Koppen zijn bedoeld om een tekst te structureren. Alleen als deze teksten als kop worden gemarkeerd met een kop-element, begrijpt hulpsoftware die betekenis. Het strong-element is wel geschikt om nadruk te geven aan enkele woorden of een zinsdeel.
Hetzelfde probleem speelt op dezelfde pagina bij de kop "Tags toevoegen" in het dialoogvenster dat opent via de "?"-knop op de tab "Tags".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6, op de tab "Recensies", staat een knop met een "?"-icoon die een dialoogvenster opent. In dat venster staat onder de kop "Recensies" een tekstblok met meerdere alinea's dat ten onrechte als één div-element is opgemaakt.
Visueel lijkt deze tekst uit meerdere alinea's te bestaan: blokjes tekst met witruimtes ertussen. Deze structuur moet ook in de code staan. Zorg dat elke alinea in een eigen p-element is geplaatst. Het aantal alinea's dat visueel te zien is, moet dus gelijk zijn aan het aantal p-elementen in de code.
Hetzelfde probleem speelt op dezelfde pagina bij de tekst in het dialoogvenster dat opent via de "?"-knop op de tab "Tags".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/community/search?searchType=nickname&termControl=Palagon&cWiseUserId=303158 staat een groep keuzerondjes ("Tags" en "Nickname") voorafgegaan door de tekst "Search". Visueel vormen deze elementen een groep, maar die relatie is niet vastgelegd in de code.
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 "Search".”

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/community/search?searchType=nickname&termControl=Palagon&cWiseUserId=303158, op de tab "Reviews", wordt in elk boekitem het strong-element onjuist gebruikt rondom de naam van de auteur.
Het strong-element heeft een semantische waarde: het geeft een bepaalde betekenis aan de tekst die erin staat. Dit element geeft aan dat de tekst extra nadruk moet krijgen. Om die reden mag dit element niet gebruikt worden om alleen een visueel effect te bereiken. Gebruik hiervoor CSS.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/community/search?searchType=nickname&termControl=Palagon&cWiseUserId=303158, op de tab "Reviews", staan duim-omhoog- en duim-omlaag-iconen met beoordelingscijfers. Het zijn informatieve elementen, maar ze worden verborgen voor hulpsoftware.
Voor bezoekers die de pagina laten voorlezen is deze informatie daardoor niet toegankelijk. Het is niet toegestaan om informatie of functionaliteit te verbergen voor hulpsoftware. Let er ook op dat deze iconen een goed tekstalternatief moeten krijgen, zodat het duidelijk is wat de iconen aangeven.

Het PDF-document op https://www.westfriesebibliotheken.nl/dam/jaarrapportage%202023_WFB%20%281%29.pdf bevat geen structuurcodes (tags), waardoor de inhoud ontoegankelijk is voor schermlezers.
Bovendien kunnen wij de pdf hierdoor niet volledig onderzoeken. Het gaat om alle succescriteria die met de pdf-codelaag te maken hebben, zoals semantische koppen en alternatieve teksten bij afbeeldingen. Als dit wordt opgelost, is het dus mogelijk dat er nieuwe toegankelijkheidsproblemen ontstaan die nu nog niet aan het licht zijn gekomen.

Het volledige PDF-document https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf is ten onrechte als tabelstructuur opgemaakt. Alle onderdelen van de documentinhoud staan binnen Table-, TR- en TD-tags, terwijl de inhoud geen tabeldata is. Hierdoor melden schermlezers het document als tabel en kan dit gebruikers die afhankelijk zijn van hulpsoftware in verwarring brengen. Verwijder de overbodige tabeltags uit inhoud die geen tabeldata is en gebruik PDF-tags die wél overeenkomen met de werkelijke documentstructuur, zoals koppen en alinea's.

Het PDF-document https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf bevat een inhoudsopgave. De Reference-tags worden hierbij echter niet gebruikt.
Deze tags zijn wel nodig: alleen dan kunnen schermlezers het document correct interpreteren. De juiste tags voor de inhoudsopgave zijn: TOC, TOCI, Reference en Link.

In het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf zijn alle koppen niet als kop gemarkeerd. Zie bijvoorbeeld de teksten "Informatie over de organisatie", "Raad van Toezicht" en "Directeur-bestuurder" op pagina 4, en andere koppen door het hele document.
Op deze manier verschilt de visuele informatiestructuur van de structuur van het document in de tags. Vervang de P-tag door de H-tag, zodat de tag-structuur gelijk is aan de visuele structuur.

In het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf staan op pagina 4 twee lijsten. Bij beide ontbreekt de juiste opmaak.
Inhoud die als lijst wordt weergegeven, moet ook als lijst worden gemarkeerd, zodat blinde bezoekers dezelfde informatiestructuur krijgen als zichtbaar is in het document. Een ander voordeel van een lijst is dat de schermlezer het aantal items meldt voordat ze worden voorgelezen. Zo weet een blinde bezoeker hoeveel informatie er volgt.
Markeer de lijsten met L-, Li-, Lbl- en LBody-tags.
Hetzelfde probleem speelt bij lijsten op pagina 8 en 15.

Het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf bevat verschillende datatabellen. Bij geen enkele tabel zijn TH-tags toegepast. Zie bijvoorbeeld de tabellen op pagina 5, 6 en 11.
Bij een datatabel moeten speciale tags toegevoegd worden voor de tabelkoppen. Dan begrijpen schermlezers de relatie tussen de kop en onderliggende datacellen. Markeer de cellen in de koprij van de tabel met TH-tags en de datacellen met TD-tags.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat een formulier. De invoervelden "Email", "Voornaam" en "Achternaam" worden gebruikt voor persoonlijke informatie, maar missen het autocomplete-attribuut.
Invoervelden voor persoonlijke informatie zoals voornaam of achternaam moeten het autocomplete-attribuut hebben met de juiste waarde. Hierdoor kunnen browsers en hulpsoftware helpen bij het invoeren, bijvoorbeeld door de velden alvast automatisch in te vullen. Gebruik het autocomplete-attribuut voor alle velden waar persoonlijke informatie in moet worden gevuld. Op deze pagina staat meer informatie over autocomplete en welke waardes verplicht gebruikt moeten worden: https://www.w3.org/Translations/WCAG22-nl/#input-purposes.
Hetzelfde probleem speelt op pagina https://wfb.op-shop.nl/waiting-list/7856/koffie-met-kunst-enkhuizen bij het formulier dat verschijnt na een klik op de knop "Inschrijven op de wachtlijst".

Uitkomst: Onvoldoende

Bevindingen: Onderaan pagina https://www.westfriesebibliotheken.nl/zoekresultaten.website.html?q=werk gebruikt de paginering kleur als enige visuele indicator van de huidige pagina — de achtergrond rond de huidige pagina is oranje. Dit subtiele visuele onderscheid maakt deze informatie ontoegankelijk voor bezoekers met een milde visuele beperking. Voeg een tweede visuele aanduiding toe, bijvoorbeeld een onderstreping of een achtergrond met voldoende contrast (ten minste 3,0:1).
Hetzelfde probleem speelt bij de paginering op pagina https://wfb.op-shop.nl/.

Op pagina https://wfb.op-shop.nl/ gebruiken de filter-comboboxes, de "Toepassen"-knoppen daarin en de zoekknop een eigen toetsenbordfocusindicator die alleen op een verandering van achtergrondkleur berust.
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 of een onderstreping.
Een vergelijkbaar probleem speelt bij de dot-navigatieknoppen onder de carrousel (lichte verandering van randkleur), bij de pijlknoppen "Vorige slide" en "Volgende slide" (lichte verandering van achtergrondkleur), en op pagina https://wfb.op-shop.nl/waiting-list/7856/koffie-met-kunst-enkhuizen#waitlist_entry bij de knop "Verzenden".

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: In de header van de website https://www.westfriesebibliotheken.nl/ staat een zoekveld. In de hover-staat heeft de grijze (HEX #757575) placeholder-tekst tegen de lichtgrijze (HEX #EDEDED) achtergrond een contrastverhouding van 3,9:1.
Zorg dat de placeholder-tekst een contrast van minstens 4,5:1 tegen de achtergrond heeft.

Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat onder het formulier een knop "Verzend". De knop heeft witte tekst op een oranje (HEX #FF7320) achtergrond, waardoor het kleurcontrast onvoldoende is: 2,7:1.
De contrastverhouding voor tekst onder een lettergrootte van 24 px moet ten minste 4,5:1 zijn.

Op pagina https://www.westfriesebibliotheken.nl/zoekresultaten.website.html?q=werk hebben in de zijbalk onder de kop "Verfijnen op resultaten" de cijfers die het aantal resultaten per type of woord aangeven onvoldoende contrast. De donkergrijze (HEX #757575) cijfers tegen de lichtgrijze (HEX #EDEDED) achtergrond hebben een contrastverhouding van 3,9:1. Dit ligt onder het vereiste minimum van 4,5:1.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk staan veel groene (HEX #00CC00) teksten op een witte achtergrond. De contrastverhouding is te laag: 2,2:1. Zie de volgende teksten: "Aanwezig", "Aanwezig in Hoogkarspel", "Uitgeleend, elders aanwezig", "Aanwezig in Stede Broec" en andere.
Deze tekst is kleiner dan 24 px en niet vetgedrukt, daarom moet het contrast minimaal 4,5:1 zijn.
Hetzelfde probleem met de tekst "Aanwezig" speelt op de pagina's https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 en https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/853313?qs=hobbit&scope=anything&filterAvailableTitles=false&titleNavRouteName=search&titleNavTotal=19&titleNavIndex=3.

In het PDF-document op https://www.westfriesebibliotheken.nl/dam/jaarrapportage%202023_WFB%20%281%29.pdf staan op veel pagina's meerdere oranje (HEX #F58331) teksten op een witte achtergrond. De contrastverhouding is te laag: 2,6:1. Zie bijvoorbeeld de teksten "Het kabinet wil … leren en elkaar ontmoeten." op pagina 2, "COLLEGA AAN HET WOORD" en "Wat voor situatie deed zich voor?" op pagina 3, en andere teksten.
Teksten in dezelfde oranje kleur op een lichtoranje achtergrond (HEX #FDDFC7), zoals op pagina 7, 10 en 12, hebben een contrastverhouding van 2,0:1.
Zorg dat de contrastverhouding ten minste 3,0:1 is voor grote teksten zoals koppen, en 4,5:1 voor kleine of standaardteksten.

In het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf heeft op pagina 1 de witte tekst "FINANCIEEL JAARVERSLAG 2024" tegen de oranje (HEX #F47A20) achtergrond een contrastverhouding van 2,7:1. Deze verhouding moet ten minste 3,0:1 zijn voor grote tekst.

Uitkomst: Onvoldoende

Bevindingen: Wanneer pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 wordt bekeken op een schermresolutie van 1280 bij 1024 pixels en wordt ingezoomd tot 200%, worden sommige boektitels in de carrousel onder "Anderen leenden ook:" gedeeltelijk afgekapt. Zie bijvoorbeeld "De waanzinnige boomhut van 130 verdiepingen".
Zorg dat alles nog werkt en leesbaar is als een bezoeker inzoomt tot 200% op een scherm van 1280 bij 1024 pixels.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Wanneer pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html wordt bekeken op een schermresolutie van 1280 bij 1024 pixels en wordt ingezoomd tot 400%, is de tekst naast het selectievakje "Verzendlijsten" maar gedeeltelijk zichtbaar.
Zorg dat alles nog werkt en leesbaar is als je inzoomt tot 400% op een scherm van 1280 bij 1024 pixels.

Wanneer pagina https://wfb.op-shop.nl/ wordt bekeken op een schermresolutie van 1280 bij 1024 pixels en wordt ingezoomd tot 400%, zijn de keuze-elementen "Tag" en "Wanneer" niet zichtbaar en niet bedienbaar.
Als een bezoeker inzoomt, moet alles nog werken.
Een ander probleem met zoom op deze pagina is dat de koppen in de carrouselslides slechts gedeeltelijk zichtbaar zijn, zie bijvoorbeeld "Klik en Tik: De Basis" of "Klik en Tik: Meer leren — De Goorn".

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat een formulier. De invoervelden hebben grijze (HEX #AAAAAA) randen op een witte achtergrond. De contrastverhouding is 2,3:1.
De randen van interactieve elementen zoals invoervelden moeten minimaal een contrast van 3,0:1 hebben met de achtergrond.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk staan in de boeksecties iconen in verschillende kleuren, die boekcategorieën aangeven. Bij sommige van deze iconen is het contrast onvoldoende. Zo heeft het boek "Werk door Baalman, Martijn" een geel (HEX #FFFF00) icoon ("Communicatie") op een witte achtergrond met een contrastverhouding van 1,1:1, en heeft het boek "Je lijf aan het werk door Farndon, John" (op pagina 2) een roze (HEX #FF7BFF) icoon ("Lichaam en Gezondheid") op een witte achtergrond met een contrastverhouding van 2,2:1. De contrastverhouding voor informatieve elementen moet ten minste 3,0:1 zijn. Controleer ook de iconen bij andere boeken.

Uitkomst: Onvoldoende

Bevindingen: Wanneer op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte/nieuws/nationale-voorleeswedstrijd-2025.html bezoekers tekstafstand toepassen zoals beschreven in dit succescriterium, worden de auteurs en titels van boeken onder de kop "Uit deze boeken lazen de kampioenen voor" gedeeltelijk onzichtbaar en onleesbaar.
Sommige bezoekers passen de weergave van de tekst aan, zodat zij deze beter kunnen lezen. Denk aan het vergroten van de afstand tussen regels, letters of woorden. Het gaat bijvoorbeeld om mensen met dyslexie. Als een bezoeker dit doet op de manier die in het succescriterium is beschreven, moet alles goed blijven werken. Bovendien moet de tekst leesbaar blijven. Dit kan opgelost worden door de hoogte en breedte van de containers van de tekst responsief te maken.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/activiteiten/nationale-voorleesdagen.html in de vergelijkbare sectie onder de kop "Leestips voor jonge ouders", en in carrousels op de pagina's https://www.westfriesebibliotheken.nl/jeugd/12-18.html en https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6.

Wanneer bezoekers tekstafstand toepassen op pagina https://wfb.op-shop.nl/, zijn de koppen in de carrouselslides slechts gedeeltelijk zichtbaar, zie bijvoorbeeld "Klik en Tik: De Basis of Klik en Tik: Meer leren- De Goorn".
Zorg ervoor dat tekst leesbaar en bruikbaar blijft wanneer bezoekers aangepaste tekstinstellingen gebruiken, bijvoorbeeld door containers flexibel en responsief mee te laten schalen met de inhoud.

Wanneer tekstafstand wordt toegepast op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk, worden de knoppen "Mijn lijsten" en "Reserveren" gedeeltelijk afgekapt. Zorg dat alle elementen zichtbaar blijven wanneer tekstafstand wordt toegepast.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://wfb.op-shop.nl/ is in de detailssectie van sommige evenementen (bijvoorbeeld "VoorleesPret Medemblik") het adres uit te klappen, maar dit is niet bedienbaar met het toetsenbord. Het is niet mogelijk om de comboboxes met alleen het toetsenbord te openen en te sluiten.
Sommige bezoekers gebruiken alleen een toetsenbord om te navigeren en geen muis. Zij moeten alle klikbare onderdelen van de website gewoon kunnen gebruiken. Daaronder vallen bijvoorbeeld links, knoppen, formulieren, keuzelijsten, tabbladen, sliders en accordeons. Zorg dat alles wat aanklikbaar is, ook werkt met het toetsenbord.
Hetzelfde probleem speelt op de pagina's https://wfb.op-shop.nl/7734/orange-the-world-blauwdruk/02-12-2025 en https://wfb.op-shop.nl/7856/koffie-met-kunst-enkhuizen/22-05-2026 bij de vergelijkbare locatiesecties onder de afbeelding.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk wordt, wanneer een bezoeker niet is ingelogd en op de knop "Reserveren" of "Mijn lijsten" naast een boek klikt, een dialoogvenster getoond. Na enkele seconden wordt de bezoeker zonder waarschuwing automatisch doorgestuurd naar de inlogpagina.
Zorg dat bezoekers de mogelijkheid hebben om deze tijdslimiet uit te zetten, aan te passen of te verlengen.
Hetzelfde probleem speelt bij identieke dialoogvensters op alle pagina's van bibliotheekitems, bijvoorbeeld https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://wfb.op-shop.nl/ en andere pagina's van dit domein ontbreekt een skiplink.
Er moet een manier zijn om delen van een pagina over te slaan, zoals het navigatiemenu en andere elementen die op meerdere pagina's terugkomen. Hiervoor wordt een skiplink gebruikt. Daarmee kunnen bezoekers vaste blokken met herhalende inhoud overslaan. Een skiplink moet de eerste link op de pagina zijn. Deze link mag verborgen zijn, maar moet zichtbaar worden zodra hij focus krijgt. Voeg een skiplink toe waarmee bezoekers herhalende delen van de pagina over kunnen slaan.
Hetzelfde probleem speelt op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk en andere pagina's van dit domein.

Uitkomst: Onvoldoende

Bevindingen: In het PDF-document op https://www.westfriesebibliotheken.nl/dam/jaarrapportage%202023_WFB%20%281%29.pdf is geen titel ingesteld in de 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.

Het PDF-document https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf mist een titel. Stel een documenttitel in de metadata van het PDF-bestand in. Dit zorgt ervoor dat in plaats van de bestandsnaam een duidelijke titel wordt weergegeven en maakt het document beter toegankelijk voor gebruikers, vooral voor mensen met beperkingen.

Uitkomst: Onvoldoende

Bevindingen: Wanneer de website https://www.westfriesebibliotheken.nl/ voor het eerst wordt geopend, verschijnt er een cookiebanner. Momenteel kan de toetsenbordfocus uit dit venster ontsnappen en terechtkomen op de onderliggende inhoud van de pagina. Bij dialoogvensters moet de focus binnen het venster blijven zolang het actief is. Dit voorkomt verwarring en zorgt dat gebruikers met het toetsenbord correct kunnen navigeren. De focus moet vastgezet worden binnen het dialoogvenster totdat de bezoeker het venster sluit via de sluitknop of met de ESC-toets. Een andere oplossing is om het venster automatisch te sluiten wanneer de focus het venster verlaat.
Hetzelfde probleem speelt bij het dialoogvenster dat opent na een klik op de knop "Lees hier meer over cookies".

Wanneer op pagina https://wfb.op-shop.nl/ (of andere pagina's van het domein) wordt ingezoomd, verschijnt in de header een menuknop (het "hamburger"-icoon met drie horizontale streepjes), die het mobiele menu opent. Op dit moment kunnen bezoekers met het toetsenbord uit het mobiele menu navigeren. De toetsenbordfocus gaat dan naar de onderliggende pagina terwijl het menu open blijft staan.
In dit type menu moet de toetsenbordfocus correct worden beheerd. Wanneer het menu geopend is, moet de focus binnen het menu blijven en niet naar de onderliggende pagina gaan. Dit kan worden opgelost door de focus in het menu vast te houden totdat het menu wordt gesloten of de gebruiker op ESC drukt. Een andere mogelijkheid is om het menu automatisch te sluiten zodra de focus het menu verlaat.

Wanneer op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk wordt ingezoomd, opent de knop "Zoekresultaten verfijnen" een filterzijbalk, die in de code een dialoogvenster is. Op dit moment kan de toetsenbordfocus uit het geopende dialoogvenster ontsnappen en op de onderliggende pagina-inhoud terechtkomen.
Bij dit soort dialoogvensters moet de toetsenbordfocus goed worden ingesteld. Wanneer het venster actief is, moet de toetsenbordfocus binnen het venster blijven en mag deze niet op de onderliggende pagina terechtkomen. Dit kan worden opgelost door de focus binnen het venster te houden, totdat de bezoeker op de sluitknop heeft geklikt of op de ESC-toets heeft gedrukt. Het is ook mogelijk om het venster automatisch te sluiten zodra de focus eruit gaat.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 staan twee carrousels. De toetsenbordfocus is hier niet logisch. De focus komt op twee onzichtbare elementen terecht ("Slide 1 of 2" en "Slide 2 of 2", uitgesproken door schermlezers). Daarnaast gaat de focus eerst door alle boeken in de carrousel en pas daarna naar de navigatieknoppen, wat niet overeenkomt met de visuele volgorde.
Als bezoekers met het toetsenbord door de website navigeren, moeten interactieve elementen zoals knoppen en links op een logische volgorde toetsenbordfocus krijgen. Logisch betekent dat het aansluit op de volgorde die de elementen hebben in de visuele vormgeving. Anders kunnen bezoekers die alleen een toetsenbord gebruiken, minder makkelijk door de pagina navigeren. Het gaat dan bijvoorbeeld om mensen met een motorische of visuele beperking of een leesstoornis. Zorg dat het activeren van de knop de toetsenbordfocus verplaatst naar het volgende logische element in de reeks. Hetzelfde probleem doet zich voor bij de carrousel op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/853313?qs=hobbit&scope=anything&filterAvailableTitles=false&titleNavRouteName=search&titleNavTotal=19&titleNavIndex=3.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/activiteiten/nationale-voorleesdagen.html hebben in de sectie "Agenda" de pagineringslinks onvoldoende context. Ziende bezoekers begrijpen dat "1", "2", "3" enzovoort paginanummers voorstellen, maar dit is niet duidelijk voor bezoekers met een visuele beperking of voor schermlezergebruikers. Door het woord "pagina" aan de linktekst toe te voegen (bijvoorbeeld "Pagina 1", "Pagina 2") wordt de noodzakelijke context geboden en verbetert de toegankelijkheid.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/activiteiten/persoonlijkeontwikkeling.html met een vergelijkbare "Agenda"-sectie, en ook op pagina https://wfb.op-shop.nl/.

Op pagina https://www.westfriesebibliotheken.nl/activiteiten/persoonlijkeontwikkeling.html, onder de kop "Persoonlijke ontwikkeling", heeft de link de toegankelijke naam "before Terug naar Activiteiten". Dit kan verwarrend zijn voor bezoekers met cognitieve beperkingen of gebruikers van schermlezers. Zorg dat de toegankelijke naam van deze link duidelijk en betekenisvol is, zodat bezoekers begrijpen waar de link naartoe leidt.
Hetzelfde probleem speelt op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html bij de link "Jeugd & Jongeren".

Op pagina https://wfb.op-shop.nl/ staan meerdere links met dezelfde tekst "Meer informatie" of "Meer informatie en reserveren".
Deze tekst beschrijft de bestemming van de link onvoldoende. Hierdoor kunnen gebruikers met cognitieve beperkingen of degenen die afhankelijk zijn van schermlezers niet goed bepalen waar de link naartoe gaat. Linkteksten die meerdere keren op een pagina voorkomen of nietszeggend zijn (zoals 'lees meer'), geven de bezoeker geen duidelijke aanwijzingen over hun bestemming. Zorg dat duidelijk is waar een link naartoe leidt, bijvoorbeeld door een tekst als 'lees meer' aan te vullen met de paginatitel, of in dit geval de titel van het evenement. Als visueel duidelijk is bij welk onderdeel de link hoort, kan deze aanvullende tekst visueel verborgen worden.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html staan meerdere carrousels met boeken. Elke carrousel gebruikt dezelfde "pijl"-knoppen voor navigatie ("Vorige" en "Volgende"). Hoewel deze labels functioneren, zijn ze niet voldoende beschrijvend. Bovendien is het voor een schermlezergebruiker die door de pagina navigeert moeilijk te begrijpen welke "Volgende"-knop bij welke carrousel hoort. De toegankelijke naam van elke knop moet worden uitgebreid (bijvoorbeeld naar "Volgende slide, boeken voor 12-15 jaar") om meer context over de functie te geven.

Op pagina https://www.westfriesebibliotheken.nl/jeugd/12-18.html staat een iframe met een video. Het title-attribuut is "Jongerenvloer in de Bibliotheek Stede Broec". In het title-attribuut van een iframe moet niet alleen worden aangegeven waar het over gaat, maar ook tot welk type content het behoort (bijvoorbeeld een podcast of video). De beschrijving in het title-attribuut moet uniek en betekenisvol zijn, zodat bezoekers met hulpsoftware kunnen bepalen of ze de inhoud willen verkennen. Wijzig het title-attribuut en geef daarin aan welk type inhoud het iframe bevat en waar het over gaat.

Op pagina https://www.westfriesebibliotheken.nl/404.html staan onder de kop "Zoek je dit?" verschillende items. Het heading-element bevat naast een de koptekst nog een link waardoor deze kop als volgt wordt voorgelezen: "Naar de activiteitenpagina Vestigingen". Dit is geen duidelijke koptekst.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html is de toetsenbordfocus niet zichtbaar in het formulier bij het selectievakje "Maandelijkse Nieuwsbrief Stichting Westfriese Bibliotheken" en bij de knop "Verzend".
De toetsenbordfocus moet altijd zichtbaar zijn op interactieve elementen zoals links, knoppen en invoervelden die met het toetsenbord focus kunnen krijgen. Bezoekers die met het toetsenbord navigeren moeten goed kunnen zien op welke plek van de pagina ze zijn. Anders weten ze niet op welk moment ze op Enter moeten drukken om een knop of link te bedienen.

Op pagina https://www.westfriesebibliotheken.nl/404.html is de toetsenbordfocus niet zichtbaar op de klikbare afbeeldingslink met een boek "Flip Fiasco".
Zorg ervoor dat interactieve elementen altijd een duidelijke toetsenbordfocus hebben, zodat gebruikers die met het toetsenbord navigeren kunnen herkennen welk element actief is.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: In de header van de website staat een zoekveld. 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.

Pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html bevat een formulier waarin label-elementen niet expliciet gekoppeld zijn aan de bijbehorende invoervelden. Hierdoor hebben de invoervelden geen toegankelijkheidsnaam en bevatten deze dus niet de zichtbare tekst van het label. Dit levert problemen op voor gebruikers die de website met spraaksoftware bedienen. Zie ook succescriteria 1.3.1 en 4.1.2.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk staat boven de zoekresultaten een select-element met een zichtbaar label "Sorteer op". De toegankelijke naam, die via een aria-label is ingesteld, is "Kies sorteervolgorde".
De toegankelijke naam van een interactief element moet overeenkomen met de zichtbare tekst, zodat bezoekers die spraakbediening gebruiken het element correct kunnen activeren door de zichtbare tekst uit te spreken. Verwijder het aria-label zodat de toegankelijke naam rechtstreeks uit het label-element wordt gehaald, of gebruik een aria-label dat zowel de zichtbare tekst als een verduidelijking bevat, bijvoorbeeld aria-label="Sorteer op, kies sorteervolgorde".

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.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.
Hetzelfde probleem speelt op de pagina's https://www.westfriesebibliotheken.nl/activiteiten/nationale-voorleesdagen.html en https://www.westfriesebibliotheken.nl/activiteiten/persoonlijkeontwikkeling.html.

In de metadata van het PDF-document op https://www.westfriesebibliotheken.nl/dam/jaarrapportage%202023_WFB%20%281%29.pdf is de taal ingesteld op Engels ("en-GB").
Dit klopt niet: de taal van het document is Nederlands. Schermlezers lezen de tekst nu voor met de uitspraakregels van het Engels. Dat maakt het al snel onbegrijpelijk voor een gebruiker van een schermlezer. Verander de code in "nl".

In de metadata van het PDF-document op https://www.westfriesebibliotheken.nl/dam/Jaarrekening%202024_website.pdf is de taal niet ingesteld.
Het is belangrijk om de taal in te stellen. Dan kan hulpsoftware de informatie uit het bestand met de juiste uitspraakregels voorlezen. Dit kan worden ingesteld via de bestandseigenschappen.

Uitkomst: Onvoldoende

Bevindingen: Pagina https://wfb.op-shop.nl/ bevat meerdere elementen met Engelstalige toegankelijke namen. Zie bijvoorbeeld de filterelementen bovenaan de pagina, die toegankelijke namen hebben als "Categorie keyboard_arrow_down" of "Locatie keyboard_arrow_down", de knop met het vergrootglas die de toegankelijke naam "Search" heeft, de knoppen onder de carrousel zoals "Go to slide 2", "Previous slide" en "Next slide", en de iconen voor evenement, schema, locatie, categorie en stijl naast evenementen, die door schermlezers worden voorgelezen als "event", "schedule" en "location_on".
Deze labels worden voorgelezen door schermlezers volgens de uitspraakregels van de primaire taal van de pagina (in dit geval Nederlands). Verwijder overbodige teksten of vertaal ze naar het Nederlands. Vertaal de namen van deze elementen naar het Nederlands, zodat schermlezers ze correct kunnen uitspreken.
Hetzelfde probleem speelt op de pagina's https://wfb.op-shop.nl/7734/orange-the-world-blauwdruk/02-12-2025 en https://wfb.op-shop.nl/7856/koffie-met-kunst-enkhuizen/22-05-2026 bij de "Terug"-knop met de toegankelijke naam "arrow_back Terug" en bij iconen onder de evenementafbeelding zoals "event", "category" en "download".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk heeft in de dialoogvensters die openen via de "Mijn lijsten"-knoppen de x-knop een Engelstalige toegankelijke naam — "MODAL.CLOSE". Dit kan tot uitspraakproblemen leiden voor schermlezergebruikers. Vertaal het naar het Nederlands.
Een vergelijkbaar probleem speelt bij de pagineringsknoppen op dezelfde pagina, die "Page 2", "Page 3" enzovoort melden. En ook bij de x-knoppen in de dialoogvensters die openen via de "?"-knoppen, bij stericoontjes ("Rating: 4.5 out of 5 stars"), en bij de paginering op de tab "Lijsten" op de pagina's https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 en https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/853313?qs=hobbit&scope=anything&filterAvailableTitles=false&titleNavRouteName=search&titleNavTotal=19&titleNavIndex=3.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/community/search?searchType=nickname&termControl=Palagon&cWiseUserId=303158 (Engelse taal geselecteerd) is de hoofdinhoud in het Engels (lang="en"), maar de header en de footer zijn in het Nederlands. Deze inconsistentie veroorzaakt dat schermlezers de Nederlandse tekst verkeerd uitspreken, omdat ze standaard de Engelse uitspraakregels toepassen.
Geef bij Nederlandstalige content in de code aan dat er een taalwissel plaatsvindt door aan het omringende HTML-element een lang-attribuut toe te voegen — lang="nl".

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Als het formulier op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html wordt verzonden met lege of onjuist ingevulde velden, verschijnt als melding alleen "Controleer de verplichte velden". Dit geeft niet duidelijk aan waar een fout is gemaakt. Bovendien verdwijnt het vinkje bij "Verzendlijsten" na het verzenden van het formulier als er geen e-mailadres wordt ingevuld.

Het formulier op pagina https://wfb.op-shop.nl/waiting-list/7856/koffie-met-kunst-enkhuizen maakt alleen gebruik van HTML5-veldcontroles. Deze foutmeldingen worden niet door alle browsers en hulpsoftware even goed ondersteund. De melding is soms kortaf (bijvoorbeeld "Vul dit veld in"), onvolledig of blijft te kort staan. Ook kun je de tekstgrootte niet aanpassen, zodat sommige mensen de tekst mogelijk niet kunnen lezen. Voeg zelf foutmeldingen toe aan het formulier om dit probleem op te lossen. Geef in een foutmelding aan dat er een fout is gemaakt en waar de fout is gemaakt, bijvoorbeeld "Voornaam is niet ingevuld".

Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat een formulier. Wanneer het formulier wordt verzonden met lege of onjuiste gegevens, wordt alleen de melding "Controleer de verplichte velden" getoond. Dit geeft niet duidelijk aan waar een fout is gemaakt.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat een formulier met meerdere verplichte velden die met een sterretje zijn gemarkeerd. Wanneer een sterretje wordt gebruikt om verplichte velden aan te geven, moet boven het formulier een instructie staan zoals "Velden gemarkeerd met * zijn verplicht".

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Wanneer de website voor het eerst wordt bezocht, wordt een dialoogvenster met een cookiebanner getoond. Dit dialoogvenster mist zowel een juiste ARIA-rol als een toegankelijke naam.
Schermlezers kunnen hierdoor niet doorgeven dat het om een dialoogvenster gaat, en wat de inhoud ervan is. Dit kan opgelost worden door twee attributen toe te voegen aan het dialoogvenster: een aria-label met een duidelijke beschrijving van de inhoud (aria-label="Beschrijving van de inhoud") en role="dialog".
Hetzelfde probleem speelt bij het dialoogvenster dat opent na een klik op de knop "Lees hier meer over cookies".

Op alle pagina's van de website https://www.westfriesebibliotheken.nl/ 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.

Pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html bevat een iframe (het inschrijfformulier) zonder een beschrijving die zichtbaar is voor hulpsoftware. Het title-attribuut is leeg.
Iframes moeten een goede beschrijving hebben, meestal via het title-attribuut. Daarin moet worden aangegeven welk type inhoud wordt weergegeven (bijvoorbeeld een podcast of formulier) en waar die inhoud over gaat. De beschrijving moet uniek en betekenisvol zijn. Door de beschrijving kunnen bezoekers met hulpsoftware bepalen of het de moeite waard is om de inhoud van het iframe te verkennen.

Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html hebben de invoervelden onder "Ontvang iedere maand onze nieuwsbrief" geen toegankelijke naam.
Hierdoor is het voor blinde of slechtziende bezoekers die een schermlezer gebruiken niet duidelijk wat zij in moeten vullen. Invoervelden moeten altijd een toegankelijke naam hebben die het doel van het veld beschrijft. Geef de invoervelden daarom toegankelijke namen, bijvoorbeeld door er label-elementen aan te koppelen. Zie ook succescriterium 1.3.1 en 2.5.3.

Op pagina https://wfb.op-shop.nl/ staat een filterbalk. Elk filter opent een lijst met opties, maar een schermlezergebruiker krijgt geen informatie over de staat ervan (open of gesloten).
Als er een element is dat extra content kan tonen of verbergen, dan moet hulpsoftware de staat van deze content (zichtbaar of verborgen) kunnen bepalen. Daarvoor kan het aria-expanded-attribuut gebruikt worden. Gebruik het aria-expanded="true"-attribuut op de knop of link die extra content opent.

Op een klein scherm heeft op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk en andere pagina's van het domein de menuknop bovenaan niet de juiste toegankelijke rol. Hierdoor herkennen hulpsoftware-toepassingen het element niet als knop.
De juiste rol voor de menuknop zou "button" (knop) moeten zijn, omdat er een actie mee wordt uitgevoerd: het openen of sluiten van het menu. Als de knop niet de juiste rol heeft, kan een schermlezer of ander hulpmiddel de knop niet goed herkennen, waardoor deze moeilijker te gebruiken is voor mensen die deze hulptechnologie gebruiken. Zorg er daarom voor dat de knop "Menu" de juiste rol krijgt, door het button-element ervoor te gebruiken of role="button" toe te voegen. Gebruik een button-element voor de menuknop. Als dat niet mogelijk is, voeg role="button" toe aan het element en zorg dat het element voldoet aan de bijbehorende vereisten voor toetsenbordbediening en focus.
Zorg dat de knop een toegankelijke naam krijgt, en dat deze naam 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"). Geef de menuknop een toegankelijke naam die de functie beschrijft. Zorg ervoor dat deze naam mee verandert, bijvoorbeeld van "menu openen" naar "menu sluiten".

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk heeft elk boek een uitklapbare sectie met een knop "Toon meer". Nadat de knop verborgen inhoud opent, verandert de zichtbare naam naar "Toon minder", maar dit wordt niet direct aangekondigd door de schermlezer. Voeg het aria-expanded-attribuut toe aan de knop en werk de waarde ervan dynamisch bij wanneer de inhoud wordt uitgeklapt of ingeklapt.

Wanneer pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk en andere pagina's van het domein op een klein scherm worden bekeken, verschijnt in de header een menuknop om het mobiele menu te openen. De knop geeft geen informatie over de staat van het menu (open of gesloten) aan bezoekers die dat niet kunnen zien, zoals gebruikers van schermlezers.
Dit kan bijvoorbeeld opgelost worden door een tekstuele uitleg (ingeklapt/uitgeklapt) toe te voegen die voor ziende bezoekers met CSS wordt verborgen. Een andere optie is om het aria-expanded-attribuut te gebruiken op de menuknop. Dit attribuut moet de waarde "true" krijgen als het menu getoond wordt, en "false" als het menu verborgen is.

Op de pagina's https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/1412399?qs=Harry%20Potter%20en%20de%20vuurbeker&titleNavRouteName=search&titleNavTotal=128&titleNavIndex=6 en https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/title-detail/WISE/853313?qs=hobbit&scope=anything&filterAvailableTitles=false&titleNavRouteName=search&titleNavTotal=19&titleNavIndex=3 staan op de tabs "Recensies" en "Tags" knoppen met een "?"-icoon die dialoogvensters openen. Deze dialoogvensters missen een toegankelijke naam. Een gebruiker van hulpsoftware heeft die nodig om de inhoud van de dialogen te begrijpen.
Dit kan opgelost worden door een aria-label aan het dialoogvenster toe te voegen met een duidelijke beschrijving van de inhoud.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.westfriesebibliotheken.nl/over-ons/blijf-op-de-hoogte.html staat een formulier. Wanneer het formulier wordt verzonden met lege of onjuiste gegevens, wordt de melding "Controleer de verplichte velden" zonder paginavernieuwing getoond, en de toetsenbordfocus wordt niet naar de melding verplaatst.
De pagina laadt niet opnieuw en de toetsenbordfocus wordt niet naar de melding verplaatst. Daarom is extra code nodig zodat schermlezers het statusbericht automatisch voorlezen zodra het verschijnt. Voeg aria-live="polite" of role="status" toe aan de melding. Meer informatie over role="status" is te vinden op de pagina https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA22.

Op pagina https://bibliotheek.wise.oclc.org/wise-apps/opac/branch/1600/catalog/search?qs=werk wijzigen filters de zoekresultaten en verschijnt zonder paginavernieuwing een melding als "Resultaten: 1 - 10 (van 7784)". Deze melding, die een statusbericht is, wordt echter niet door schermlezers aangekondigd, omdat hij geen toetsenbordfocus krijgt.
Dat zou wel moeten gebeuren. Deze melding is namelijk een statusbericht. Statusberichten moeten automatisch voorgelezen worden door schermlezers zodra ze verschijnen of veranderen, maar de code die dit mogelijk maakt is nog niet toegevoegd. Dit kan opgelost worden door een aria-live-attribuut aan de melding toe te voegen.