Issues:
Audit digitale toegankelijkheid website Univé
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Univé |
---|---|
Datum | 23 december 2024 |
Scope van de website |
Binnen de scope van het onderzoek valt:
|
Conformiteitsdoel | WCAG 2.1 niveau AA |
Uitgebreide toetsresultaten
1. Waarneembaar
1.1 Tekstalternatieven
1.1.1 Niet-tekstuele content (Niveau A)
Informatie over succescriterium 1.1.1 Niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 1: Op onder andere pagina https://www.unive.nl/ is het logo van Univé te vinden in een link naar de homepagina. Het logo is een svg-afbeelding en deze heeft geen alternatieve tekst. Omdat een logo een informatieve afbeelding is, is het belangrijk dat bezoekers die niet kunnen zien ook kunnen afleiden wat hierop te zien is. Los dit op door role=img aan de svg toe te voegen, en een title-element als eerste child-element. Voeg hierin de alternatieve tekst toe en zorg dat hierin het woord 'logo' en alle tekst die op de afbeelding te zien is terugkomt. Hieraan kan eventueel 'Terug naar homepagina' aan toegevoegd worden. Zie ook succescriterium 2.4.4.
Bevinding 2: Als op https://www.unive.nl/ het feedbackformulier wordt geopend (via de knop 'Feedback') opent een dialoogvenster waarop een afbeelding van het logo van Univé te zien is. Deze heeft als alternatieve tekst 'Logo'. Dit is onvoldoende beschrijvend. Wijzig de tekst, bijvoorbeeld naar 'Logo Univé'.
Bevinding 3: Op pagina https://www.unive.nl/reisverzekering is onder de kop 'Reisverzekering afsluiten' aan de kleur van vijf ster-iconen te zien hoe de gemiddelde beoordeling is. Deze informatie is niet beschikbaar voor bezoekers die niet kunnen zien, doordat de iconen svg-afbeeldingen zijn die via het aria-hidden attribuut zijn verborgen voor hulpsoftware. Zorg voor een alternatieve tekst of dat de informatie op andere wijze door hulpsoftware kan worden overgebracht (bijvoorbeeld door deze toe te voegen aan de linktekst van de link '1201 reviews'). Een soortgelijk probleem komt voor bij de beoordelingen onder de kop 'Univé-leden geven onze doorlopende reisverzekering gemiddeld een 8,5'. Ook op andere pagina's komt dit voor, bijvoorbeeld op pagina https://www.unive.nl/reisverzekering/doorlopend.
Bevinding 4: Op pagina https://login.pat.unive.nl/login heeft de afbeelding van het logo de alternatieve tekst 'Naar Univé'. Hieruit wordt niet duidelijk dat het logo van Univé zich hier bevindt. Het is belangrijk dat ook bezoekers die niet kunnen zien kunnen herkennen dat het hier om een logo gaat. Voeg deze informatie (het woord 'logo') daarom toe aan de alternatieve tekst.
Bevinding 5: Op de inlogpagina https://login.pat.unive.nl/login staat een afbeelding die geen alternatieve tekst heeft maar ook niet is verborgen voor hulpsoftware. Het gaat om een illustratie waarop meerdere mensen zijn te zien. Omdat het hier om een decoratieve afbeelding gaat kan deze voor hulpsoftware worden verborgen door het alt-attribuut toe te voegen en deze leeg te laten.
1.2 Op tijd gebaseerde media
1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)
Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 6: Op pagina https://www.unive.nl/klantenservice is onder de kop 'Veelgestelde vragen' een video te vinden nadat de knop 'Hoe kan ik een schade melden in Mijn Univé?' is uitgevouwen. Deze video bevat alleen automatisch gegenereerde ondertiteling, waarin taalfouten ('Univé' wordt bijvoorbeeld ondertiteld als 'Unif') voorkomen en interpunctie mist. Hierdoor is de ondertiteling mogelijk niet goed te volgen. Los dit op door zelf ondertiteling toe te voegen. Een soortgelijk probleem komt voor op pagina https://www.unive.nl/cybergerust?icmp=IL-19 bij de video 'Univé Cybergerust - Ook online alles beschermd wat je lief is'.
1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)
Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 7: Op pagina https://www.unive.nl/klantenservice is onder de kop 'Veelgestelde vragen' een video te vinden nadat de knop 'Hoe kan ik een schade melden in Mijn Univé?' is uitgevouwen. In de video op verschillende plaatsen tekst in beeld, bijvoorbeeld stap 4 en stap 5 vanaf tijdstip 0:28. Er ontbreekt uitgeschreven tekst en er is geen audiodescriptie die vertelt wat er op het scherm staat. Daardoor kunnen bezoekers die niet kunnen zien niet weten wat er wordt getoond in de video. Zet deze informatie in een transcript om te voldoen aan dit succes criterium. Of maak gebruik van een extra audiospoor om ook te voldoen aan succescriterium 1.2.5.
1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 8: Op pagina https://www.unive.nl/klantenservice is onder de kop 'Veelgestelde vragen' een video te vinden nadat de knop 'Hoe kan ik een schade melden in Mijn Univé?' is uitgevouwen. Bij deze video ontbreekt audiodescriptie, waardoor niet alle informatie die in beeld is beschikbaar is voor bezoekers die niet kunnen zien. Audiodescriptie is een (extra) audiospoor waarin verteld wordt wat er in beeld te zien is. Voeg een extra audiospoor toe waarin audiodescriptie te horen is. Een soortgelijk probleem komt voor op pagina https://www.unive.nl/cybergerust?icmp=IL-19 bij de video 'Univé Cybergerust - Ook online alles beschermd wat je lief is'.
Bevinding 9: Op pagina https://www.unive.nl/zorgverzekering/zorg-extra/ehbo komen videao's voor waarbij audiodescriptie mist. Bijvoorbeeld bij de video 'Wat je echt moet weten over verslikken'. Hier komt bij tijdstip 0:06 de naam en functie van de spreker in beeld, maar deze wordt niet uitgesproken en komt dus niet terug in de ondertiteling. Voor bezoekers die niet kunnen zien is deze informatie niet beschikbaar. Zorg dat alle informatie wordt uitgesproken, of dat een extra audiospoor met audiodescriptie wordt toegevoegd.
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 10: Op pagina https://www.unive.nl/ staat onder de header een zij-paneel met tabbladen. Visueel is aan de kleur en positie van de tekst af te leiden welk tabblad actief is. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader, is deze informatie niet beschikbaar. Los dit bijvoorbeeld op door het 'aria-selected' attribuut toe te voegen.
Bevinding 11: Op onder andere pagina https://www.unive.nl/ zijn in de footer teksten te vinden die visueel te herkennen zijn als koptekst. Bijvoorbeeld 'Ik wil graag..'. Deze tekst is opgemaakt met het strong-element, wat een andere semantische betekenis heeft dan een kop-element. Hierdoor is dit voor bezoekers die gebruik maken van hulpsoftware niet herkenbaar als koptekst. Los dit op door het op te maken als kop op het juiste kopniveau (bijvoorbeeld h2). Een soortgelijk probleem komt op meerdere plekken voor op de website. Bijvoorbeeld op pagina https://www.unive.nl/reisverzekering, waar onder de uitklapbare knop 'Eigen risico' visueel kopteksten te herkennen zijn die niet als kop maar met het strong-element zijn opgemaakt (bijvoorbeeld 'Bagage').
Bevinding 12: Op pagina https://www.unive.nl/ is de kop 'Win een Sit & Heat plofkussen' te vinden. Deze kop heeft geen content. Tekst die is opgemaakt als kop, moet bijbehorende content beschrijven. Als deze content er niet is, mag de tekst niet als kop opgemaakt zijn. In dit geval gaat het om een link, daarom kan dit worden opgelost door het h2-element te verwijderen en de tekst als gewone link op de pagina te plaatsen. Ditzelfde komt voor bij de kopteksten '2+1 gratis op Ziemi's fietsverlichting' en 'Schrijf je in voor de adventskalender'. Een soortgelijk probleem komt voor in het volgende blok, hierin heeft de kop 'Onze initiatieven' geen content omdat deze meteen wordt opgevolgd door een kop op hetzelfde kopniveau (h2). Hier zou dit kunnen worden opgelost door de subkoppen (zoals 'Univé buurtfonds') op te maken op kopniveau h3. Ook op andere pagina's komt dit voor, bijvoorbeeld op pagina https://www.unive.nl/over-unive bij de h3-koppen onder 'Univé in cijfers'.
Bevinding 13: Op pagina https://www.unive.nl/klantenservice bevindt zich een descriptionlist (dl- en dt-element) met daarin uitvouwbare knoppen. Deze lijst is niet op correcte wijze opgemaakt, omdat het eerste dl-element een dl-element als direct child-element heeft. Hierdoor kan de structuur van de lijst niet goed worden geïnterpreteerd door hulpsoftware. Los dit op door de lijst op de juiste manier te structureren, waarbij een dl-element bijvoorbeeld een dt- of dd-element als child element heeft.
Bevinding 14: Op pagina https://www.unive.nl/klantenservice staat onder de kop 'Chat met ons' een lijst met onderwerpen (onder 'Gaat je vraag over..'). Doordat deze lijst niet correct is opgemaakt, kan het in sommige browser en hulpsoftware combinaties voorkomen dat deze niet op correcte wijze geïnterpreteerd kan worden. Zorg om dit op te lossen dat de lijst-items (li) worden opgemaakt als directe child-elementen van het lijst-element (ul).
Bevinding 15: Op pagina https://www.unive.nl/reisverzekering/doorlopend staan onder de kop 'Welke gezinsleden wil je verzekeren?' drie selectievakjes met mogelijke antwoorden op deze vraag. Voor bezoekers die niet kunnen zien is het niet duidelijk op welke vraag zij kunnen antwoorden via de selectievakjes, doordat de vraag (koptekst) niet programmatisch hieraan is verbonden. Maak bijvoorbeeld gebruik van een combinatie van het fieldset- en legend element om dit op te lossen. Een soortgelijk probleem komt voor op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S2?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet bij stap 2 van het formulier, bijvoorbeeld bij de vraag 'Wilt u verzekerd zijn tijdens wintersport?'. Op deze pagina komt dit ook voor bij het invoerveld onder 'Uw werkgever/vereniging/bond'.
Bevinding 16: Op pagina https://www.unive.nl/zorgverzekering/zorg-extra/ehbo staan in het zij-menu twee links. Aan de styling is te zien welke van deze links de huidige pagina betreft, maar voor hulpsoftware is deze informatie niet beschikbaar. Los dit bijvoorbeeld op door het aria-current attribuut toe te voegen. Een soortgelijk probleem komt voor bij de mijn-univé pagina's (achter inlog), bijvoorbeeld https://acc.unive.nl/mijnunive/facturen-en-betalen.
Bevinding 17: Op pagina https://acc.unive.nl/mijnunive/facturen-en-betalen (achter inlog)
Bevinding 18: De PDF https://www.unive.nl/binaries/br/content/assets/particulier-sales/generiek/uc.24_03-22_uco_privacyverklaring.pdf en https://www.unive.nl/binaries/br/content/assets/zakelijk-sales/generiek/algemene_voorwaarden niet gecodeerd (van tags voorzien). Dit betekent dat de documentstructuur niet is te bepalen door hulpsoftware. Er kan daardoor bijvoorbeeld niet worden bepaald wat koppen zijn, wat de alternatieve tekst bij afbeeldingen en wat de leesvolgorde is. Omdat tags ontbreken kan de PDF niet volledig onderzocht worden (alle succescriteria met betrekking tot de PDF code laag zoals semantische koppen en alternatieve teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.
1.3.2 Betekenisvolle volgorde (Niveau A)
Informatie over succescriterium 1.3.2 Betekenisvolle volgorde
Uitkomst: Onvoldoende
Bevinding 19: Op pagina https://www.unive.nl/ staan onder de kop 'Het laatste nieuws' artikelen waarbij boven de koptekst een datum staat. Bijvoorbeeld bij 'Univé maakt zorgpremies 2025 bekend'. Bezoekers die niet kunnen zien en de tekst via hulpsoftware voorgelezen krijgen, kunnen lastig afleiden of de datum bij het voorgaande of volgende item hoort als zij door de artikelen heen gaan. Daarom is het belangrijk dat de kop vooraan staat in HTML, zodat deze eerst voorgelezen wordt. Visueel mag de huidige volgorde wel aangehouden worden.
1.3.5 Identificeer het doel van de input (Niveau AA)
Informatie over succescriterium 1.3.5 Identificeer het doel van de input
Uitkomst: Onvoldoende
Bevinding 20: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S3?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet
is een formulier waar de bezoeker onder andere het eigen e-mailadres kan 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: https://www.w3.org/tr/wcag21/#input-purposes. Ditzelfde komt voor op pagina https://www.unive.nl/premievergelijker en https://www.unive.nl/verzekeringspakket/premieberekenen-en-afsluiten/.
Bevinding 21: Op pagina https://login.pat.unive.nl/login heeft het invoerveld 'E-mailadres' wel een autocomplete-attribuut, maar deze heeft niet de juiste waarde. Deze is "off" waar dit "email" zou moeten zijn. Zorg ervoor dat het e-mailadres automatisch kan worden ingevuld in dit veld.
1.4 Onderscheidbaar
1.4.1 Gebruik van kleur (Niveau A)
Informatie over succescriterium 1.4.1 Gebruik van kleur
Uitkomst: Onvoldoende
Bevinding 22: Op onder andere pagina https://www.unive.nl/ is het bij sommige elementen alleen aan de kleur te zien als als de focus op het element staat. Bijvoorbeeld bij de menu-items of in de header bij de link 'Of doe de gratis ZorgCheck'. Ook bij de links in de footer is dit het geval. Voor sommige bezoekers is dit kleurverschil niet goed te zien, waardoor onduidelijk kan zijn waar de focus zich bevindt. De beste oplossing zou hier zijn om een duidelijk zichtbare focusrand toe te voegen.
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 23: Op pagina https://www.unive.nl/ komen verschillende links voor die eruit zien als een paarse knop, zoals 'Ontdek het hier' in de header. De witte tekst heeft onvoldoende contrast met de paarse (HEX #949BFF) achtergrond. De contrastverhouding is 2,5:1 waar deze minimaal 4,5:1 moet zijn. Deze kleurencombinatie komt op meerdere plekken voor, ook bij de kop 'Contact' en de links daaronder, en in de footer de link 'Neem contact met ons op'. Ook op andere pagina's komt dit voor. Bijvoorbeeld op pagina https://www.unive.nl/zoeken?k=verzekering bij de zoekresultaten. Tevens komt dit voor op de cookiemelding.
Het omgekeerde (paarse tekst op witte achtergrond) komt ook op verschillende plekken voor op de pagina en in de chatfunctie.
Bevinding 24: Op pagina https://www.unive.nl/ staat onder de header 'Zorgverzekering'. De groene (HEX #25DC71) tekstkleur heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 1,8:1 waar deze minimaal 4,5:1 moet zijn. Dezelfde kleurencombinatie komt voor bij een deel van de koptekst in de header, 'De zorgverzekering voor gezondheid, sport én bewegen'. Omdat het hier om grote tekst gaat moet de contrastverhouding hier minimaal 3:1 zijn.
Deze kleurencombinatie komt (met zowel grote als kleine tekst) op meerdere pagina's voor. Bijvoorbeeld op pagina https://www.unive.nl/over-unive in de header.
Bevinding 25: Op pagina https://www.unive.nl/ staan onder de kop 'Het laatste nieuws' verschillende nieuwsartikelen. Tussen de afbeelding en de kop staat een datum en een tag, bijvoorbeeld '4 oktober 2024 Gezondheid'. De grijze (HEX #999999) tekstkleur heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 2,8:1 waar deze minimaal 4,5:1 moet zijn. Ditzelfde komt voor onder de header bij de tekst 'Zorgverzekering' boven de kop die begint met 'De zorgverzekering voor gezondheid..'. Ook op andere pagina's komt dit probleem voor, bijvoorbeeld op pagina https://www.unive.nl/klantenservice bij de openingstijden onder de kop 'Andere verzekeringen'.
Bevinding 26: Op pagina https://www.unive.nl/ staan onder de kop 'Onze initiatieven' verschillende artikelen. Hierbij is een kop met witte tekstkleur te vinden op een afbeelding waarin verschillende kleuren voorkomen. Het contrast is niet overal voldoende. Bijvoorbeeld bij de kop 'Univé Buurtfonds' valt de witte tekst deels op grijze (HEX #AAAAAB) achtergrondkleur, waarbij de contrastverhouding 2,3:1 is. Zorg ervoor dat de contrastverhouding overal 3:1 is.
Bevinding 27: Nadat de chatfunctie is geopend zijn een aantal door Univé gestuurde berichten in het venster te zien. Deze bevatten paars (HEX #94A7FF) gekleurde links ('zorgchat'), welke op een lichtpaarse (HEX #F4F5FF) achtergrondkleur vallen. Dit levert een contrastprobleem op. De contrastverhouding is 2,1:1 waar deze minimaal 4,5:1 moet zijn.
Bevinding 28: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S3?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet komen foutmeldingen te staan na het foutief of niet invullen van invoervelden. Bijvoorbeeld bij stap 3 bij het invoerveld 'Voorletters'. De rode (HEX #FF5A5F) tekstkleur van de foutmelding heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 3:1 waar deze minimaal 4,5:1 moet zijn. Ditzelfde komt voor op paginahttps://www.unive.nl/premievergelijker en https://www.unive.nl/verzekeringspakket/premieberekenen-en-afsluiten/.
Bevinding 29: De PDF https://www.unive.nl/binaries/br/content/assets/zakelijk-sales/generiek/algemene_voorwaarden bevat meerdere contrastproblemen. Zo heeft de groene (HEX #24DC70) een contrastverhouding van 1,8:1 met de witte achtergrond. De paarse (HEX #939BFF) kleur heeft een contrastverhouding van 2,5:1 met de witte achtergrond. Ook komt de paarse kleur voor op lichtgrijze (HEX #F5F5F5) achtergrond, waar de contrastverhouding 2,3:1 is. Zorg dat de contrastverhouding minimaal 4,5:1 is. Dezelfde contrastproblemen komen voor in de PDF https://www.unive.nl/binaries/br/content/assets/particulier-sales/generiek/uc.24_03-22_uco_privacyverklaring.pdf.
1.4.4 Herschalen van tekst (Niveau AA)
Informatie over succescriterium 1.4.4 Herschalen van tekst
Uitkomst: Onvoldoende
Bevinding 30: Op elke pagina staat in de HTML-code bij meta name="viewport" de volgende instellingen: 'maximum-scale=1'. Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Laat deze instellingen weg.
1.4.10 Reflow (Niveau AA)
Informatie over succescriterium 1.4.10 Reflow
Uitkomst: Onvoldoende
Bevinding 31: Op elke pagina staat in de HTML-code bij meta name="viewport" de volgende instellingen: 'maximum-scale=1'. Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Laat deze instellingen weg.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 32: De cookiemelding die te zien is als de bezoeker voor het eerst op de pagina komt, bevat een aantal schuifknoppen (selectievakjes). Voor sommige bezoekers is niet goed te zien of deze 'aan' of 'uit' staan. Dit komt doordat het witte bolletje waarvan de stand wijzigt bij aan- of uitzetten onvoldoende contrast heeft met de grijze (HEX #D3D3D3) achtergrond (de contrastverhouding is dan 1,5:1) of de groene (HEX #25DC71) achtergrond (de contrastverhouding is dan 1,8:1). Ook als het witte bolletje niet te zien is zou aan het kleurverschil tussen grijs en groen kunnen worden afgeleid wat de stand is, als deze kleuren onderling voldoende contrast zouden hebben. Dit is echter niet het geval. Deze contrastverhouding is 1,2:1. Zorg dat het kleurcontrast overal minimaal 3:1 is.
Bevinding 33: Op pagina https://www.unive.nl/ komen verschillende knoppen voor waarin een wit symbool te zien is die de functie van de knop duidelijk maakt. Het gaat bijvoorbeeld om de knop 'Zoeken' in de header en footer, de knop 'Volgende' in de slider onder 'Het laatste nieuws', en de knop 'Start een chat' of 'Chat inklappen' waarmee de chatfunctie geopend danwel gesloten kan worden. Doordat het contrast tussen het witte symbool onvoldoende is met de paarse (HEX #949BFF) achtergrond, is dit niet voor alle bezoekers goed te zien. De contrastverhouding is 2,5:1 waar deze minimaal 3:1 moet zijn. Ook op andere pagina's komt dit voor.
Bevinding 34: Als op de pagina's het feedbackformulier wordt geopend via de knop 'Feedback', zijn verschillende kleuren smiley's te zien. Niet alle kleuren hebben voldoende contrast met de witte achtergrond, waardoor deze niet of niet goed zichtbaar zijn voor sommige bezoekers. Het gaat bijvoorbeeld om de lichtgroene (HEX #6AD97D) smiley die een contrastverhouding van 1,7:1 heeft, en de gele (HEX #FADE75) die een contrastverhouding van 1,3:1 heeft. Zorg ervoor de contrastverhouding overal minimaal 3:1 is.
Bevinding 35: Als op de pagina's het feedbackformulier wordt geopend via de knop 'Feedback', is een sluitknop (X) te zien. Het X-symbool heeft een rode (HEX #FF5A5F) kleur, welke onvoldoende contrast heeft met de lichtgrijze (HEX #F5F5F5) achtergrond. De contrastverhouding is 2,8:1 waar deze minimaal 3:1 moet zijn.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.1 Toetsenbord (Niveau A)
Informatie over succescriterium 2.1.1 Toetsenbord
Uitkomst: Onvoldoende
Bevinding 36: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S1?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet is het bij stap 1 mogelijk om met de muisaanwijzer de meer-informatie-knop ('i') te openen. Deze knop (opgemaakt als link) is niet via het toetsenbord te bereiken en bedienen, omdat hieraan het tabindex="-1" attribuut is toegevoegd. Verwijder dit attribuut en zorg dat het dialoogscherm met meer informatie ook via het toetsenbord kan worden geopend en gesloten. Ditzelfde komt ook voor bij de andere stappen in dit formulier.
Bevinding 37: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S1?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet is bij stap 2 de knop 'Lees meer' te vinden. Als hierop wordt gedrukt verschijnt een dialoogscherm. Deze is niet bereikbaar via het toetsenbord, waardoor de informatie niet beschikbaar is voor bezoekers die niet kunnen zien. Zorg ervoor dat dit element te open en sluiten en de content bereikbaar is via het toetsenbord.
2.1.4 Enkel teken sneltoets (Niveau A)
Informatie over succescriterium 2.1.4 Enkel teken sneltoets
Uitkomst: Onvoldoende
Bevinding 38: Op pagina https://www.unive.nl/klantenservice wordt gebruikgemaakt van de videospeler van YouTube. Deze is te vinden onder de kop 'Veelgestelde vragen' nadat de knop 'Hoe kan ik een schade melden in Mijn Univé' is uitgevouwen. Deze videospeler maakt gebruik van bediening door enkele tekentoetsen, bijvoorbeeld f voor fullscreen. Deze functionaliteit is iets wat mensen die afhankelijk zijn van hulpsoftware in de weg kan staan. Deze mensen zijn juist afhankelijk van die korte commando's om met hulpsoftware hun computer te bedienen. Op dit moment werkt de oplossing die we normaalgesproken zouden adviseren ('disablekb=1' toevoegen aan de URL) niet goed. De normale bediening gaat bij deze oplossing goed, maar zodra je instellingen wil aanpassen (zoals afspeelsnelheid) werkt dit niet via het toetsenbord. Daarom is een YouTube-videospeler (momenteel) niet goed toetsenbordtoegankelijk. Daarom adviseren we, tot dit probleem is opgelost, om andere videospeler te gebruiken.
2.4 Navigeerbaar
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 39: Pagina https://www.unive.nl/over-unive heeft als paginatitel 'Home - Unive'. Omdat dit niet de homepagina is, kan deze paginatitel verwarring opleveren. Wijzig de paginatitel, bijvoorbeeld naar 'Over Univé - Univé'.
Bevinding 40: Pagina https://www.unive.nl/404 heeft geen paginatitel, doordat in de HTML het title-element ontbreekt. Een paginatitel is belangrijk omdat dit het eerste is wat voorgelezen wordt nadat een bezoeker die hulpsoftware zoals een screenreader gebruikt naar een pagina navigeert. Voeg een title-element toe in HTML, met daarin een paginatitel.
Bevinding 41: De PDF https://www.unive.nl/binaries/br/content/assets/particulier-sales/generiek/uc.24_03-22_uco_privacyverklaring.pdf bevat geen documenttitel in de documenteigenschappen. Voeg een documenttitel toe, en stel bij 'weergave bij openen' in dat niet de bestandsnaam maar de documenttitel wordt weergegeven. Een soortgelijk probleem komt voor bij de PDF https://www.unive.nl/binaries/br/content/assets/zakelijk-sales/generiek/algemene_voorwaarden, deze heeft wel een documenttitel dus hier hoeft alleen 'weergave bij openen' te worden aangepast naar 'documenttitel'.
2.4.3 Focus volgorde (Niveau A)
Informatie over succescriterium 2.4.3 Focus volgorde
Uitkomst: Onvoldoende
Bevinding 42: Als de bezoeker voor het eerst op de pagina komt, is een cookiemelding te zien. Bezoekers die navigeren via het toetsenbord kunnen de cookiemelding pas wegklikken nadat zij door de hele pagina zijn gegaan. Doordat de cookiemelding een deel van de content bedekt is soms niet te zien waar de focus zich bevindt op de pagina. Zorg ervoor dat de cookiemelding vooraan komt te staan in de focusvolgorde.
Bevinding 43: Op meerdere pagina's, bijvoorbeeld https://www.unive.nl/, is het menu te vinden met hierin uitvouwbare menu-items zoals 'Verzekeringen'. Als een bezoeker die navigeert via het toetsenbord dit menu-item uitvouwt en vervolgens verder navigeert, gaat de focus eerst langs de andere menu-items en de zoekfunctie voordat deze in het uitgevouwen submenu terecht komt. Deze volgorde is niet logisch. Zorg ervoor dat de focus meteen naar het submenu gaat nadat deze is opengevouwen.
Bevinding 44: Op pagina https://www.unive.nl/ staat onder de header een zijpaneel met tabbladen. Als een tabblad geselecteerd wordt, gaat bij toetsenbordnavigatie de focus eerst langs alle andere tabbladen voordat deze bij de inhoud van het geselecteerde tabblad uitkomt. Dit is geen logische volgorde. Zorg ervoor dat de bezoeker meteen na het selecteren van een tabblad naar de inhoud hiervan gaat.
Bevinding 45: Als het dialoogscherm met de chatfunctie (te vinden op meerdere pagina's) is geopend, is het mogelijk om via het toetsenbord de focus te verplaatsen naar elementen buiten dit dialoogscherm. Omdat deze op dat moment content bedekt, is het mogelijk dat het niet zichtbaar is waar de focus zich bevindt. Los dit op door ervoor te zorgen dat de focus het dialoogscherm niet kan verlaten voordat deze wordt afgesloten. Ditzelfde geldt voor het dialoogvenster binnen de chatfunctie die via de knop 'Translate' kan worden geopend.
Bevinding 46: Op pagina https://www.unive.nl/zoeken?k=verzekering staat onder de zoekresultaten de knop 'Meer resultaten'. Als de bezoeker na op deze knop te hebben gedrukt verder navigeert via het toetsenbord, gaat de focus direct door naar de footer. Zorg dat de focus in plaats van naar de footer naar de nieuwe zoekresultaten gaat nadat op deze knop is gedrukt.
Bevinding 47: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S2?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet kan een formulier ingevuld worden dat bestaat uit meerdere stappen. Nadat op de 'Volgende' knop wordt gedrukt bij stap 1, springt de focus naar bovenaan de pagina. Zorg ervoor dat de focus naar het eerste focusbare element van stap 2 springt zodat het formulier op efficiënte wijze kan worden ingevuld.
Bevinding 48: Op pagina https://login.pat.unive.nl/login is de focusvolgorde bij verschillende elementen niet logisch. Zo is bij het invoerveld 'Wachtwoord' de link 'Wachtwoord vergeten?' te vinden, visueel is af te leiden dat deze elementen bij elkaar horen. Bezoekers die via het toetsenbord navigeren moeten na het invoerveld eerst nog langs andere elementen, voordat zij bij de link aankomen. Ditzelfde geldt voor de knop 'Inloggen' en de link 'Problemen met inloggen?'. Zorg dat de focusvolgorde dezelfde volgorde aanhoudt als de visuele volgorde.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 49: Op onder andere pagina https://www.unive.nl/ is het logo van Univé te vinden in een link naar de homepagina. Deze link heeft via een title-element de toegankelijke naam 'Terug naar homepagina' gekregen. Uit deze tekst maakt onvoldoende duidelijk wat het linkdoel is, omdat de naam van de organisatie ontbreekt. Dit kan worden opgelost door de afbeelding met het logo op de juiste manier een alternatieve tekst te geven, deze dient dan als toegankelijke naam van de link. Zie hiervoor succescriterium 1.1.1.
Bevinding 50: Op pagina https://www.unive.nl/klantenservice staan meerdere links die via het title-attribuut de toegankelijke naam 'Permalink' hebben gekregen. Deze zijn te vinden als onder de kop 'Veelgestelde vragen' de verschillende onderwerpen worden uitgevouwen. De tekst 'Permalink' maakt onvoldoende duidelijk wat het doel van de link is. Los dit bijvoorbeeld op door de koptekst van het bijbehorende onderwerp (bijvoorbeeld 'Hoe kan ik een schade melden in Mijn univé?') toe te voegen aan de naam van de link. Dit komt ook op andere pagina's voor, bijvoorbeeld op pagina https://www.unive.nl/cybergerust?icmp=IL-19 bij de uitvouwbare knoppen onder 'Veelgestelde vragen'.
Bevinding 51: Op pagina https://www.unive.nl/reisverzekering staat onder de kop 'Tips en informatie voor je volgende reis' de link 'Lees meer'. Deze linktekst maakt onvoldoende duidelijk wat het linkdoel is. Bezoekers die gebruik maken van hulpsoftware kunnen over de pagina navigeren via een opgevraagde lijst van links, hierbij is het belangrijk dat elke link een duidelijk linkdoel heeft. Los dit op door bijvoorbeeld de koptekst toe te voegen aan de toegankelijke linknaam. Omdat visueel wel duidelijk is waar de link bij hoort, hoeft dit niet op de pagina zichtbaar te zijn. Dit komt op meerdere pagina's voor, bijvoorbeeld op pagina https://www.unive.nl/reisverzekering/doorlopend.
Bevinding 52: Op pagina https://login.pat.unive.nl/login staan links naar verschillende sociale media, deze links hebben geen naam. Hierdoor gaat hulpsoftware zelf op zoek naar een naam en wordt soms een deel van de URL voorgelezen, maar dit gaat niet altijd goed. Een voorbeeld is de link naar Facebook. Zorg ervoor dat deze links een naam krijgen die het doel van de links duidelijk maakt. Zie ook succescriterium 4.1.2. Ditzelfde komt voor bij de andere pagina's van Mijn Univé (achter inlog), bijvoorbeeld https://acc.unive.nl/mijnunive/facturen-en-betalen.
2.4.7 Focus zichtbaar (Niveau AA)
Informatie over succescriterium 2.4.7 Focus zichtbaar
Uitkomst: Onvoldoende
Bevinding 53: Op onder andere pagina https://www.unive.nl/ is het bij sommige elementen niet zichtbaar als de focus hierop valt. Het gaat bijvoorbeeld om het logo (met link naar homepagina), om de zoek-knop en de links onder de kop 'Onze initiatieven'. Ook bij de sluitknop die te zien is nadat het feedback-formulier is geopend komt dit voor. Voor bezoekers die wel kunnen zien en navigeren via het toetsenbord, kan het daardoor lastig zijn om af te leiden waar zij zich bevinden op de pagina. Los dit bijvoorbeeld op door een duidelijk zichtbare focusrand toe te voegen.
3. Begrijpelijk
3.1 Leesbaar
3.1.2 Taal van onderdelen (Niveau AA)
Informatie over succescriterium 3.1.2 Taal van onderdelen
Uitkomst: Onvoldoende
Bevinding 54: Binnen de chatfunctie die op meerdere pagina's te vinden is, staat de knop 'Translate'. Omdat de taal van de pagina op Nederlands is ingesteld, kan hulpsoftware deze knop niet met de juiste uitspraak voorlezen. Omdat het ook verwarrend kan werken om een Engelstalige term te gebruiken op een Nederlandstalige pagina, is de beste oplossing het vertalen van de tekst. Overigens wordt de naam van de knop twee keer voorgelezen, omdat er twee span-elementen zijn met deze naam. Het is beter als de naam van de knop eenmalig wordt voorgelezen.
Bevinding 55: Op pagina https://www.unive.nl/reisverzekering staat de link '1201 reviews'. De Engelstalige term 'reviews' wordt door hulpsoftware niet goed voorgelezen, doordat de taal van de pagina op Nederlands is ingesteld. Vervang de Engelstalige term door een Nederlandstalige vertaling hiervan. Dit komt op meerdere pagina's voor, bijvoorbeeld op pagina https://www.unive.nl/reisverzekering/doorlopend.
3.2 Voorspelbaar
3.2.4 Consistente identificatie (Niveau AA)
Informatie over succescriterium 3.2.4 Consistente identificatie
Uitkomst: Onvoldoende
Bevinding 56: Op meerdere pagina's kan via de knop 'Start een chat' een chatfunctie geopend worden waarbinnen bij het invoerveld de knop 'Stuur' te vinden is. Hiermee kan de bezoeker de getypte vraag versturen. Op pagina https://www.unive.nl/klantenservice bevindt zich echter ook een chatfunctie met een invoerveld en een verzendknop, maar hier heet deze knop 'Zoek'. Dit kan verwarrend werken. Zorg ervoor dat deze elementen op dezelfde manier geïdentificeerd kunnen worden.
3.3 Assistentie bij invoer
3.3.1 Foutidentificatie (Niveau A)
Informatie over succescriterium 3.3.1 Foutidentificatie
Uitkomst: Onvoldoende
Bevinding 57: Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S3?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet verschijnt de foutmelding 'Dit veld is verplicht' als een invoerveld niet is ingevuld. Dat een veld verplicht is is een foutsuggestie zoals omschreven bij succescriterium 3.3.3, maar het maakt onvoldoende duidelijk wat er fout is gegaan. Vul de tekst aan, bijvoorbeeld met 'Invoerveld is niet ingevuld'. Ditzelfde komt voor op pagina https://www.unive.nl/premievergelijker en https://www.unive.nl/verzekeringspakket/premieberekenen-en-afsluiten/.
3.3.2 Labels of instructies (Niveau A)
Informatie over succescriterium 3.3.2 Labels of instructies
Uitkomst: Onvoldoende
Bevinding 58: Op pagina https://www.unive.nl/ staat onder de header een zijpaneel met tabbladen. Op het tabblad 'Autoverzekering' staat een invoerveld waarin het kenteken kan worden ingevuld. Alleen aan de styling van dit veld kan worden afgeleid wat hier moet worden ingevuld, maar er is geen tekstueel label. Daardoor is het voor sommige bezoekers mogelijk onduidelijk wat zij hier moeten invoeren en op welke manier. Voeg een label toe buiten het veld, zodat altijd zichtbaar blijft wat hier moet worden ingevoerd.
Bevinding 59: Op pagina https://www.unive.nl/ staat onder de header een zijpaneel met tabbladen. Op het tabblad 'Woonverzekering' staan invoervelden, zoals 'Postcode'. Wat in de invoervelden moet worden ingevuld kan alleen worden afgeleid uit de placeholdertekst. Dit is onvoldoende, omdat de placeholder verdwijnt op het moment dat de bezoeker begint te typen. Zorg ervoor dat er een label wordt toegevoegd buiten de invoervelden, zodat altijd zichtbaar blijft welke invoer wordt verwacht.
Bevinding 60: Op pagina https://www.unive.nl/ staat in de footer een zoekfunctie waarmee een locatie gezocht kan worden. Dat in dit veld een postcode of plaats moet worden ingevuld wordt duidelijk uit de placeholdertekst. Deze verdwijnt echter tijdens het typen, waardoor het op dat moment onduidelijk is dat deze zoekfunctie verschilt van de zoekfunctie die in de header van de pagina's staat. Plaats daarom een label buiten het veld dat altijd zichtbaar blijft.
Bevinding 61: Op pagina https://www.unive.nl/ kan via de knop 'Feedback' een feedbackformulier worden geopend. Bezoekers kunnen door op één van de emoticons te drukken de website beoordelen. De keuze-opties zijn visueel herkenbaar aan de emoticons, maar zijn opgemaakt als keuzerondjes. Voor bezoekers die niet kunnen zien en hulpsoftware gebruiken, is niet duidelijk welk keuzerondje bij welke keuze-optie hoort. Dit komt doordat de keuzerondjes geen label hebben. Voeg deze toe.
Bevinding 62: Als de chatfunctie (te vinden op meerdere pagina's) wordt geopend, is een invoerveld te vinden in de chat. Deze heeft als placeholdertekst 'Stel je vraag in een paar woorden'. Op het moment dat de bezoeker begint te typen, verdwijnt deze tekst. Daarom is voor sommige bezoekers (bijvoorbeeld met geheugen- of informatieverwerking problemen) op dat moment mogelijk onduidelijk wat zij hier kunnen invullen. Zorg dat de instructie buiten het veld wordt geplaatst zodat deze zichtbaar blijft tijdens het typen. Ditzelfde komt voor op pagina https://www.unive.nl/klantenservice bij het invoerveld onder 'Chat met ons'.
Bevinding 63: Op pagina Op pagina https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S3?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-12-04&originExtId=Internet staat een formulier dat uit meerdere stappen bestaat. Voorafgaand aan het invullen is het niet duidelijk welke velden verplicht zijn. Dit wordt pas duidelijk nadat er een foutmelding bij een invoerveld is verschenen. Dit kan verwarring opleveren. Maak via het label van verplichte velden duidelijk dat het om verplichte velden gaat. Ditzelfde komt voor op pagina https://www.unive.nl/premievergelijker en https://www.unive.nl/verzekeringspakket/premieberekenen-en-afsluiten/.
3.3.3 Foutsuggestie (Niveau AA)
Informatie over succescriterium 3.3.3 Foutsuggestie
Uitkomst: Onvoldoende
Bevinding 64: Op pagina https://login.pat.unive.nl/login staat het invoerveld 'E-mailadres'. Als deze niet correct wordt ingevuld, verschijnt een foutmelding met de tekst 'Dit e-mailadres is niet geldig'. Deze tekst geeft onvoldoende suggestie voor een oplossing. Los dit op door de tekst aan te passen, bijvoorbeeld naar 'Voer het e-mailadres in op de volgende manier:..'
4. Robuust
4.1 Compatibel
4.1.2 Naam, rol, waarde (Niveau A)
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 65: De cookiemelding die te zien is als de bezoeker de website voor het eerst bezoekt, bevat een aantal selectievakjes. Doordat deze geen toegankelijke naam hebben, is voor bezoekers die niet kunnen zien en hulpsoftware gebruiken wel te horen dat zich hier een selectievakje bevindt, maar niet waar deze bij hoort. Los dit op door een label aan de selectievakjes toe te voegen.
Bevinding 66: Op pagina https://www.unive.nl/ staat onder de header een zijpaneel die is opgemaakt als tabbladen in een tablist. Omdat binnen deze interactieve control-elementen (tabs) focusbare interactieve elementen (buttons) genest zijn, kan hulpsoftware dit niet altijd op de juiste manier interpreteren. Hierdoor kan het in sommige browser-hulpsoftware combinaties voorkomen dat de rol of staat van de elementen niet op de juiste manier voorgelezen wordt. Los dit op door dit op andere wijze op te maken.
Bevinding 67: Op pagina https://login.pat.unive.nl/login staan links naar verschillende sociale media, deze links hebben geen naam. Hierdoor gaat hulpsoftware zelf op zoek naar een naam en wordt soms een deel van de URL voorgelezen, maar dit gaat niet altijd goed. Een voorbeeld is de link naar Facebook. Zorg ervoor dat deze links een naam krijgen die het doel van de links duidelijk maakt. Zie ook succescriterium 2.4.4. Ditzelfde komt voor bij de andere pagina's van Mijn Univé (achter inlog), bijvoorbeeld https://acc.unive.nl/mijnunive/facturen-en-betalen.
Bevinding 68: Op pagina https://acc.unive.nl/mijnunive/facturen-en-betalen (achter inlog) staat de knop 'Betaalgegevens wijzigen'. De rol van dit element is voor hulpsoftware lastig te interpreteren, ook ontbreekt functionaliteit die bij een knop verwacht wordt. Het is niet mogelijk de focus hier naartoe te brengen bijvoorbeeld. Los dit bijvoorbeeld op door deze knop op te maken met het button-element.
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
- Homepagina:
https://www.unive.nl/ - Contact, Video 1:
https://www.unive.nl/klantenservice - Over ons:
https://www.unive.nl/over-unive - Zoekresultaten:
https://www.unive.nl/zoeken?k=verzekering - Niet bestaande pagina:
https://www.unive.nl/404 - Reisverzekering:
https://www.unive.nl/reisverzekering - Reisverzekering Doorlopend:
https://www.unive.nl/reisverzekering/doorlopend - Formulier Premie berekenen:
https://www.unive.nl/reisverzekering/doorlopend/premieberekenen-en-afsluiten?/add-single-application/form/fill-form/screen/S1?formExtId=doorlopendeReis&formDialogueExtId=aanvraagInternet&dateFormDefinition=2024-11-14&originExtId=Internet - Formulier Premievergelijker:
https://www.unive.nl/premievergelijker - Formulier Verzekeringspakket:
https://www.unive.nl/verzekeringspakket/premieberekenen-en-afsluiten/ - Kaart:
https://www.unive.nl/winkels?icmp=IL-149 - Video 1 Cybergerust:
https://www.unive.nl/cybergerust?icmp=IL-19 - Privacy en PDF pagina 1:
https://www.unive.nl/privacy - PDF 1:
https://www.unive.nl/binaries/br/content/assets/particulier-sales/generiek/uc.24_03-22_uco_privacyverklaring.pdf - Documenten PDF pagina 2:
https://www.unive.nl/zakelijk/documenten - PDF 2:
https://www.unive.nl/binaries/br/content/assets/zakelijk-sales/generiek/algemene_voorwaarden - Mijn univé, niet ingelogd:
https://acc.unive.nl/mijnunive - Mijn univé, wel ingelogd:
https://acc.unive.nl/mijnunive/ - Mijn univé, Overzicht:
https://acc.unive.nl/mijnunive/Overzicht - Mijn univé, Schade:
https://acc.unive.nl/mijnunive/schade - Video 2:
https://www.unive.nl/stad-en-land/ommen - Mijn univé, Facturen en betalen:
https://acc.unive.nl/mijnunive/facturen-en-betalen
Ondersteunende technieken
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.