Toegankelijkheidsonderzoek

Rapport:
Audit digitale toegankelijkheid Intranet Oisterwijk


Onderzoeker
Kaylee, Swink; Renate, Swink
Datum
17 januari 2023
Opdrachtgever
Gemeente Oisterwijk

Samenvatting onderzoeksresultaat

De website Intranet Oisterwijk voldoet nog niet aan WCAG 2.1 niveau AA. Er zijn 21 van de 50 succescriteria waar één of meer fouten zijn gevonden. In dit document is vastgelegd in hoeverre de website voldoet aan de toegankelijkheidseisen die vastgelegd zijn in WCAG, de Web Content Accessibility Guidelines.

De website insite.oisterwijk.nl is onderzocht tussen 10 en 17 januari 2023. Het onderzoek is uitgevoerd aan de hand van de evaluatiemethode WCAG-EM. Doel van dit rapport is om te bepalen welke verbeteringen nodig zijn om dit digitaal kanaal toegankelijker te krijgen.

De meeste opvallende bevindingen uit het onderzoek zijn:

Het onderzoek richt zich specifiek op de toegankelijkheid van de website voor mensen met een functiebeperking, zoals mensen die blind, doof, laaggeletterd zijn of andere functieproblemen hebben. Voor hen is het van belang dat de website technisch en inhoudelijk zo is ingericht dat de site voor hen goed bruikbaar is. Een website optimaliseren voor toegankelijkheid heeft meer voordelen; het maakt de website beter bruikbaar voor iedereen (bijvoorbeeld ook voor mensen die op hun mobieltje kijken in een zonnige omgeving) en het maakt de site beter vindbaar in zoekmachines.

Scope van de evaluatie

Naam website Intranet Oisterwijk
Scope van de website Binnen de scope van dit onderzoek vallen:
  • Alle pagina's op het domein insite.oisterwijk.nl.
Buiten de scope van dit onderzoek vallen:
  • Content van derden dat voorkomt op de pagina's van het domein insite.oisterwijk.nl.
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
  • Alle externe systemen en websites waar via insite.oisterwijk.nl met een link naar wordt verwezen.
Conformiteitsdoel WCAG 2.1 niveau AA
Basisniveau van toegankelijkheid ondersteund Gangbare browsers en hulpsoftware.

Overzicht toetsresultaat

Principe Voldoende Onvoldoende Onbekend
1 Waarneembaar 12 8 0
2 Bedienbaar 10 7 0
3 Begrijpelijk 6 4 0
4 Robuust 1 2 0
Totaal 29 21 0

Leeswijzer

Dit onderzoek is een momentopname. De website kan inmiddels veranderd zijn. De gevonden problemen zijn slechts voorbeelden. Ga daarom bij elk probleem de gehele website na of dit ook op andere plaatsen voorkomt. Dit onderzoek is slechts een steekproef van een aantal pagina's. Er zijn zo veel mogelijk verschillende type pagina's opgenomen in de sample om zo een goede indruk te krijgen van de toegankelijkheid. Let op! Bij het aanbrengen van verbeteringen of wijzigingen op de website/app kunnen nieuwe problemen ontstaan. Succescriteria gemarkeerd met "Niet aanwezig" worden automatisch goedgekeurd. Succescriteria gemarkeerd met "Onbekend" worden niet goedgekeurd.

Uitgebreide toetsresultaten


1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Alle niet-tekstuele content die aan de gebruiker wordt gepresenteerd, heeft een tekstalternatief dat een gelijkwaardig doel dient, behalve voor de hierna vermelde situaties.

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Uitkomst: Onvoldoende

Bevindingen: Op de startpagina insite.oisterwijk.nl/ staan iconen van hartjes en gesprekswolken. Deze iconen geven betekenis aan de getallen die erbij staan en hebben daarom een alternatieve tekst nodig. Zorg ervoor dat de iconen een alternatieve tekst krijgen die overeenkomt met de informatie dat het icoon visueel overbrengt. Een soortgelijk probleem komt ook voor bij het kalendericoon dat voor verschillende data staat op dezelfde pagina.
Deze iconen komen ook voor op andere pagina's, bijvoorbeeld op insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening en op insite.oisterwijk.nl/projecten.

In de widget 'Brasserie O'44' op de startpagina insite.oisterwijk.nl/ staat een logo. Deze afbeelding heeft geen alternatieve tekst. Zorg ervoor dat logo's altijd een alternatieve tekst hebben.

Op pagina insite.oisterwijk.nl/beeldbank/categorie/onderwijs staan verschillende afbeelding die via het title-attribuut een alternatieve tekst krijgen. De alternatieve teksten van deze afbeeldingen omschrijven niet wat er op de afbeelding is te zien. Een afbeelding van een Nederlandse vlag en een tas heeft bijvoorbeeld de alternatieve tekst 'Geslaagd'. Zorg ervoor dat de alternatieve teksten van deze afbeeldingen omschrijven wat er op de afbeeldingen is te zien.
Wij raden aan om het title-attribuut niet te gebruiken om een afbeelding een alternatieve tekst te geven, ook al wordt het gebruik van dit attribuut niet afgekeurd. Het alt-attribuut is meer geschikt om een afbeelding een alternatieve tekst te geven.

In de codelaag van de PDF 'Afwezigheidassistent instellen' (insite.oisterwijk.nl/index.php) zijn met Figure-tags twee afbeeldingen geplaatst. Wanneer afbeeldingen in de codelaag van een PDF zijn geplaatst hebben ze een alternatieve tekst nodig, dat hebben deze afbeeldingen niet. Zorg ervoor dat de afbeeldingen in de PDF een alternatieve tekst krijgen.


1.2 Op tijd gebaseerde media

1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) (Niveau A)

Voor media met vooraf opgenomen louter-geluid en vooraf opgenomen louter-videobeeld is het volgende waar, behalve als de audio of video een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld:

Informatie over succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen)

Uitkomst: Niet aanwezig


1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)

Er worden ondertitels voor doven en slechthorenden geleverd voor alle vooraf opgenomen audiocontent in gesynchroniseerde media, behalve als het mediabestand een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld.

Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)

Uitkomst: Niet aanwezig


1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)

Er wordt een alternatief geleverd voor op tijd gebaseerde media of audiodescriptie van de vooraf opgenomen videocontent geleverd voor gesynchroniseerde media, behalve als het mediabestand een media-alternatief voor tekst is en duidelijk als zodanig is gelabeld.

Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)

Uitkomst: Niet aanwezig


1.2.4 Ondertitels voor doven en slechthorenden (live) (Niveau AA)

Er worden ondertitels voor doven en slechthorenden geleverd voor alle live audiocontent in gesynchroniseerde media.

Informatie over succescriterium 1.2.4 Ondertitels voor doven en slechthorenden (live)

Uitkomst: Niet aanwezig


1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Er wordt een audiodescriptie geleverd voor alle vooraf opgenomen videocontent in gesynchroniseerde media.

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Niet aanwezig


1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie, structuur en relaties overgebracht door presentatie kunnen door software bepaald worden of zijn beschikbaar in tekst.

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevindingen: Wanneer op onder andere pagina insite.oisterwijk.nl/ op de zoekknop wordt gedrukt, verschijnt er een invoerveld in beeld. Dit veld is met een for- en id-attribuut aan een label-element gekoppeld, maar heeft geen toegankelijke naam. Dit komt doordat het label-element is verborgen met de CSS-eigenschap Display: none;. Hierdoor is het label-element ook verborgen voor hulpsoftware en geeft het geen toegankelijke naam aan het invoerveld. Los dit probleem op door de eigenschap Display: none; van het label-element te verwijderen en deze met een andere methode te verbergen.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws staat een groep selectievakjes dat de beschrijving ‘Categorieën' heeft. De beschrijving is in een label-element geplaatst. Hierdoor is de beschrijving niet correct gekoppeld aan de groep selectievakjes. Verwijder het label element en plaats het in een fieldset en legend combinatie.
Dit probleem komt ook voor bij de groep keuzevakjes met de beschrijving 'Afbeelding layout (eerste afbeelding)' op deze pagina.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening staat een '(1)' naast een 'Leuk' knop. Deze 1 geeft aan dat één persoon dit bericht leuk vindt. In de code zijn de 'Leuk' knop en de '(1)' beide in een eigen li-element geplaatst. Hierdoor is de relatie tussen de 1 en de 'Leuk' knop niet te bepalen voor hulpsoftware. Los dit op door de elementen samen in één li-element te plaatsen.

Op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/883 is visueel duidelijk dat er een relatie is tussen de teksten 'Naam', 'Laatste bewerkt' en 'Bewerkt door' en de content dat daar onder staat. Hulpsoftware kan deze relatie niet aangeven. Zorg ervoor dat de teksten aan elkaar zijn gekoppeld zodat hulpsoftware de relatie tussen de tekst en de onderstaande content kan aangeven. Dit kan door deze teksten met een Table-element op te maken of door gebruik te maken van aria-describedby.
Dit probleem ook voor op andere content, bijvoorbeeld op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/1032 en insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/1031.

Teksten zoals 'Functie' en 'Werkzaamheden' op pagina insite.oisterwijk.nl/collegawijzer/profiel/hooijmaijers-pype-barbara zijn koppen voor de daaropvolgende content. In de code zijn deze teksten niet opgemaakt als koppen, hierdoor is de relatie tussen de kop en de daaropvolgende content niet te bepalen voor hulpsoftware. Zorg ervoor dat de teksten worden opgemaakt als kop, of maak gebruik van een definitielijst (dl-element met dt- en dd-elementen) om de relatie tussen de term en bijbehorende content aan te geven.
Dit probleem komt ook voor op pagina insite.oisterwijk.nl/collegawijzer/profiel/heijnis-kaylee.

Op de pagina insite.oisterwijk.nl/organisatie/detail/college/content/924 staat een tabel die niet correct is opgemaakt. De relatie tussen de verschillende cellen is niet te bepalen voor hulpsoftware doordat er geen gebruik is gemaakt van th-element en het bereik van de cellen niet is aangegeven. Los dit probleem op door de cellen in de eerste rij op te maken met een TH-element en op deze cellen het bereik aan te geven, bijvoorbeeld door gebruik te maken van het attribuut scope=col.

De codelaag van de PDF 'Afwezigheidassistent instellen' (insite.oisterwijk.nl/index.php) heeft een Part-tag als brontag. Dit moet een Document-tag zijn.

Op pagina 2 van de PDF 'Afwezigheidassistent instellen' (insite.oisterwijk.nl/index.php) staat onder de tekst 'Stap 2:' een lijst. Elk van deze lijst-items is in de codelaag opgemaakt in een eigen L-tag. Hierdoor geeft hulpsoftware aan dat hier drie lijsten staan, terwijl er visueel maar één lijst staat. Zorg ervoor dat alle lijst-items van deze lijst correct zijn geplaatst in één L-tag, hierbij moet elk lijst-item in een eigen LI-tag zijn geplaatst.


1.3.2 Betekenisvolle volgorde (Niveau A)

Als de volgorde waarin content wordt gepresenteerd van invloed is op zijn betekenis, kan een correcte leesvolgorde door software bepaald worden.

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Uitkomst: Onvoldoende

Bevindingen: Op de startpagina insite.oisterwijk.nl/ staat bij elke widget een knop. Deze knop is in de code boven de bijbehorende kop geplaatst. Dat maakt het voor screenreadergebruikers lastig te bepalen bij welke welke kop de knop hoort. Zorg ervoor dat in de HTML de knop na de bijhorende kop is geplaatst.


1.3.3 Zintuiglijke eigenschappen (Niveau A)

Instructies die geleverd worden om content te begrijpen en te bedienen zijn niet alleen afhankelijk van zintuiglijke eigenschappen van componenten zoals vorm, kleur, omvang, visuele locatie, oriëntatie of geluid.

Informatie over succescriterium 1.3.3 Zintuiglijke eigenschappen

Uitkomst: Voldoende


1.3.4 Weergavestand (Niveau AA)

De content beperkt de weergave en bediening niet tot een enkele presentatie-oriëntatie, zoals staand of liggend, tenzij een specifieke presentatie-oriëntatie essentieel is.

Informatie over succescriterium 1.3.4 Weergavestand

Uitkomst: Voldoende


1.3.5 Identificeer het doel van de input (Niveau AA)

Het doel van elk invoerveld waarmee informatie van de gebruiker wordt verzameld, kan door software bepaald worden wanneer:

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Uitkomst: Onvoldoende

Bevindingen: Op pagina insite.oisterwijk.nl/inloggen staat een formulier waar de bezoeker hun eigen gebruikersnaam en wachtwoord kunnen invullen. Het doel van deze en een aantal andere velden moet programmatisch kunnen worden bepaald, zodat velden automatisch kunnen worden ingevuld of extra hulp kan worden geboden bij het invullen. Dit kan door het autocomplete-attribuut aan de input-elementen toe te voegen. Bijvoorbeeld voor e-mailadres autocomplete="email".
Een overzicht van de velden waarvoor het autocomplete-attribuut van toepassing is en de waarde die nodig is in dit attribuut, staat op de pagina: www.w3.org/tr/wcag21/.


1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Kleur wordt niet als het enige visuele middel gebruikt om informatie over te brengen, een actie aan te geven, tot een reactie op te roepen of een visueel element te onderscheiden.

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevindingen: Advies: In het Twitter iframe-element op pagina insite.oisterwijk.nl/ staan verschillende links die alleen te herkennen zijn aan hun tekstkleur. Bezoekers die kleuren niet (goed) kunnen zien zullen moeite hebben met het herkennen van deze links. Zorg er daarom voor dat links in lopende tekst bij voorkeur te herkennen zijn op een manier die niet afhankelijk is van kleur, bijvoorbeeld door de links te onderstrepen. De contrastratio tussen de tekstkleur en de omliggende tekst is hier hoog genoeg, waardoor dit niet afkeurbaar is, maar het is wel een dringend advies.
Dit probleem komt ook voor bij links in de lopende tekst in de widget 'Laatste reacties Nieuws' op dezelfde pagina, en het probleem komt ook op andere pagina's voor, bijvoorbeeld op de pagina's insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening en insite.oisterwijk.nl/personeelsplein/product/afwezigheidsassistent-instellen-423.


1.4.2 Geluidsbediening (Niveau A)

Als een geluidsweergave op een webpagina automatisch meer dan 3 seconden speelt, is er of een mechanisme beschikbaar om de geluidsweergave te pauzeren of te stoppen, of er is een mechanisme beschikbaar om het geluidsvolume onafhankelijk van het overall systeemvolume te regelen.

Informatie over succescriterium 1.4.2 Geluidsbediening

Uitkomst: Voldoende


1.4.3 Contrast (minimum) (Niveau AA)

De visuele weergave van tekst en afbeeldingen van tekst heeft een contrastverhouding van ten minste 4,5:1, behalve in de volgende gevallen:

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevindingen: In de widget 'Verjaardagen' op de startpagina insite.oisterwijk.nl/ staat de grijze tekst 'Januari' (HEX #95979E). Op de witte achtergrond heeft deze tekst een te laag contrast. De contrastverhouding is hier 2,9:1, waar dat minimaal 4,5:1 moet zijn. Ook de dagen van de week (HEX#767E87) die zijn aangegeven in deze widget hebben een te laag contrast op de achtergrond (HEX #EDEEF2). Hier is de contrastverhouding 3,5:1.

In het Twitter iframe-element op pagina insite.oisterwijk.nl/ komen blauwe linkteksten voor. De contrastratio tussen de blauwe tekst (HEX #38A7F2) en de witte achtergrond is 2,6:1 waar dat minimaal 4,5:1 moet zijn.

In het menu staat een icoon waarmee bezoekers naar hun eigen accountpagina kunnen navigeren. De contrastratio tussen de initialen (HEX #272727) en de achtergrondkleur (HEX #384A5F) is 1,6:1 waar dat minimaal 3:1 moet zijn.

De grijze letters en cijfers (HEX #9FA1A7) op pagina insite.oisterwijk.nl/personeelsplein/alfabetisch hebben een te laag contrast op de witte achtergrond. De contrastverhouding is hier 2,5:1, waar dat minimaal 4,5:1 moet zijn.
Deze kleurencombinatie komt ook voor op pagina insite.oisterwijk.nl/personeelsplein/product/hybride-werken-595 en op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws.

In de PDF 'Afwezigheidassistent instellen' (insite.oisterwijk.nl/index.php) wordt op pagina 1 een rode tekst (HEX #ff0000) gebruikt. Het contrast van deze rode tekst op de witte achtergrond is te laag. De contrastverhouding is hier 4:1, waar dat minimaal 4,5:1 moet zijn.


1.4.4 Herschalen van tekst (Niveau AA)

Behalve voor ondertitels voor doven en slechthorenden en afbeeldingen van tekst, kan tekst zonder hulptechnologie tot 200% geschaald worden zonder verlies van content of functionaliteit.

Informatie over succescriterium 1.4.4 Herschalen van tekst

Uitkomst: Voldoende


1.4.5 Afbeeldingen van tekst (Niveau AA)

Als de gebruikte technologieën de visuele weergave tot stand kunnen brengen, wordt tekst gebruikt in plaats van afbeeldingen van tekst om informatie over te brengen, behalve in de volgende gevallen:

Informatie over succescriterium 1.4.5 Afbeeldingen van tekst

Uitkomst: Voldoende


1.4.10 Reflow (Niveau AA)

Content kan zonder verlies van informatie of functionaliteit en zonder te moeten scrollen in twee dimensies, worden weergegeven voor:

Met uitzondering van delen van de content die voor het gebruik of de betekenis een tweedimensionale lay-out vereisen.

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevindingen: Wanneer bezoekers inzoomen tot 400% op pagina insite.oisterwijk.nl/collegawijzer bij een schermbreedte van 1280x1024px, komen de knoppen 'Filter' en 'Lijstweergave' over de tekst 'Collegawijzer' te staan. Ook zijn bij deze schermweergave de gekozen opties in de comboboxen niet meer te lezen doordat de tekst wegvalt en valt het broodkruimelpad achter een vlak. Zorg ervoor dat content leesbaar blijft en niet over elkaar komt te staan wanneer bezoekers inzoomen op de pagina.
Deze problemen komen ook voor op andere pagina's, bijvoorbeeld op de pagina's insite.oisterwijk.nl/nieuwsoverzicht, insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening en insite.oisterwijk.nl/personeelsplein/overzicht.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws, valt de tekst 'Nieuwsbericht toevoegen' voor een deel buiten de schermweergave. Hierdoor is de tekst slecht leesbaar voor bezoekers die moeten inzoomen op de pagina.
Een soortgelijk probleem komt ook voor op andere pagina's, bijvoorbeeld op insite.oisterwijk.nl/nieuwsoverzicht en insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/883.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening, verdwijnt de 'Verstuur' knop bij de eerste tekstbewerker op de pagina. Zorg ervoor dat functionaliteiten niet verdwijnen wanneer bezoekers inzoomen op de pagina.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/883 gaat de relatie tussen de teksten 'Naam', 'Laatste bewerkt' en 'Bewerkt door' en de onderstaande content verloren doordat deze teksten onder elkaar komen te staan. Hierdoor is niet meer duidelijk waar de teksten 'Naam', 'Laatste bewerkt' en 'Bewerkt door' naar verwijzen. Dit probleem is bijvoorbeeld op te lossen door de content op deze pagina op te maken als tabel, zie ook succescriterium 1.3.1.
Dit probleem komt ook voor op andere pagina's, bijvoorbeeld op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/1032 en insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/content/1031.

Opmerking: Wanneer bezoekers bij een schermbreedte van 1280x1024px inzoomen tot 150% op pagina insite.oisterwijk.nl/inloggen, is het gedeelte van het scherm waarin content wordt getoond erg klein. Dit komt door een wit vlak dat een groot deel van het scherm in beslag neemt. Dit kan ervoor zorgen dat bezoekers die moeten inzoomen op de pagina, bijvoorbeeld vanwege slechtzicht, de content op de pagina niet goed kunnen lezen.


1.4.11 Contrast van niet-tekstuele content (Niveau AA)

De visuele weergave van het volgende heeft een contrastverhouding van ten minste 3:1 ten opzichte van aangrenzende kleuren:

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevindingen: Wanneer op de pagina insite.oisterwijk.nl/inloggen met het toetsenbord focus wordt geplaatst op de knop 'Inloggen', is het contrast van de focusrand (HEX #D0EACC) op de witte achtergrond te laag. De contrastverhouding is hier 1,2:1, waar dat minimaal 3:1 moet zijn.
Dit contrastprobleem komt ook voor op andere pagina's, bijvoorbeeld bij de knop 'Opslaan' op pagina insite.oisterwijk.nl/widget en bij de knop 'Filteren' op pagina insite.oisterwijk.nl/collegawijzer.

Wanneer op pagina insite.oisterwijk.nl/collegawijzer focus wordt geplaatst op de comboboxen, heeft de focusrand (HEX #BFD6DE) een te laag contrast op de witte achtergrond. De contrastverhouding is hier 1,5:1, waar dat minimaal 3:1 moet zijn.


1.4.12 Tekstafstand (Niveau AA)

Bij content die wordt geïmplementeerd met opmaaktalen die de volgende stijleigenschappen voor tekst ondersteunen, is er geen sprake van verlies van content of functionaliteit door het instellen van alle volgende, en door het niet wijzigen van andere stijleigenschappen:

Uitzondering: Menselijke talen en scripts die geen gebruik maken van een of meer van deze stijleigenschappen voor tekst in schriftelijke tekst, kunnen voldoen aan de eisen door alleen gebruik te maken van de eigenschappen die bestaan voor de betreffende combinatie van taal en script.

Informatie over succescriterium 1.4.12 Tekstafstand

Uitkomst: Voldoende


1.4.13 Content bij hover of focus (Niveau AA)

Wanneer aanvullende content zichtbaar wordt en daarna weer verborgen, door het gebruik van hover met de aanwijzer of focus met het toetsenbord, gelden de volgende zaken:

Uitzondering: De visuele weergave van de aanvullende content wordt beheerd door de user agent en wordt niet aangepast door de auteur.

Informatie over succescriterium 1.4.13 Content bij hover of focus

Uitkomst: Voldoende


2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Alle functionaliteit van de content is bedienbaar via een toetsenbordinterface zonder dat afzonderlijke toetsaanslagen aan tijd gebonden zijn, behalve als de onderliggende functie een invoer vereist die afhangt van het pad dat de gebruiker aflegt en niet alleen van de eindpunten.

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevindingen: Op de startpagina insite.oisterwijk.nl/ staat bij elke widget een knop die is gelabeld met drie punten. De knoppen zijn niet te bedienen met het toetsenbord, de toetsenbordfocus kan hier niet worden geplaatst. Een mogelijke oorzaak van dit probleem is dat de knoppen niet zijn opgemaakt met een button-element maar met een div-element. Zorg ervoor dat alle elementen die je met de muisaanwijzer kan bedienen ook te bedienen zijn met het toetsenbord.

Op pagina insite.oisterwijk.nl/ staat de knop 'Acties'. Deze knop is niet te bedienen met het toetsenbord. Een mogelijk oorzaak hiervoor is dat de knop niet is opgemaakt met een button-element. Hierdoor zijn ook de functies achter de knoppen niet te bedienen met het toetsenbord.
Dit probleem komt voor op meerdere pagina's, bijvoorbeeld ook op pagina insite.oisterwijk.nl/nieuwsoverzicht en insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening.

In de widget 'Verjaardagen' op de startpagina insite.oisterwijk.nl/ staat een kalender. De dagen met verjaardagen zijn klikbaar, wanneer er op wordt geklikt wordt aanvullende content getoond. Deze functionaliteit is niet beschikbaar voor toetsenbordgebruikers.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht staat de knop 'Categorieën'. Deze knop is niet te bedienen met het toetsenbord.

In de tekstbewerker op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws staan elementen die niet te bedienen zijn met het toetsenbord, bijvoorbeeld de combobox waarmee tekst een stijl kan worden gegeven in de toolbar. Er is wel een instructie waarmee toetsenbordgebruikers de toolbar in de tekstbewerker kunnen bereiken, maar deze instructie is alleen beschikbaar voor bezoekers die gebruikmaken van voorleessoftware, ziende toetsenbordgebruikers krijgen deze instructie niet mee. Dit komt doordat de instructie is geplaatst in het title-attribuut op het iframe-element van de tekstbewerker. Zorg ervoor dat de instructie waarmee toetsenbordgebruikers de toolbar kunnen bereiken beschikbaar is voor alle gebruikers, bijvoorbeeld door deze als tekst op de pagina te plaatsen.
Deze tekstbewerker komt ook voor op de pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening werkt de tekst 'Iersel, Jessica van' als uitklapbare knop voor bezoekers die gebruikmaken van de muisaanwijzer. Voor toetsenbordgebruikers is deze functionaliteit niet beschikbaar. Zorg ervoor dat het voor toetsenbordgebruikers mogelijk is deze knop te bedienen zoals gebruikers van de muisaanwijzer dat kunnen.

Op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening staan de tabbladen 'Leden (5)', 'Paginabeheerder (1)' en 'Volgers (0)'. Deze tabbladen zijn niet te bedienen met het toetsenbord. Zorg ervoor dat het mogelijk is voor toetsenbordgebruikers om focus te plaatsen op de tabs, zodat zij de content achter de tabbladen zichtbaar kunnen maken.
Soortgelijke tabbladen die niet te bedienen zijn met het toetsenbord komen ook voor op andere pagina's, bijvoorbeeld op pagina’s insite.oisterwijk.nl/organisatie/detail/bedrijfshulpverlening-bhv en insite.oisterwijk.nl/organisatie/detail/college.

Op de pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee, waar bezoekers hun profiel kunnen bewerken, staat bij de profielfoto een knop waarmee bezoekers deze foto kunnen verwijderen. Deze knop is niet te bedienen met het toetsenbord.

Op pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee staat onder de tab 'Beschikbaarheid' de knop 'Periode toevoegen'. Wanneer bezoekers op de knop klikken verschijnt er een verwijderknop, gelabeld met een rood kruis, op het scherm. Deze verwijderknop is niet te bedienen met het toetsenbord.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/, verdwijnt het navigatiemenu achter een knop. In het menu staat de knop 'Tabblad sluiten'. Deze knop is niet te bedienen met het toetsenbord. Een mogelijk oorzaak hiervoor is dat de knop niet is opgemaakt met een button-element.


2.1.2 Geen toetsenbordval (Niveau A)

Als de toetsenbordfocus met de toetsenbordinterface verplaatst kan worden naar een component van de pagina, dan kan de focus ook met alleen de toetsenbordinterface weer van dat component weg worden bewogen. En, als er meer nodig is dan de standaard pijl- of tabtoetsen of andere standaard methoden om de focus te verplaatsen, dan wordt de gebruiker geïnformeerd over de manier waarop de focus kan worden verplaatst.

Informatie over succescriterium 2.1.2 Geen toetsenbordval

Uitkomst: Voldoende


2.1.4 Enkel teken sneltoets (Niveau A)

Wanneer een sneltoets in content wordt geïmplementeerd door alleen letters (inclusief hoofdletters en kleine letters), leestekens, cijfers of symbolen te gebruiken, geldt ten minste één van de volgende zaken:

Informatie over succescriterium 2.1.4 Enkel teken sneltoets

Uitkomst: Voldoende


2.2 Genoeg tijd

2.2.1 Timing aanpasbaar (Niveau A)

Voor elke tijdslimiet die door de content wordt ingesteld, geldt ten minste één van de volgende zaken:

Informatie over succescriterium 2.2.1 Timing aanpasbaar

Uitkomst: Niet aanwezig


2.2.2 Pauzeren, stoppen, verbergen (Niveau A)

Voor alle bewegende, knipperende, scrollende of automatisch actualiserende informatie gelden alle volgende zaken:

Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen

Uitkomst: Voldoende


2.3 Toevallen en fysieke reacties

2.3.1 Drie flitsen of beneden drempelwaarde (Niveau A)

Webpagina's bevatten niets wat meer dan drie keer flitst in enige periode van één seconde of de flits is beneden de algemene flits- en rodeflitsdrempelwaarden.

Informatie over succescriterium 2.3.1 Drie flitsen of beneden drempelwaarde

Uitkomst: Voldoende


2.4.1 Blokken omzeilen (Niveau A)

Er is een mechanisme beschikbaar om blokken content die op meerdere webpagina's worden herhaald te omzeilen.

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Voldoende

Bevindingen: Advies: Op de startpagina insite.oisterwijk.nl/ staat een iframe-element van Facebook. Het is met het toetsenbord mogelijk om focus te plaatsen op alle elementen binnen dit iframe. Doordat er telkens weer een nieuw bericht wordt geladen wanneer toetsenbordgebruikers bij het laatste bericht zijn aangekomen, is het voor hen lastig om uit de widget te navigeren. Om dit op te lossen kan bijvoorbeeld een mechanisme waarmee toetsenbordgebruikers het iframe kunnen overslaan worden gebruikt.
Een soortgelijk probleem komt ook voor op pagina insite.oisterwijk.nl/collegawijzer.


2.4.2 Paginatitel (Niveau A)

Webpagina's hebben titels die het onderwerp of doel beschrijven.

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevindingen: De pagina's insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening en insite.oisterwijk.nl/nieuwsoverzicht hebben dezelfde paginatitel terwijl beide pagina's andere content bevatten. Bezoekers kunnen deze twee pagina's niet van elkaar onderscheiden aan de hand van de paginatitel. Zorg ervoor dat verschillende pagina's altijd een unieke paginatitel hebben.
Die probleem komt voor bij meerdere pagina's, bijvoorbeeld pagina's insite.oisterwijk.nl/personeelsplein/product/afwezigheidsassistent-instellen-423 en insite.oisterwijk.nl/personeelsplein die dezelfde paginatitel hebben maar andere content bevatten.

In de PDF 'Afwezigheidassistent instellen' (insite.oisterwijk.nl/index.php) is een documenttitel aan het bestand gegeven in de eigenschappen. Echter, deze documenttitel wordt niet getoond wanneer het bestand wordt geopend. Zorg ervoor dat in de eigenschappen van de PDF is aangegeven dat bij open de documenttitel wordt getoond en niet de bestandsnaam, dit kan worden ingesteld bij 'Weergave bij openen' in de eigenschappen.


2.4.3 Focus volgorde (Niveau A)

Als een webpagina sequentieel genavigeerd kan worden en de navigatiesequenties hebben invloed op de betekenis of het gebruik, dan krijgen focusbare componenten de focus in de juiste volgorde waardoor betekenis en bedienbaarheid behouden blijft.

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevindingen: Op de startpagina insite.oisterwijk.nl/ krijgt eerst de content van de pagina toetsenbordfocus en daarna pas het navigatiemenu. Dit is geen logische focusvolgorde. Eerst moet het navigatiemenu op de pagina focus krijgen, pas daarna mag de rest van de pagina focus krijgen.
Wanneer bezoekers inzoomen op de pagina verdwijnt het navigatiemenu achter een knop die staat in een navigatiebalk. Deze knoppen in deze navigatiebalk moeten eerst toetsenbordfocus krijgen voor de andere content op de pagina focus krijgt.

Op pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee kunnen bezoekers onder 'Beschikbaarheid' een periode per dag toevoegen. Echter krijgen éérst alle dagen van de week toetsenbordfocus, en daarna pas de knop 'Periode toevoegen' voor maandag. Zorg ervoor dat de optie om een periode voor een dag ná die dag komt, en ook herkenbaar is als zodanig met een duidelijke toegankelijke naam.

Op pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee staat onder de tab 'Beschikbaarheid' de knop 'Periode toevoegen'. Wanneer toetsenbordgebruikers deze knop hebben geactiveerd, verschijnen er invoervelden op het scherm. De toetsenbordfocus wordt niet op deze velden geplaatst maar blijft staan op de knop 'Periode toevoegen'. Hierdoor kunnen bezoekers die het scherm niet kunnen zien en afhankelijk zijn van voorleessoftware de verschenen invoervelden missen. Zorg ervoor dat de toetsenbordfocus op de invoervelden wordt geplaatst zodra deze verschijnen.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/, staat het Insite logo boven aan de pagina. Ondanks dat dit logo bovenaan de pagina staat krijgt het niet als eerst focus. Dit is geen logische volgorde. Zorg ervoor dat dit logo als eerst focus krijgt op de pagina wanneer is ingezoomd.

Wanneer bij een schermbreedte van 1280x1024px wordt ingezoomd tot 400% op pagina insite.oisterwijk.nl/, verdwijnt het navigatiemenu achter een knop. Wanneer bezoeker deze knop openen met het toetsenbord, wordt de toetsenbordfocus niet in het menu geplaatst. Hierdoor zijn de links in het menu niet te bedienen voor toetsenbordgebruikers. Zorg ervoor dat nadat het menu is geopend, de toetsenbordfocus wordt geplaatst op de eerste link binnen dit menu. Dit probleem komt ook voor bij een andere knop die verschijnt: de tijdlijnknop.
Een ander probleem bij dit menu is dat het mogelijk is om de toetsenbordfocus te plaatsen op de achterliggende pagina terwijl het menu over de pagina staat. Hierdoor weten ziende toetsenbordgebruikers niet welk element focus heeft. Zorg ervoor dat de toetsenbordfocus niet uit het menu wordt gehaald tot de bezoeker het menu afsluit. Dit probleem komt ook voor bij de andere knoppen die verschijnen wanneer er wordt ingezoomd op de pagina: de zoekknop en tijdlijnknop.


Het linkdoel kan bepaald worden uit enkel de linktekst of uit de linktekst samen met zijn door software bepaalde linkcontext, behalve daar waar het doel van de link een dubbelzinnige betekenis zou kunnen hebben voor gebruikers in het algemeen.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevindingen: In het Facebook iframe-element op de startpagina insite.oisterwijk.nl/ staan meerdere links die geen toegankelijke naam hebben, zie ook succescriterium 4.1.2. Het gaat onder andere om het logo van de gemeente Oisterwijk die is opgemaakt als link. Zonder toegankelijke naam weten screenreadergebruikers niet waar de link naar verwijst. Zorg ervoor dat links altijd een toegankelijk naam hebben.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht staat onderaan paginering, daarin staan links zoals '2', ' 3' en 'Volgende'. Visueel is duidelijk dat deze links naar een pagina verwijzen, maar voor bezoekers die het scherm niet kunnen zien is dat niet duidelijk. Zorg ervoor dat de toegankelijk namen van deze links duidelijk aangeven dat de link naar een pagina verwijst, bijvoorbeeld door de toegankelijk namen aan te passen naar 'Pagina 2', 'Pagina 3' en 'Volgende pagina'.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening zijn de profielafbeeldingen van ander gebruikers opgemaakt als link. Deze links hebben geen toegankelijke naam. Hierdoor zijn de links moeilijk te bedienen voor bezoekers die afhankelijk zijn van spraakbediening of voorleessoftware. Zorg ervoor dat deze links een toegankelijke naam krijgen, bijvoorbeeld door aan alt-attribuut te plaatsen op het img-element van de profielfoto, of door aria-label te gebruiken op het a-element.
Op andere pagina's staan ook afbeeldingen die zijn opgemaakt als link maar geen toegankelijke naam hebben, bijvoorbeeld op de pagina’s insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/fotobibliotheek/1033/album/interne-… en insite.oisterwijk.nl/beeldbank/categorie/onderwijs.

Op pagina insite.oisterwijk.nl/personeelsplein/overzicht komen meerdere links voor die de linktekst 'Meer' hebben. Al deze links verwijzen naar een andere pagina. Visueel is duidelijk waar deze links bij horen, maar voor bezoekers die het scherm niet kunnen zien is het lastig deze links van elkaar te onderscheiden. Zorg ervoor dat de toegankelijke naam van de 'Meer' links duidelijk maakt naar welke pagina de link verwijst, bijvoorbeeld door de toegankelijke naam aan te vullen met de naam van de pagina waar de link naar verwijst.

Op pagina insite.oisterwijk.nl/personeelsplein/overzicht staan blokken content met daarin een afbeelding en een kop, bijvoorbeeld het blok 'ICT'. Deze afbeeldingen hebben een alternatieve tekst. Zowel de kop als de afbeelding zijn in een a-element geplaatst en werken daardoor als link. Doordat de afbeelding ook in het a-element is geplaatst, is de alternatieve tekst van de afbeelding onderdeel van de link. Hierdoor geeft toegankelijke naam van de link het linkdoel niet goed aan. Omdat er ook andere problemen zijn met deze afbeelding, zie ook succescriterium 3.1.2, is de beste oplossing voor dit probleem om de alternatieve tekst van de afbeelding te verwijderen en het img-element een leeg alt-attribuut te geven.

De afbeeldingen op pagina insite.oisterwijk.nl/beeldbank/categorie/onderwijs zijn opgemaakt als links. Al deze links hebben de toegankelijke naam 'Link' gekregen via het aria-label. Dit omschrijft het doel van deze links niet. Zorg ervoor dat de toegankelijke naam van elke link omschrijft wat de link doet, in dit geval het vergroten van een afbeelding, en de afbeelding omschrijft. Een voorbeeld van een goede toegankelijke naam voor deze links is: 'Vergroot afbeelding [omschrijving afbeelding]'.

Advies: Bij verschillende links is een title-attribuut op het a-element geplaatst, bijvoorbeeld bij de link 'Gezocht: voorzitters stembureau op 15 maart' op pagina insite.oisterwijk.nl/. Bij deze links is de waarde van het title-attribuut hetzelfde als de content in het a-element. Hierdoor leest een screenreader dezelfde linktekst mogelijk twee keer voor. Wij raden aan om het title-attribuut niet te gebruiken wanneer de link al een linktekst heeft.

Advies: Op pagina insite.oisterwijk.nl/inloggen staat het logo van Insite. Het logo is ook opgemaakt als link, deze link heeft door het alt-attribuut op het img-element van het logo en een screenreader only tekst de toegankelijke naam 'Logo Insite Insite' ontvangen. Wanneer een a-element om een img-element is geplaatst wordt de waarde in het alt-attribuut op het img-element automatisch de toegankelijke naam van de link, de screenreader only tekst is hier overbodig en zorg ervoor dat de toegankelijke naam van de link dubbel is. Wij raden aan om de screenreader only tekst te verwijderen zodat de toegankelijke naam van de link 'Logo Instite' wordt.
Dit logo komt op meerdere pagina's voor.


2.4.5 Meerdere manieren (Niveau AA)

Er is meer dan één manier beschikbaar om een webpagina binnen een verzameling webpagina's te vinden, behalve wanneer de webpagina het resultaat is van, of een stap in, een proces.

Informatie over succescriterium 2.4.5 Meerdere manieren

Uitkomst: Onvoldoende

Bevindingen: Niet alle pagina's zijn op meerdere manier op de website te vinden. Alle pagina's zijn via een url te vinden, maar er is geen tweede methode waarmee bezoekers de pagina's kunnen vinden. Op de website is wel een zoekfunctie aanwezig, toch kunnen niet alle pagina's via deze zoekfunctie gevonden worden. De pagina insite.oisterwijk.nl/personeelsplein/categorie/ict-51 is bijvoorbeeld niet te vinden via de zoekfunctie. Zorg ervoor dat er minimaal twee methodes zijn waarmee bezoekers pagina's kunnen vinden, dit kan door bijvoorbeeld gebruik te maken van een sitemap of een zoekfunctie die alle pagina's kan vinden.


2.4.6 Koppen en labels (Niveau AA)

Koppen en labels beschrijven het onderwerp of doel.

Informatie over succescriterium 2.4.6 Koppen en labels

Uitkomst: Onvoldoende

Bevindingen: In de widget 'Verjaardagen' op de startpagina insite.oisterwijk.nl/ staan twee knoppen. Deze knoppen krijgen een toegankelijke naam door het icoon waarmee het visueel is gelabeld. Dit is geen goede toegankelijke naam. De toegankelijke naam van deze knoppen moet aangeven dat met de knoppen naar de vorige en volgende maand kan worden genavigeerd.

Op de startpagina insite.oisterwijk.nl/ staat het Facebook iframe-element. Dit iframe heet via het title-attribuut de toegankelijke naam 'fb:page Facebook Social Plugin' gekregen. Deze toegankelijke naam omschrijft de inhoud van het iframe niet. Zorg ervoor dat de toegankelijke naam de inhoud van het element omschrijft.
Dit geldt ook voor het Twitter iframe-element op deze pagina. Dat heeft via het title-attribuut de toegankelijke naam 'Twitter Timeline' ontvangen.


2.4.7 Focus zichtbaar (Niveau AA)

Elke gebruikersinterface die met een toetsenbord te bedienen is, heeft een bedieningswijze waarbij de indicator van de toetsenbordfocus zichtbaar is.

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevindingen: Op pagina insite.oisterwijk.nl/widget staan schakelknoppen. Wanneer deze knoppen focus hebben wordt dit niet visueel aangegeven. Ziende toetsenbordgebruikers weten zonder visuele indicatie niet welk element focus heeft. Zorg ervoor dat focus altijd wordt aangegeven met een visuele indicatie, bijvoorbeeld een focusrand.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws is het niet zichtbaar wanneer de knoppen 'Kies een bestand' focus hebben. Hierdoor weten ziende toetsenbordgebruikers niet welk element focus heeft. Zorg ervoor dat de focus altijd wordt aangegeven met een visuele indicator, zoals een focusrand.
Deze knoppen komen ook voor op pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee.

De koppen en afbeeldingen op pagina insite.oisterwijk.nl/personeelsplein/overzicht zijn opgemaakt als links. Wanneer toetsenbordfocus op deze links wordt geplaatst, is dat niet zichtbaar. Zorg ervoor wanneer een link focus heeft, dit wordt aangeven met een visuele indicator, bijvoorbeeld een focusrand.


2.5 Input modaliteiten

2.5.1 Aanwijzergebaren (Niveau A)

Alle functionaliteit waarmee bij de bediening gebruik wordt gemaakt van meerpunts- of padgebaseerde gebaren, kan worden bediend met een enkele aanwijzer zonder een padgebaseerd gebaar, tenzij een meerpunts- of padgebaseerd gebaar essentieel is.

Informatie over succescriterium 2.5.1 Aanwijzergebaren

Uitkomst: Niet aanwezig


2.5.2 Aanwijzerannulering (Niveau A)

Voor functionaliteit die kan worden bediend met een enkele aanwijzer, geldt ten minste één van de volgende zaken:

Informatie over succescriterium 2.5.2 Aanwijzerannulering

Uitkomst: Voldoende


2.5.3 Label in naam (Niveau A)

Bij componenten van de gebruikersinterface met labels die tekst of afbeeldingen van tekst bevatten, bevat de naam de tekst die visueel wordt weergegeven.

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Voldoende


2.5.4 Bewegingsactivering (Niveau A)

Functionaliteit die kan worden bediend door de beweging van een apparaat of beweging van een gebruiker, kan ook worden bediend met componenten van de gebruikersinterface. De reactie op de beweging kan worden uitgeschakeld om onbedoelde activering te voorkomen, behalve wanneer:

Informatie over succescriterium 2.5.4 Bewegingsactivering

Uitkomst: Niet aanwezig


3. Begrijpelijk

3.1 Leesbaar

3.1.1 Taal van de pagina (Niveau A)

De standaard menselijke taal van elke webpagina kan door software bepaald worden.

Informatie over succescriterium 3.1.1 Taal van de pagina

Uitkomst: Voldoende


3.1.2 Taal van onderdelen (Niveau AA)

De menselijke taal van elke passage of zin in de content kan door software bepaald worden, behalve waar het gaat om eigennamen, technische termen, woorden uit een onbepaalde taal en woorden of zinsdelen die deel zijn gaan uitmaken van het jargon van de onmiddellijk omringende tekst.

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevindingen: Wanneer in het formulier op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws de velden 'Publicatiedatum' en 'Sluitingsdatum' verkeerd worden ingevuld, verschijnt de foutmelding 'newsItem.starttime: The date "%s" was not recognized (for format "%s").' op het scherm. Deze foutmelding is in een andere taal dan de hoofdtaal van de pagina, ook is geen taalwissel aangegeven op deze tekst. Zorg ervoor dat de foutmelding in het Nederlands is of geef een taalwissel aan op deze tekst. Het is overigens beter wanneer een foutmelding in dezelfde taal is als de hoofdtaal van de pagina.

Op pagina insite.oisterwijk.nl/personeelsplein/overzicht staan afbeeldingen met een Engelse, alternatieve tekst. De hoofdtaal van de pagina is Nederlands en op de afbeeldingen is geen taalwissel aangeven. De afbeeldingen zijn decoratief, het is niet verplicht om een decoratieve afbeelding een alternatieve tekst te geven. Omdat er nog andere problemen zijn met deze afbeeldingen, zie succescriterium 2.4.4, is de beste oplossing om de alternatieve tekst van de afbeeldingen te verwijderen.
Op pagina insite.oisterwijk.nl/organisatie/detail/bedrijfshulpverlening-bhv komt ook een afbeelding voor dat via het title-attribuut een Engelse alternatieve tekst krijgt. Vertaal deze alternatieve tekst of geeft een taalwissel aan op de afbeelding met het lang-attribuut.


3.2 Voorspelbaar

3.2.1 Bij focus (Niveau A)

Als een component van de gebruikersinterface de focus krijgt, dan veroorzaakt dat geen contextwijziging.

Informatie over succescriterium 3.2.1 Bij focus

Uitkomst: Voldoende


3.2.2 Bij input (Niveau A)

Verandering van de instelling van een component van de gebruikersinterface veroorzaakt niet automatisch een contextwijziging, tenzij de gebruiker geïnformeerd is over het gedrag vóór het gebruik van de component.

Informatie over succescriterium 3.2.2 Bij input

Uitkomst: Voldoende


3.2.3 Consistente navigatie (Niveau AA)

Navigatiemechanismen, die op meerdere webpagina's binnen een verzameling webpagina's herhaald worden, komen elke keer dat ze worden herhaald in dezelfde relatieve volgorde voor, tenzij een verandering wordt geïnitieerd door de gebruiker.

Informatie over succescriterium 3.2.3 Consistente navigatie

Uitkomst: Voldoende

Bevindingen: Opmerking: Op pagina insite.oisterwijk.nl/bestaatniet komt geen navigatiemenu voor. Dit kan verschillende bezoekers hinderen wanneer zij op deze pagina terecht komen, vooral omdat de tekst op de pagina ook verwijst naar het navigatiemenu.


3.2.4 Consistente identificatie (Niveau AA)

Componenten die dezelfde functionaliteit hebben binnen een verzameling webpagina's worden consistent geïdentificeerd.

Informatie over succescriterium 3.2.4 Consistente identificatie

Uitkomst: Voldoende


3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Als een invoerfout automatisch ontdekt wordt, dan wordt het onderdeel waar de fout zit geïdentificeerd en wordt de fout tekstueel aan de gebruiker meegedeeld.

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevindingen: Op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws wordt gebruik gemaakt van HTML5-foutmeldingen op verplichte velden. Deze foutmeldingen zijn onvolledig en blijven maar kort in beeld staan, dit zorgt er onder andere voor dat sommige mensen de meldingen niet kunnen lezen. Zorg ervoor dat meldingen altijd aangeven welke fout is gemaakt en in beeld blijven staan tot de bezoeker het formulier weer verstuurd. Los dit probleem op door eigen foutmeldingen toe te voegen aan het formulier.

Wanneer in het formulier op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws de velden 'Publicatiedatum' en 'Sluitingsdatum' verkeerd worden ingevuld, verschijnt de foutmelding 'newsItem.starttime: The date "%s" was not recognized (for format "%s").' op het scherm. Dit is geen goede foutmelding. Zorg ervoor dat de foutmelding in dezelfde taal is als de hoofdtaal van de pagina, zie ook succescriterium 3.1.2, en dat de melding aangeeft welke fout is gemaakt. Daarnaast moet deze melding ook aangeven in welk veld de fout is gemaakt door het veld bij het label te noemen.


3.3.2 Labels of instructies (Niveau A)

Als de content gebruikersinvoer vereist, dan worden labels of instructies geleverd.

Informatie over succescriterium 3.3.2 Labels of instructies

Uitkomst: Onvoldoende

Bevindingen: In de widgets 'Overheidsnieuws' en 'Nieuw Outside' op de startpagina insite.oisterwijk.nl/ staan comboboxen. Deze comboboxen hebben geen visueel label bij de het veld staat. Dit kan het voor verschillende bezoekers lastig maken om een goede optie te selecteren. Zorg ervoor dat comboboxen altijd een visueel label hebben.

Op pagina insite.oisterwijk.nl/collegawijzer staan het invoerveld 'Naam'. Dit invoerveld heeft een placeholdertekst als label. Deze tekst verdwijnt wanneer bezoekers iets invoeren bij het veld. Zorg ervoor dat invoervelden een label hebben dat bij het veld blijft staan, ook bij invoerveld. Dit geldt ook voor de comboboxen op deze pagina. Bij deze invoervelden is het label één van de opties en verdwijnt daarom wanneer bezoekers een andere optie selecteren.


3.3.3 Foutsuggestie (Niveau AA)

Als een invoerfout automatisch ontdekt wordt en suggesties voor verbetering bekend zijn, dan worden de suggesties aan de gebruiker geleverd, tenzij dit de beveiliging of het doel van de content in gevaar zou brengen.

Informatie over succescriterium 3.3.3 Foutsuggestie

Uitkomst: Onvoldoende

Bevindingen: Wanneer in het formulier op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws de velden 'Publicatiedatum' en 'Sluitingsdatum' verkeerd worden ingevuld, verschijnt de foutmelding 'newsItem.starttime: The date "%s" was not recognized (for format "%s").' op het scherm. Wanneer een bepaald format verplicht is bij het invoeren van een veld, moet dit zijn aangeven. Zorg ervoor dat de foutmelding een suggestie geeft hoe de bezoeker de gemaakte fout kan oplossen, door bijvoorbeeld een voorbeeld te geven van het format dat de bezoeker moet gebruiken.


Voor webpagina's die wettelijke verplichtingen of financiële transacties voor de gebruiker uitvoeren, die, door de gebruiker te beheren gegevens in gegevensopslagplaatsen verwijderen of wijzigen, of die antwoorden van de gebruiker verzenden, geldt minstens één van de volgende zaken:

  1. Omkeerbaar: Verzendingen kunnen ongedaan gemaakt worden.
  2. Gecontroleerd: Door de gebruiker ingevoerde gegevens worden gecontroleerd op invoerfouten en de gebruiker wordt de mogelijkheid gegeven om ze te verbeteren.
  3. Bevestigd: Er is een mechanisme beschikbaar voor het beoordelen, bevestigen en verbeteren van informatie voordat de verzending wordt voltooid.

Informatie over succescriterium 3.3.4 Foutpreventie (wettelijk, financieel, gegevens)

Uitkomst: Niet aanwezig


4. Robuust

4.1 Compatibel

4.1.1 Parsen (Niveau A)

In content die geïmplementeerd is met opmaaktalen hebben elementen volledige begin- en eindtags, zijn elementen genest volgens hun specificatie, bevatten elementen geen dubbele attributen en zijn alle ID's uniek, behalve waar de specificatie deze eigenschappen toelaat.

Informatie over succescriterium 4.1.1 Parsen

Uitkomst: Onvoldoende

Bevindingen: Op pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening komt de dubbele id 'tx_windcomments_comment' voor. Dit kan problemen opleveren met hulpsoftware. Zorg dat id's unieke waarden hebben op een pagina.


4.1.2 Naam, rol, waarde (Niveau A)

Voor alle componenten van de gebruikersinterface (inclusief, maar niet uitsluitend voor formulierelementen, links en door scripts gegenereerde componenten), kunnen de naam (name) en rol (role) door software bepaald worden; toestanden (states), eigenschappen (properties) en waarden (values) die door de gebruiker ingesteld kunnen worden, kunnen door software ingesteld worden; en kennisgeving van veranderingen in deze items is beschikbaar voor user agents, met inbegrip van hulptechnologieën.

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Uitkomst: Onvoldoende

Bevindingen: Op de startpagina insite.oisterwijk.nl/ staat bij elke widget een knop. In de code is deze knop niet opgemaakt als knop, dit zorgt er onder andere voor dat de knop niet te bedienen is met het toetsenbord, zie succescriterium 2.1.1. Deze knoppen moeten ook een toegankelijke naam en rol hebben. Een toegankelijk rol kan worden gegeven aan het element met het role-attribuut of door de knop op te maken met het button-element. De knoppen hebben wel een toegankelijke naam via het title-attribuut gekregen. Wij raden aan om het title-attribuut niet te gebruiken om elementen een toegankelijke naam te geven, het attribuut wordt namelijk makkelijk overschreven. Gebruik daarom aria-label of een soortgelijke methode om een element een toegankelijk naam te geven.

In het Facebook iframe-element op de startpagina insite.oisterwijk.nl/ staat meerdere links die geen toegankelijke naam hebben, zie ook succescriterium 2.4.4. Zorg er altijd voor dat elementen een toegankelijke naam hebben, bijvoorbeeld door aria-label te gebruiken.
Op andere pagina’s komen ook links voor die geen toegankelijke naam hebben, bijvoorbeeld op pagina insite.oisterwijk.nl/projecten/detail/visie-op-dienstverlening/fotobibliotheek/1033/album/interne-….

Wanneer op onder andere pagina insite.oisterwijk.nl/ op de zoekknop wordt gedrukt, verschijnt er een invoerveld in beeld. Dit veld heeft geen toegankelijke naam, zie ook succescriterium 1.3.1. Hierdoor is het veld lastig in te vullen voor bezoekers die gebruikmaken van spraakbediening of voorleessoftware. Zorg ervoor dat het veld een goede toegankelijke naam krijgt.
Op andere pagina's staan ook invoervelen die geen toegankelijke naam hebben, bijvoorbeeld op pagina insite.oisterwijk.nl/beeldbank/zoeken of op pagina insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee onder de tab 'Beschikbaarheid'.

Op pagina insite.oisterwijk.nl/collegawijzer staan drie comboboxen die geen toegankelijke naam hebben. Hierdoor zijn de comboboxen moeilijk te bedienen voor bezoekers die gebruikmaken van voorleessoftware of spraakbediening. Zorg ervoor dat de comboboxen een toegankelijke naam krijgen, bijvoorbeeld door gebruik te maken van een label-element en deze aan de comboboxen te koppelen met for- en id-attributen.

Op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws staan onder de tab 'Tekst' kleuren die bezoekers kunnen selecteren. In de code zijn deze kleuren opgemaakt als keuzerondjes (radiobuttons), maar ze hebben geen toegankelijke naam. Hierdoor weten bijvoorbeeld screenreadergebruikers niet welke optie zij selecteren. Zorg ervoor dat de keuzerondjes een toegankelijke naam krijgen, bijvoorbeeld door gebruik te maken van aria-label op het input-element.

In de tekstbewerker op pagina insite.oisterwijk.nl/nieuwsoverzicht/beheer-nieuws staat een toolbar met verschillende knoppen. Deze knoppen hebben geen toegankelijke naam. Zorg ervoor dat knoppen altijd een toegankelijke naam hebben die omschrijft wat de knop doet, bijvoorbeeld door gebruik te maken van aria-label.
Deze tekstbewerker komt ook voor op de pagina insite.oisterwijk.nl/nieuwsoverzicht/artikel/de-juiste-namen-in-je-mail-ondertekening.

Op pagina insite.oisterwijk.nl/personeelsplein/product/afwezigheidsassistent-instellen-423 is een lijst opgemaakt met role=tablist. De role=tablist is geplaatst op het ul-element van deze lijst. Wanneer role=tablist is gebruikt op een element moet in dit element een element met role=tab zijn genest. Dat gebeurt hier niet. De role=tab is geplaatst op een a-element wat is genest binnen het li-element in het ul-element. Zorg ervoor dat wanneer role=tablist is gebruikt op een element, role=tab is geplaatst op een element dat is genest binnen het element met role=tablist.
Een soortgelijk probleem komt ook voor op andere pagina's, bijvoorbeeld op insite.oisterwijk.nl/collegawijzer/bewerken/heijnis-kaylee en op pagina insite.oisterwijk.nl/personeelsplein/product/wachtwoord-vergeten-of-account-vergrendeld.


4.1.3 Statusberichten (Niveau AA)

In content die is geïmplementeerd met opmaaktalen kunnen statusberichten door software bepaald worden met behulp van rol (role) of eigenschappen (properties), zodat hulptechnologieën de berichten aan de gebruiker kunnen presenteren zonder dat ze de focus krijgen.

Informatie over succescriterium 4.1.3 Statusberichten

Uitkomst: Voldoende

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

Webbrowsers (useragents) en andere software

Bij dit onderzoek is de volgende software gebruikt:

Bronnen

Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.

Bron: toegankelijkheidsrapport.swink.nl/oisterwijk-intranet/audit/
Geprint: 2024-04-25 17:29:16 v2.4-011