Issues:
Content-audit digitale toegankelijkheid website Noracommunity Pleio
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Noracommunity Pleio |
---|---|
Datum | 11 juli 2024 |
Scope van de website |
Binnen de scope van het onderzoek valt: - De content van alle pagina's op noracommunity.pleio.nl Buiten 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 elke pagina is boven de header het logo te vinden, deze staat in een link naar de homepagina. De afbeelding met het logo is verborgen voor hulpsoftware door middel van een leeg alt-attribuut. Een logo brengt belangrijke informatie over, daarom heeft deze een alternatieve tekst nodig zodat deze informatie ook beschikbaar is voor bezoekers die niet kunnen zien. Vul een tekst in bij het alt-attribuut, die duidelijk maakt dat hier een logo staat en welke dat is, plus alle tekst die in het logo te zien is. Bijvoorbeeld 'Logo NORA, Nederlandse Overheid Referentie Architectuur'. Dit kan worden aangevuld met het linkdoel, bijvoorbeeld 'Homepagina'.
Bevinding 2: Op pagina https://noracommunity.pleio.nl/groups (als de bezoeker is ingelogd) is de groep '@TIOH' te zien. Als hierop geklikt wordt verschijnt een dialoogvenster waarop twee iconen te zien zijn. Deze hebben via een aria-label de alternatieve tekst 'Lid na goedkeuring' en 'Content alleen zichtbaar voor leden' gekregen. Omdat aan de iconen (svg) ook het aria-hidden="true" attribuut is toegevoegd, is deze informatie verborgen voor hulpsoftware. Verwijder het aria-hidden attribuut om dit op te lossen.
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 pagina https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november zijn onder de kop 'Programma' visueel subkoppen (bijvoorbeeld 'Ronde 1 13.00 - 14.00') in het programma te herkennen. Deze zijn opgemaakt met het strong-element. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader zijn deze teksten niet als koppen herkenbaar. Los dit op door de teksten als koppen op te maken, bijvoorbeeld op kopniveau h3. Een soortgelijk probleem komt voor bij de onderstreepte teksten zoals 'Informatieve sessie IAM', deze kunnen worden dan worden opgemaakt op kopniveau h4.
Bevinding 4: Op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek kan een bezoeker die is ingelogd zich 'Aanwezig', 'Misschien' of 'Afwezig' melden voor het evenement. Bij deze opties staan keuzerondjes die labels missen. Bezoekers die niet kunnen zien weten daardoor niet welk keuzerondje bij welke optie hoort, terwijl dit visueel wel af te leiden is. Los dit op door labels toe te voegen en deze programmatisch aan de keuzerondjes te koppelen.
Bevinding 5: Op pagina https://noracommunity.pleio.nl/search?q=agenda is als de bezoeker is ingelogd bij verschillende agenda-items het aantal aanwezigen te zien, zoals bij 'NORA Gebruikersweek' waar drie profielfoto's staan met daarachter '+98'. Voor bezoekers die niet kunnen zien, is het lastig om af te leiden dat het hier om het aantal aanwezigen gaat. Visueel is dit af te leiden doordat er drie profielfoto's bij het cijfer staan, maar deze profielfoto's zijn voor hulpsoftware verborgen. Los dit bijvoorbeeld op door een label zoals 'Aantal aanwezigen' toe te voegen voor hulpsoftware, dit hoeft niet op de pagina zichtbaar te zijn.
Bevinding 6: Advies: Op verschillende pagina's wordt niet op de juiste manier gebruik gemaakt van een koppenstructuur. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is een koppenstructuur belangrijk, omdat een lijst van koppen opgevraagd kan worden en op die manier genavigeerd kan worden. Het wordt niet op toegankelijkheid afgekeurd als de koppenstructuur niet goed is opgebouwd, maar het verbeteren hiervan zorgt dat de structuur van de content beter geïnterpreteerd kan worden. Zorg voor een goede koppenstructuur, die begint bij een kopniveau h1 voor de belangrijkste kop (titel van de pagina), kopniveau h2 voor de koppen, kopniveau h3 voor de tussenkoppen, etcetera. Zorg dat kopniveau h1 éénmalig voorkomt en sla geen koppen over.
Een aantal voorbeelden van een onjuiste koppenstructuur zijn:
- Op pagina https://noracommunity.pleio.nl/ komen twee koppen op kopniveau h1 voor, 'Home' en 'Nieuwsberichten NORAonline.nl'. Gebruik voor deze laatste bijvoorbeeld h2. Ook op pagina https://noracommunity.pleio.nl/groups/view/785ebb93-a0b6-487f-b763-efce6ad470d9/basisconcept-van-dienstverlening staan twee h1-koppen.
- Op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek is de kop '5 reacties' opgemaakt op kopniveau h4, waarbij kopniveau h2 en h3 zijn overgeslagen. Op pagina https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november is kopniveau h3 overgeslagen.
1.4 Onderscheidbaar
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 7: Op de homepagina https://noracommunity.pleio.nl/ hebben de titels van de nieuwsberichten onder de kop 'Nieuwsberichten NORAonline.nl' een blauw (HEX #2E7EC8) lettertype. Het contrast met de witte achtergrond is onvoldoende. De contrastverhouding is 4,2:1 waar deze minimaal 4,5:1 moet zijn.
Bevinding 8: Advies: Op meerdere pagina's komen enkele woorden voor in zwart lettertype, met een transparantie van 0.55. Door deze transparantie voldoen in de browser Chrome enkele pixels van deze letters net aan de eisen voor contrast en in Firefox iets meer pixels, en wordt dit niet afgekeurd op toegankelijkheid. Toch kan de tekst voor bezoekers met een gezichtsbeperking onvoldoende leesbaar zijn. Het advies is om minder transparantie toe te passen zodat de contrastverhouding in alle browsers voor de hele letters minimaal 4,5:1 is. Voorbeelden waar zich dit voordoet:
- Op pagina https://noracommunity.pleio.nl/groups/view/785ebb93-a0b6-487f-b763-efce6ad470d9/basisconcept-van-dienstverlening en https://noracommunity.pleio.nl/news bij de tekst 'Probeer andere filters in te stellen'.
- Op pagina https://noracommunity.pleio.nl/events/ (als Afgelopen events zijn geselecteerd) bij de maanden die in de datum te zien zijn, en bij bijvoorbeeld '5 reacties'. Ook bij het label 'Sortering'.
- Op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek onder andere bij de teksten 'Om je aan te melden' en 'Om te reageren' en de data die bij de reacties staan.
2. Bedienbaar
2.2 Genoeg tijd
2.2.2 Pauzeren, stoppen, verbergen (Niveau A)
Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen
Uitkomst: Onvoldoende
Bevinding 9: Op de homepagina https://noracommunity.pleio.nl/ is een iframe te vinden met daarin de kop 'Nieuwsberichten NORAonline.nl'. Onder deze kop staan nieuwsberichten, deze bewegen naar boven. Het is niet mogelijk om deze beweging te pauzeren, stoppen of verbergen. Voor sommige bezoekers kan het lastig zijn om stilstaande tekst te lezen als hiernaast bewegend beeld aanwezig is. Ook kan voor sommige bezoekers bewegend beeld misselijkheid veroorzaken. Zorg ervoor dat bezoekers de bewegende nieuwsberichten kunnen stoppen of pauzeren, of verwijder de beweging.
2.4 Navigeerbaar
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 10: Op pagina https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november staat onder de kop '0 reacties' een link waarop visueel de tekst 'Log in' te lezen is (als de bezoeker niet is ingelogd). Via een aria-label heeft deze link de toegankelijke naam 'Reageer op item 'NORA Gebruikersdag 29 november' gekregen. Dit aria-label overschrijft de tekst die in een div-element in het a-element is geplaatst ('Log in'). Bezoekers die gebruik maken van hulpsoftware zoals een screenreader weten hierdoor niet dat zij via deze link op de inlogpagina terecht komen. Los dit bijvoorbeeld op door het aria-label te verwijderen. Een soortgelijk probleem doet zich voor op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek bij de link 'Log in' onder de kop '5 reacties'. Ook op pagina https://noracommunity.pleio.nl/events/ komt dit voor, bij de link 'Log in' bij de (afgelopen) agenda-items. Zie ook succerium 2.5.3.
2.5 Input modaliteiten
2.5.3 Label in naam (Niveau A)
Informatie over succescriterium 2.5.3 Label in naam
Uitkomst: Onvoldoende
Bevinding 11: Op pagina https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november staat onder de kop '0 reacties' een link waarop visueel de tekst 'Log in' te lezen is (als de bezoeker niet is ingelogd). Via een aria-label heeft deze link de naam 'Reageer op item 'NORA Gebruikersdag 29 november' gekregen. Doordat deze naam niet overeenkomt met de tekst die op de pagina te zien is, is het voor bezoekers die gebruik maken van spraakgestuurde navigatie lastig om de link aan te spreken en te bedienen. Los dit op door de visueel zichtbare tekst terug te laten komen in de toegankelijke naam, het liefst vooraan. Een soortgelijk probleem doet zich voor op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek onder de kop '5 reacties'. Zie ook succerium 2.4.4.
Bevinding 12: Op pagina https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november is als de bezoeker is ingelogd een knop te vinden waarop de tekst 'Schrijf een reactie' te zien is. De knop heeft via een aria-label de toegankelijke naam 'Reageer op item 'NORA Gebruikersdag 29 november' gekregen. Dit komt niet overeen met de tekst die zichtbaar is op de pagina, waardoor bezoekers die gebruik maken van spraakgestuurde navigatie de knop lastig kunnen bedienen. Zorg dat de zichtbare tekst terug komt in de toegankelijke naam, het liefst vooraan. Een soortgelijk probleem doet zich voor op pagina https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek onder de kop '5 reacties'.
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 13: Op de homepagina https://noracommunity.pleio.nl/ is een iframe te vinden met daarin de kop 'Nieuwsberichten NORAonline.nl'. De taal in dit iframe is ingesteld op Engels, lang="en". Hierdoor kan hulpsoftware zoals een screenreader de Nederlandstalige tekst niet met de juiste uitspraak voorlezen. Los dit op door de taalcode aan te passen naar lang="nl".
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://noracommunity.pleio.nl/ - Contact:
https://noracommunity.pleio.nl/page/view/88bd7cdc-447d-43b5-b8ee-ca2ab30600fa/contact - Groepen:
https://noracommunity.pleio.nl/groups - Groep Basisconcept van Dienstverlening:
https://noracommunity.pleio.nl/groups/view/785ebb93-a0b6-487f-b763-efce6ad470d9/basisconcept-van-dienstverlening - Nieuws:
https://noracommunity.pleio.nl/news - Evenementen:
https://noracommunity.pleio.nl/events/ - Evenement NORA Gebruikersweek:
https://noracommunity.pleio.nl/events/view/2c45455d-65ca-47a5-86d6-b51a6943bbf0/nora-gebruikersweek - Profiel:
https://noracommunity.pleio.nl/user/ec731738-2349-489c-9e78-a444241e72d3/profile - Zoekresultaten:
https://noracommunity.pleio.nl/search?q=agenda - Pagina niet beschikbaar:
https://noracommunity.pleio.nl/404 - Evenement NORA Gebruikersdag 29 nov:
https://noracommunity.pleio.nl/events/view/2638e2e6-96ef-4857-96db-cf118360572a/nora-gebruikersdag-29-november
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.