Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website Donorwise

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Donorwise
Scope van de website Binnen de scope van het onderzoek valt:
  • Alle pagina's op donorwise.nl
Buiten de scope van het onderzoek valt:
  • Alle externe systemen en websites waar via donorwise.nl met een link naar wordt verwezen.
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
Conformiteitsdoel WCAG 2.1 niveau AA

Uitgebreide toetsresultaten

Aantal bevindingen: 28

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 homepage worden iconen gebruikt, zoals een hart, ziekenhuis en een tekstballon, tussen de teksten. Deze iconen worden door screenreaders voorgelezen. Het voorlezen van de iconen (bijvoorbeeld: “Wat weet jij over hartje organen of ziekenhuis doneren en wat is je spreekwolk mening hierover?”) is storend voor bezoekers die gebruik maken van voorleessoftware. Maak de iconen onzichtbaar voor hulpsoftware om dit probleem op te lossen.

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: Voldoende

Bevinding 2: Advies: Op de pagina donorwise.nl/module/stof-tot-nadenken-en-projecten-voor-… wordt een video getoond. Deze video heeft een automatisch gegenereerde ondertiteling. Op een aantal plekken staan onjuiste woorden, bijvoorbeeld vanaf 0:18 'en verstuurt u het in hun eigen envelop gratis naar het antwoordnummer tot op het formulier staat' of op 1:53 'of kijk op www.duo.nl'. Ook ontbreekt de interpunctie waardoor de zinnen moeilijk te begrijpen zijn. De video is omdat de video wordt geopend in Youtube en daardoor buiten de scope valt, maar het is aan te bevelen deze ondertiteling aan te passen.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 3: Op elke pagina staat boven in een uitklapbaar menu met 4 items en onderin de footer is een navigatie met 3 items. Dit zijn opsommingen. Deze zijn nu niet opgemaakt met de juiste code. Gebruik het ul- en li-element om opsommingen weer te geven.

Bevinding 4: Op onder andere pagina donorwise.nl/module/wat-weet-jij-over-organen staan teksten die visueel koppen zijn, maar dat in de code niet zijn, zoals 'Test je kennis over organen' en 'Wat weet jij over doneren'. Bezoekers die gebruik maken van hulpsoftware zoals een screenreader, kunnen aan de hand van een sneltoets of een kop-elementenlijst over een pagina navigeren. Teksten die er visueel wel uit zien als een kop, maar dat semantisch niet zijn, komen daar niet op voor. Gebruik kop-elementen om dit probleem op te lossen.

Bevinding 5: De tekst die aangeeft bij welke stap in het proces een bezoeker is op pagina donorwise.nl/quiz/de-organenquiz is opgemaakt met het strong-element. Het strong-element geeft aan dat een woord of zin extra belangrijk is. Het mag daarom niet puur voor opmaak gebruikt worden. Gebruik CSS of een vergelijkbare techniek om eenzelfde effect te creëren zonder gebruik te maken van de semantische waarde van het strong-element.

Bevinding 6: De PDF "DonorWise-gesprek" is niet gecodeerd (van tags voorzien). Dit betekent dat er de documentstructuur niet is te bepalen. Er kan daardoor bijvoorbeeld niet worden bepaald wat koppen zijn, de alternatieve tekst bij afbeeldingen en wat de leesvolgorde is. Omdat tags ontbreken kan de PDF niet volledig onderzocht worden (alle succescriterium met betrekking tot de PDF code laag zoals semantische koppen en alt teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan. Hetzelfde geldt voor meer PDF's op de website, zo als de PDF "donorformulier".

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 7: Het contrast van de witte tekst "Doe de quiz" op de blauwe achtergrond (HEX #3C89FF) op pagina pagina donorwise.nl/module/wat-weet-jij-over-organen is te laag. De contrastverhouding is hier 3,4:1, waar dit minimaal 4,5:1 moet zijn. Hetzelfde komt vaker in de website voor, bijvoorbeeld de blauwe op witte tekst "Klopt" op pagina donorwise.nl/quiz/de-organenquiz.

Bevinding 8: Het contrast van de paarse tekst (HEX #8658FF) "Eens" op de witte achtergrond op pagina pagina donorwise.nl/quiz/wat-vind-jij is te laag. De contrastverhouding is hier 4,3:1, waar dit minimaal 4,5:1 moet zijn.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Uitkomst: Onvoldoende

Bevinding 9: Wanneer bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% dan verdwijnt op de home pagina donorwise.nl/ de hamburgermenu knop. Daar kun je dan ook niet meer bijkomen.
Daarnaast moeten bezoekers horizontaal scrollen om alle tekst te kunnen lezen en zijn teksten niet meer helemaal goed leesbaar doordat iconen over de tekst schuiven, zoals bij 'Nodig een spreker uit in de klas'.

Bevinding 10: Op quizpagina's zoals pagina donorwise.nl/quiz/de-organenquiz kunnen bezoekers niet inzoomen zonder informatieverlies, omdat knoppen en tekstvelden door elkaar heen schuiven.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 11: Als op de voorpagina donorwise.nl/ een blok focus krijgt, bijvoorbeeld het blok "Wat weet jij over organen" dan is dat in Chrome en Edge zichtbaar door een zwart/witte rand rond het blok. De zwarte rand grenst aan het donkerblauwe blok (HEX #170F3D) en de witte rand grenst aan de gele achtergrond (HEX #FFCB00). Het contrast tussen rand en blok is 1,2:1 en 1,5:1 waar dat minimaal 3:1 moet zijn. In Firefox is de 1-pixel stippellijn wit op geel nog minder goed te zien. Zorg voor een duidelijker onderscheid tussen focus en geen focus om dit probleem op te lossen. Hetzelfde probleem komt op meerdere plaatsen in de website voor. Bijvoorbeeld de blauwe focusrand op blauwe achtergrond rond de antwoorden op pagina donorwise.nl/quiz/de-organenquiz.

1.4.12 Tekstafstand (Niveau AA)

Informatie over succescriterium 1.4.12 Tekstafstand

Uitkomst: Onvoldoende

Bevinding 12: Wanneer op de homepage bij een schermgrootte van 1280x1024px ingezoomd wordt tot 400% en de tekstafstand wordt gewijzigd naar de waarden behorende bij dit succescriterium, is de tekst 'Een roker zou geen donorlong mogen krijgen' niet meer goed leesbaar omdat de knoppen 'Ja' en 'Nee' over de tekst heen schuiven.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Uitkomst: Onvoldoende

Bevinding 13: Op onder andere donorwise.nl/module/wat-weet-jij-over-organen staan uitklapbare knoppen in tekstballonnen, waarmee de antwoorden in- en uitgeklapt kunnen worden. Deze knoppen zijn niet bereikbaar en bedienbaar met het toetsenbord.

Bevinding 14: Wanneer het spelletje onder het blok 'Weet jij hoe het zit' op pagina donorwise.nl/module/hoe-denk-jij-er-eigenlijk-over focus heeft, verschijnt de tekst "Sorry, dit spelletje is niet met het toetsenbord te bedienen." Hierdoor worden personen die afhankelijk zijn van het toetsenbord buitengesloten van het bedienen van dit spel.

2.2 Genoeg tijd

2.2.2 Pauzeren, stoppen, verbergen (Niveau A)

Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen

Uitkomst: Onvoldoende

Bevinding 15: Op de voorpagina donorwise.nl/ is bewegend beeld aanwezig. Cirkels worden groter en kleiner en pijlen en de tekst "Aan de slag" bewegen door het beeld. Er is een knop "Stop bewegend beeld" maar die is rechts onder in beeld en krijgt als laatste focus. Zet deze knop boven aan de pagina.

2.4.1 Blokken omzeilen (Niveau A)

Informatie over succescriterium 2.4.1 Blokken omzeilen

Uitkomst: Onvoldoende

Bevinding 16: Elke pagina bevat wel een skiplink (een mechanisme om naar een ander deel van de pagina te springen) die als eerste focus krijgt, maar de link werkt niet goed, de focus komt nog steeds op de terugkerende elementen boven in de pagina. Zorg dat bezoekers direct naar de hoofdinhoud van een pagina kunnen springen.

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 17: De PDF "Donorwise gesprek" heeft als titel in de eigenschappen "2020045_Donorwise_gesprek.indd". Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond.

Bevinding 18: Advies: De titel van pagina donorwise.nl/quiz/de-organenquiz bevat een typefout. Er staat 'De oranenquiz!' maar dit moet 'De organenquiz!' zijn.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 19: Op elke pagina staat rechts boven een menuknop waarmee een balk met 4 menu items open gevouwen kan worden. Als het menu geopend is verwacht je naar het eerste menu item te gaan, maar de focus gaat verder op de rest van de pagina. De menu-items krijgen pas focus nadat een bezoeker weer bovenaan de pagina focus heeft.

Bevinding 20: Op de pagina donorwise.nl/module/wat-weet-jij-over-doneren staat een spelletje: zet de stappen op de juiste plek. Als met het toetsenbord genavigeerd wordt verschijnt er over het spelletje de tekst "Sorry, dit spelletje is niet met het toetsenbord te bedienen." Maar de knop "Checken" die bij het spelletje hoort krijgt wel focus. Geef elementen die niet met het toetsenbord bediend kunnen worden geen focus.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 21: Op de voorpagina donorwise.nl/quiz/de-organenquiz staat twee keer de link met de tekst "Doe de quiz" in de naam naar twee verschillende pagina's. Dit is verwarrend voor screenreadergebruikers. Geef ook aan naar welke quiz de link gaat.

Bevinding 22: In het hoofdmenu boven aan elke pagina staat de link "Projecten" die naar een pagina met de titel "Stof tot nadenken" gaat. Het linkdoel is hierdoor niet duidelijk. Pas de naam in het menu aan of de naam (en titel) van de pagina zodat de naam in het navigatiemenu en het linkdoel overeenkomen.

2.4.5 Meerdere manieren (Niveau AA)

Informatie over succescriterium 2.4.5 Meerdere manieren

Uitkomst: Onvoldoende

Bevinding 23: Er is geen zoekfunctie en er is geen link in de website naar een Sitemap. Veel pagina's kunnen op meerdere manieren bereikt worden, maar de pagina's "Over DonorWise" "Contact" en "Privacy & cookies" zijn alleen via de links onderin elke pagina te bereiken.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 24: Wanneer de "Voor leraren" toggle knop op de homepagina donorwise.nl/ focus heeft, is dat niet zichtbaar. Zorg ervoor dat bezoekers die met het toetsenbord navigeren weten welk interactief element focus heeft door een duidelijke focusrand toe te voegen. Hetzelfde komt op meer plaatsen in de website voor, bijvoorbeeld bij de video op pagina donorwise.nl/module/wat-weet-jij-over-organen.
Dit geldt ook voor de knop 'Stop bewegend beeld'.

Bevinding 25: Wanneer het blok 'Ben je het eens of oneens over deze stellingen?' op pagina donorwise.nl/module/hoe-denk-jij-er-eigenlijk-over focus heeft is dat niet zichtbaar omdat de focusrand onder omliggende contentblokken verdwijnt. Bij de andere blokken is de focus vermindert zichtbaar omdat de blokken deels overlappen. In de WCAG 2.2 worden de eisen omtrent focus zichtbaarheid strenger, lees er meer over op: www.w3.org/WAI/WCAG22/Understanding/focus-appearance-….

3. Begrijpelijk

3.1 Leesbaar

3.1.1 Taal van de pagina (Niveau A)

Informatie over succescriterium 3.1.1 Taal van de pagina

Uitkomst: Onvoldoende

Bevinding 26: Op elke pagina is de taalaanduiding van de hele pagina Engels. De pagina is echter in het Nederlands. Zorg voor de juiste taalcodering in de HTML zodat bezoekers die gebruik maken van voorleessoftware de pagina in de juiste taal verstaanbaar voorgelezen krijgen.

4. Robuust

4.1 Compatibel

4.1.1 Parsen (Niveau A)

Informatie over succescriterium 4.1.1 Parsen

Uitkomst: Onvoldoende

Bevinding 27: Op de pagina donorwise.nl/module/wat-weet-jij-over-organen komen dubbele id's voor, namelijk id="entrance-big-arrow-oncioe37". Dit kan problemen opleveren met hulpsoftware. Zorg dat id's unieke waarden hebben op een pagina.

4.1.3 Statusberichten (Niveau AA)

Informatie over succescriterium 4.1.3 Statusberichten

Uitkomst: Onvoldoende

Bevinding 28: Op onder andere pagina donorwise.nl/quiz/de-organenquiz kunnen bezoekers antwoord geven op een vraag, waarna daaronder informatie verschijnt in nieuwe tekstberichten. Deze nieuwe berichten worden niet automatisch voorgelezen door voorleessoftware. Zorg ervoor dat de visuele verandering ook doorgegeven wordt aan screenreadergebruikers.

Onderbouwing van de evaluatie

Het onderzoek is uitgevoerd op basis van de evaluatiemethode van het W3C, WCAG-EM. Dit gebeurt grotendeels handmatig door een steekproef te nemen. Voor een quickscan geldt dat we slechts delen uit deze methodiek gebruiken. Ondanks alle zorgvuldigheid en ervaring van de onderzoeker kan het voorkomen dat een probleem niet gesignaleerd is. Houd er rekening mee dat in een volgend onderzoek bepaalde onderdelen anders worden beoordeeld omdat technologieën en hulpsoftware worden doorontwikkeld. Bij het handmatig onderzoek wordt gebruik gemaakt van tools.

Steekproef getoetste webpagina's

Ondersteunende technieken

Bronnen

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

Geprint: 2024-04-19 07:54:37 v2.3-011