Issues:
Audit digitale toegankelijkheid website SIEN app Goudse Verzekeringen

(Alleen de bevindingen)

Scope van de evaluatie

Uitgebreide toetsresultaten

1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Bevinding 1: In de SIEN omgeving staat op iedere pagina het logo van de Goudse verzekeringen zonder tekstalternatief. Zorg ervoor dat hulpsoftware deze visuele informatie aan haar gebruikers kan weergeven. Zorg tevens dat het woord "logo" erin voorkomt. Dit heeft meerdere voordelen. Door de algemene plaatsing van dergelijke logo's kan bijvoorbeeld een bezoeker die meerdere tabbladen open heeft staan, gemakkelijk tussen websites navigeren en pagina's identificeren.

Bevinding 2: In de SIEN omgeving staan in het scherm met de paginatitel "Dossier Overview Werkgever" cards met dossiers gerangschikt naar jaar. Iedere card bevat een link met een afbeelding van een blauwe pijl opgemaakt als button waarmee een scherm met een invoerproces wordt geopend. Deze hebben deze geen alternatieve tekst waardoor gebruikers van schermleessoftware niet snappen waar ze voor dienen. Zorg dat het alt attribuut van de afbeelding aangeeft waar de pijlen naartoe navigeren. Zie tevens SC 1.3.1.

Bevinding 3: In de SIEN omgeving staan in de navigatiebalk twee menuitems: een knop "uw dossier" dat een gelijknamige pop-up opent, en een knop met de gebruikersnaam die een uitklapmenu opent. Het profielicoon is ondergebracht in een img element met role=presentation, waardoor het wordt genegeerd door hulpsoftware. Dit icoon heeft betekenis, maak het ook voor hulpsoftware duidelijk dat dit het profiel betreft.

Bevinding 4: In de SIEN omgeving staan in het scherm met de paginatitel "Uploaden verzamelloonstaat" bij een geüpload document een download- en een verwijder link opgemaakt als button. Het verwijderonderdeel heeft geen toegankelijke naam waardoor er slechts "knop" wordt aangekondigd door schermleessoftware. Zorg voor een tekst alternatief dat de functie omschrijft.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Bevinding 5: In de SIEN omgeving staan in het scherm met de paginatitel "Dossier Overview Werkgever" cards met dossiers gerangschikt naar jaar. Iedere card bevat een link met een afbeelding van een blauwe pijl opgemaakt als button waarmee een scherm met een invoerproces wordt geopend. Alle cards zijn ondergebracht in een ongeordende lijst (ul). Gebruikers van schermleessoftware die middels de tabtoets door het scherm navigeren, horen slechts dat er een lijst met 4 items is, en viermaal "leeg". Dit komt door het gebrek aan alternatieve tekst en gebruik van role=button waardoor schermleessoftware niet meer aankondigt dat er links aanwezig zijn. Zorg er voor dat elk interactief element een toegankelijke beschrijving heeft, bijvoorbeeld door aria-label of aria-labelledby te gebruiken. Zie tevens SC 1.1.1.

Bevinding 6: In de SIEN omgeving staat in het scherm met de paginatitel "Wizard starten" onder de kop “Wij vragen u vriendelijk de volgende gegevens bij de hand te houden.” informatie in een korte opsommingslijst. echter betreft dit geen lijst in HTML. De tekens worden als "min" voorgelezen, wat verwarrend kan zijn, bijvoorbeeld "min uw voorlopige jaarloonsom over 2025" of indien men bijvoorbeeld cijfermatige content toevoegt. Maak dergelijke lijsten op ongeordend (ul) op. Dit probleem doet zich elders ook voor, bijvoorbeeld op "Uploaden verzamelloonstaat". Hier is er ook een genummerde opsomming aanwezig, gebruik hiervoor een geordende (ol) lijst.

Bevinding 7: In de SIEN omgeving staat in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" bij het uitklappen van de knop "Bekijk details" een tooltip met additionele informatie. De tooltip is toetsenbordtoegankelijk, echter wordt de tekst niet door hulpsoftware voorgelezen. Zorg dat dit tevens toegankelijk is. door bijvoorbeeld role=”tooltip” te gebruiken.

Bevinding 8: In de SIEN omgeving in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" staat bij "Verstuur gegevens" een selectievakje. Het visuele label "Ik bevestig dat ik alle (vooringevulde) gegevens heb gecontroleerd" is niet als label gecodeerd en niet aan het selectievakje gekoppeld. Dit kan bijvoorbeeld opgelost worden door van het span een label te maken en een goede for/id combinatie te gebruiken zodat hulpsoftware de structuur op correcte wijze aan haar gebruiker kan weergeven.

Bevinding 9: Advies: In de SIEN omgeving staan in de navigatiebalk twee menuitems: een knop "uw dossier" dat een gelijknamige pop-up opent, en een knop met de gebruikersnaam die een uitklapmenu opent. Het is bevorderlijk om deze functies onder te brengen in geneste lijsten binnen een nav-element, waardoor schermleessoftware de omvang van de content en de landmark role aan haar gebruiker kan weergeven.

1.3.5 Identificeer het doel van de input (Niveau AA)

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Bevinding 10: In de SIEN omgeving komt men na het versturen van de Premievaststelling vanaf het scherm met de paginatitel "Bevestig en verstuur" op de bevestigingspagina "Uw gegevens zijn verstuurd". Hier is een formulierveld aanwezig om een telefoonnummer in te voeren. Er zit een autocomplete attribuut op het element, echter is dit niet de juiste waarde. Zorg dat het autocomplete=tel betreft.

1.4 Onderscheidbaar

1.4.4 Herschalen van tekst (Niveau AA)

Informatie over succescriterium 1.4.4 Herschalen van tekst

Bevinding 11: In de SIEN omgeving staat in de HTML-code bij meta name="viewport" de volgende instellingen: "maximum-scale=1" en "user-scalable=no". Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Laat de restrictie op user scalability weg. Zie tevens SC 1.4.10.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Bevinding 12: In de SIEN omgeving staat in de HTML-code bij meta name="viewport" de volgende instellingen: "maximum-scale=1" en "user-scalable=no". Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Dit veroorzaakt bijvoorbeeld op een schermstand van 1280x1024 pixels vanaf 125% zoom dat een deel van de navigatiebalk niet meer zichtbaar is. Er verschijnt tweedimensionaal scrollen voor in de plaats, echter is dit niet een toegestaan alternatief. Het tweedimensionaal scrollen doet zich ook voor in pop-ups, bijvoorbeeld in het scherm "controleer en verstuur" indien de melding "U moet eerst uw gegevens over [jaar] aanleveren, voordat u dit voor [jaar] kunt doen" verschijnt. want het gebruik van de knoppen bemoeilijkt. Laat de restrictie op user scalability weg. Zie tevens SC 1.4.4.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Bevinding 13: In de SIEN omgeving ontvangt het menuitem met het profiel in de navigatiebalk geen focus, waardoor het niet toegankelijk is voor toetsenbordgebruikers. Zorg dat alle interactieve elementen de focus ontvangen.

Bevinding 14: In de SIEN omgeving staat in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" bij het uitklappen van de knop "Bekijk details" in de rij "Indicatie aantal verzekerde werknemers" een icoon die de pop-up "Verzekerde werknemers" opent. Dit icoon betreft een img-element opgemaakt middels role=button. Het ontvangt focus, echter is de pop-up niet met het toetsenbord te openen. Een goede oplossing zou zijn om dergelijke elementen middels een button element te plaatsen zodat het direct alle eigenschappen van een knop bezit, in plaats van een aria-rol aan een img-element toe te voegen. Zie tevens SC 4.1.2.

Bevinding 15: In de SIEN omgeving staat in de navigatiebalk een knop met de gebruikersnaam die een uitklapmenu opent. Indien men "Mijn gegevens" kiest opent een pop-up. Bij een schermstand kleiner dan 1280x1024 pixels ontstaat een scrollbalk om bij alle content te komen dat slechts met de muis bediend kan worden. Zorg dat dergelijke scrollbare regions ook toetsenbordtoegankelijk zijn.

Bevinding 16: In de SIEN omgeving staan in het scherm met de paginatitel "Dossier Overview Werkgever" cards met dossiers gerangschikt naar jaar. Iedere card bevat een blauwe pijl in de vorm van een link opgemaakt als button en openen een scherm met een invoerproces. Er is een klikbaar broodkruimelpad aanwezig waardoor men tussen de 4 stappen kan navigeren. Deze elementen maken geen deel uit van de focusvolgorde en zijn slechts middels de muis bedienbaar. Zorg dat deze onderdelen ook toetsenbordtoegankelijk zijn.

2.4 Navigeerbaar

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Bevinding 17: Op elke pagina ontbreekt een mechanisme om de herhalende content over te slaan. Bezoekers die de website met toetsenbord bedienen en/of hulpsoftware moeten op elke pagina langs dezelfde onderdelen gaan voordat ze bij de inhoud van de pagina zijn. Dit kan je oplossen door een link op de pagina te plaatsen (skiplink) die de focus verplaatst naar de eerste unieke inhoud van de pagina. Deze link moet de eerste link van de pagina zijn. Deze link mag standaard verborgen zijn voor bezoekers, maar moet zichtbaar worden als de focus er op komt wanneer met het toetsenbord wordt genavigeerd.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Bevinding 18: In de SIEN omgeving staat in de navigatiebalk een knop met de gebruikersnaam die een uitklapmenu opent. Bij het navigeren middels het toetsenbord, gaat de focus over op de onderliggende pagina terwijl dit menu uitgeklapt blijft. Zorg dat de focus binnen het menu blijft en voeg tevens een sluitknop toe. Toetsenbordnavigatie wordt extra beperkt door het gebrek van focusindicatie, zie hiervoor tevens bevindingen bij SC 2.1.1 en 2.4.7.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Bevinding 19: In de SIEN omgeving is er vaak geen focusindicator zichtbaar indien de focus staat op interactieve elementen, bijvoorbeeld in het scherm met de paginatitel "Dossier Overview Werkgever" met de cards van dossier gerangschikt naar jaar, en in de verschillende stappen van de processen. Dit is met name verwarrend voor bezoekers die middels het toetsenbord navigeren, gezien je niet weet waar op de pagina je op dat moment bevindt. Zorg voor een goede focusindicator op interactieve elementen.

3. Begrijpelijk

3.1 Leesbaar

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Bevinding 20: Advies: In de SIEN omgeving staat in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" bij het uitklappen van de knop "Bekijk details" in de rij "Indicatie aantal verzekerde werknemers" een icoon die de pop-up "Verzekerde werknemers" opent. De pijltjes om content te ordenen hebben middels een aria-label de alternatieve tekst "sort [kolomnaam]" gekregen. Wijzig dit naar "sorteer" of "sorteren naar" gezien het een Nederlandstalige omgeving betreft. Bij langere teksten in een andere taal wordt het afgekeurd als er geen taalwissel in de code is aangegeven, hier is het een advies.

3.2 Voorspelbaar

3.2.4 Consistente identificatie (Niveau AA)

Informatie over succescriterium 3.2.4 Consistente identificatie

Bevinding 21: In de SIEN omgeving staan in het scherm met de paginatitel "Dossier Overview Werkgever" cards met dossiers gerangschikt naar jaar. Iedere card bevat een blauwe pijl in de vorm van een link opgemaakt als button en openen een scherm met een invoerproces. Er is een broodkruimelpad aanwezig van de 4 verschillende schermen, echter heeft de laatste stap een paginatitel met de tekst "Wizard Stap8 Bevestig en verstuur" terwijl het stap 4 in het broodkruimelpad betreft. Zorg voor consistente benamingen.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Bevinding 22: In de SIEN omgeving komt men na het versturen van de Premievaststelling vanaf het scherm met de paginatitel "Bevestig en verstuur" op de bevestigingspagina "Uw gegevens zijn verstuurd". Hier is een formulierveld aanwezig om een telefoonnummer in te voeren. Indien er geen input is geleverd, ontstaat de melding "Alleen cijfers zijn toegestaan". Dit is geen correcte foutidentificatie en kan verwarrend zijn voor gebruikers van hulpsoftware, gezien men dan onder de veronderstelling is dat de invoer gecorrigeerd moet worden. Voeg foutidentificaties toe die betrekking hebben op de situatie, bijvoorbeeld "het veld telefoonnummer is niet ingevuld". De huidige melding is geen foutidentificatie maar een (onjuiste) foutsuggestie zoals bedoeld bij SC 3.3.3.

3.3.3 Foutsuggestie (Niveau AA)

Informatie over succescriterium 3.3.3 Foutsuggestie

Bevinding 23: In de SIEN omgeving komt men na het versturen van de Premievaststelling vanaf het scherm met de paginatitel "Bevestig en verstuur" op de bevestigingspagina "Uw gegevens zijn verstuurd". Hier is een formulierveld aanwezig om een telefoonnummer in te voeren. Indien er geen input is geleverd, ontstaat de melding "Alleen cijfers zijn toegestaan". Deze suggestie komt niet overeen met de situatie. Zie voor foutidentificatie SC 3.3.1.

Bevinding 24: In de SIEN omgeving in het scherm met de paginatitel "Uploaden verzamelloonstaat" kan men documenten toevoegen. Indien men een bestand upload dat geen PDF, JPG of PNG betreft, ontstaat de melding "Bestand: [bestandsnaam] is afgewezen: Dit type bestand is niet toegestaan". Zorg dat er duidelijk vermeld is welke bestandtypen wel toegestaan zijn. Dit wordt slechts aan het begin van het proces gemeld.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Bevinding 25: In de SIEN omgeving in het scherm met de paginatitel "Verwachting jaar" kan men middels een formulier de loonsom wijzigen. De labels (bijvoorbeeld "Welke loonsom verwacht u voor 2025 in euro's?") zijn niet aan de invoervelden gekoppeld. Zorg voor een goede for/id combinatie zodat hulpsoftware de structuur op correcte wijze aan haar gebruiker kan weergeven. Dit probleem doet zich op meerdere plaatsen voor, bijvoorbeeld bij het formulierveld op de bevestigingspagina "Uw gegevens zijn verstuurd" vanaf het scherm met de paginatitel "Bevestig en verstuur".

Bevinding 26:
In de SIEN omgeving staat in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" bij het uitklappen van de knop "Bekijk details" in de rij "Indicatie aantal verzekerde werknemers" een icoon die de pop-up "Verzekerde werknemers" opent. Dit icoon betreft een img-element opgemaakt middels role=button. Schermleessoftware identificeert het als knop, echter bezit het niet alle eigenschappen ervan. Het moet onder andere een toegankelijke naam bevatten, zorg dat dit door hulpsoftware herkenbaar is. Zie tevens SC 2.1.1. voor toetsenbordtoegankelijkheid.

Bevinding 27: In de SIEN omgeving staat in het scherm met de paginatitel "Wizard Stap8 Bevestig en verstuur" een blauw blok content met de kop "Verstuur gegevens". Dit onderdeel van de pagina is ondergebracht in een nav-element, terwijl het geen navigatie eigenschappen dient. Hulpsoftware zal deze rol wel aan haar gebruikers aankondigen wat verwarrend is. Een toepasselijker alternatief zou het section-element zijn.

4.1.3 Statusberichten (Niveau AA)

Informatie over succescriterium 4.1.3 Statusberichten

Bevinding 28: In de SIEN omgeving in het scherm met de paginatitel "Uploaden verzamelloonstaat" kan men documenten toevoegen. Eenmaal gedaan, ontstaat er de tekst "Succesvol geüpload op [datum] [tijd]". Voor ziende bezoekers is deze verandering leesbaar, echter wordt de verandering het niet door hulpsoftware aan haar gebruikers voorgelezen. Los dit op door bijvoorbeeld role="status" aan dit onderdeel toe te voegen. Hetzelfde probleem treed hier op als er bijvoorbeeld doordat het format van het bestand niet klopt een foutmelding gegeven wordt.

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

• Goudse SIEN app:
  http://sien2-accp.mendixcloud.com/sso/

Ondersteunende technieken

• HTML5
• CSS
• ECMAScript 5
• DOM
• SVG
• PDF

Bronnen

• Evaluatiedocument WCAG 2.0
  www.drempelvrij.nl/over-het-waarmerk
• Web Content Accessibility Guidelines (WCAG) 2.0 (Geautoriseerde Nederlandse vertaling)
  www.w3.org/Translations/WCAG20-nl
• Website Accessibility Conformance Evaluation Methodology (WCAG-EM)
  www.w3.org/WAI/eval/conformance
• Web Content Accessibility Guidelines (WCAG)
  www.w3.org/WAI/intro/wcag
• How to Meet WCAG 2.1 Quick Reference
  www.w3.org/WAI/WCAG21/quickref/

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