Rapportversie 1.0 - 11 februari 2021 WCAG 2.1 onderzoek http://www.rhenen.nl Niveau AA Expertisecentrum voor toegankelijke ICT Inhoudsopgave Inleiding Onderzoeksresultaat Principe 1 Waarneembaar Richtlijn 1.1 Tekstalternatieven Richtlijn 1.2 Op tijd gebaseerde media Richtlijn 1.3 Aanpasbaar Richtlijn 1.4 Onderscheidbaar Principe 2 Bedienbaar Richtlijn 2.1 Toetsenbordtoegankelijke Richtlijn 2.2 Genoeg tijd Richtlijn 2.3 Toevallen Richtlijn 2.4 Navigeerbaar Richtlijn 2.5 Inputmodaliteiten Principe 3 Begrijpelijk Richtlijn 3.1 Leesbaar Richtlijn 3.2 Voorspelbaar Richtlijn 3.3 Assistentie bij invoer Principe 4 Robuust Richtlijn 4.1 Compatibel Onderzoeksgegevens Opdrachtgever Type onderzoek Onderzoeksdatum 3 4 5 5 6 11 19 35 35 37 40 40 49 55 55 57 60 64 64 70 70 70 70 Toegepaste norm Evaluatiemethode Scope van het onderzoek Steekproef Gebruikte technieken Basisniveau van toegankelijkheidsondersteuning User Agents Afhankelijke technologie 70 70 70 71 72 72 72 72 3 Inleiding Het toegankelijkheidsonderzoek naar http://www.rhenen.nl is afgerond op 11 februari 2021. Dit onderzoek laat zien in hoeverre deze op dit moment voldoet aan de internationaal geaccepteerde toegankelijkheidsrichtlijnen (WCAG 2.1). Een terugkoppeling van de hoofdzaken uit het onderzoek en de mogelijke vervolgstappen op basis hiervan staan in de managementsamenvatting. WCAG staat voor Web Content Accessibility Guidelines. Dit zijn de internationale richtlijnen voor toegankelijkheid van webcontent. De richtlijnen zijn opgedeeld in vier principes (Waarneembaar, Bedienbaar, Begrijpelijk en Robuust). Elke richtlijn is vervolgens opgedeeld in meetbare succescriteria. Omdat WCAG techniek- onafhankelijk is opgesteld, kan hiermee de toegankelijkheid van alle content op het web worden onderzocht. De beschrijving van de succescriteria zijn in dit rapport ingekort. Volledige beschrijvingen zijn te vinden in de WCAG documentatie. In het rapport geven we tevens bij ieder succescriterium een algemene toelichting. Hoewel de WCAG norm duidelijk genoeg is om onderzoeken goed te kunnen uitvoeren, kan de beoordeling van succescriteria op detailniveau de komende tijd veranderen. Zo is het mogelijk dat door voortschrijdend inzicht iets dat nu is afgekeurd, bij een volgend onderzoek wordt goedgekeurd en vice versa. In dit rapport worden slechts voorbeelden gegeven van aangetroffen problemen; dit is echter geen compleet overzicht. Omdat het onderzoek uit een steekproef bestaat, kan het zijn dat een probleem niet gesignaleerd wordt. Het kan dan wel bij een volgend onderzoek worden opgemerkt. Wanneer verbeteringen worden doorgevoerd, dient er rekening gehouden te worden dat hierdoor nieuwe toegankelijkheidsproblemen kunnen ontstaan. Zijn er naar aanleiding van dit rapport inhoudelijke vragen, dan kan er met ons contact worden opgenomen via toetsing@accessibility.nl of 030 - 239 82 70. Voor (structurele) ondersteuning bij het toegankelijk maken van de digitale dienstverlening, kan er met onze servicedesk contact worden opgenomen via service@accessibility.nl of 030 - 239 82 70. 4 Onderzoeksresultaat De onderstaande tabel geeft een overzicht van het aantal succescriteria waar op dit moment aan wordt voldaan: 32 van de 50 succescriteria zijn als voldoende beoordeeld. Op de volgende pagina's worden de gevonden bevindingen per succescriterium toegelicht. Niveau A Niveau AA Totaal Waarneembaar 5 / 9 6 / 11 11 / 20 Bedienbaar 10 / 14 2 / 3 12 / 17 Begrijpelijk 5 / 5 4 / 5 9 / 10 Robuust 0 / 2 0 / 1 0 / 3 Totaal 20 / 30 12 / 20 32 / 50 5 PRINCIPE 1 Waarneembaar Informatie en componenten van de gebruikersinterface moeten toonbaar zijn aan gebruikers op voor hen waarneembare wijze RICHTLIJN 1.1 Tekstalternatieven Lever tekstalternatieven voor alle niet-tekstuele content, zodat die veranderd kan worden in andere vormen die mensen nodig hebben, zoals grote letters, braille, spraak, symbolen of eenvoudiger taal. SUCCESCRITERIUM 1.1.1 (NIVEAU A) Niet-tekstuele content Alle niet-tekstuele content die aan de gebruiker wordt gepresenteerd, heeft een tekstalternatief dat een gelijkwaardig doel dient, behalve voor de hierna vermelde situaties. De onderzochte set webpagina's voldoet niet aan dit succescriterium. Op pagina https://rhenen.raadsinformatie.nl/ staat een foto van een voorzittershamer. Deze foto heeft in de HTML broncode geen alt attribuut gekregen. Het alt attribuut is een verplicht attribuut. Als de afbeelding, zoals in dit geval, decoratief is, maar deze wel leeg gelaten worden. Er staat dan alt="" in de HTML code. In onderstaand PDF document staat op de eerste pagina het logo van de gemeente Rhenen. De alternatieve tekst voor deze afbeelding luidt nu "\\rhn-fs01.rhn.avallei.nl\HomeFolders \VORWD\Pictures\Gemeente algemeen\Logo Rhenen groot.gif". Dit is het hele padnaam en bestandsnaam van het logo. Dit is geen goede alternatieve tekst. Beter is alleen "Logo gemeente 6 De onderzochte set webpagina's voldoet niet aan dit succescriterium. Rhenen". Zie: https://www.rhenen.nl/mozard/document/docnr/1746742/ Privacyverklaring%20Gemeente%20Rhenen Bovenstaand probleem met het logo doet zich ook voor in onderstaand PDF document. Zie: https://www.rhenen.nl/mozard/ document/docnr/1746747/Uw%20rechten%20ten%20aanzien %20van%20uw%20persoonsgegevens Uitleg van dit successcriterium Alle belangrijke niet-tekstuele content zoals afbeeldingen, knoppen en formulier invoervelden, moeten een tekstueel alternatief of naam hebben. Dan kan de voorleessoftware van blinde bezoekers die informatie namelijk voorlezen. Voor sommige niet-tekstuele content, zoals video en audio, zijn aparte succescriteria (1.2.1 tot en met 1.2.5). Voor succescriterium 1.1.1 hoeft daarom alleen een beschrijvende naam boven die content geboden te worden. Voor informatie over CAPTCHA, zie het desbetreffende artikel op onze website: www.accessibility.nl/kennisbank/artikelen/captcha RICHTLIJN 1.2 Op tijd gebaseerde media Lever alternatieven voor op tijd gebaseerde media. SUCCESCRITERIUM 1.2.1 (NIVEAU A) 7 Louter-geluid en louter-videobeeld (vooraf opgenomen) 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: De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. Uitleg van dit successcriterium Dit succescriterium heeft betrekking op alles wat alleen geluid is (dus zonder beeld) of alleen videobeeld (dus zonder geluid). Hiervoor dient een volledig uitgeschreven tekst te worden geboden, zodat dezelfde informatie ook voor dove en blinde bezoekers beschikbaar is. Bij alleen videobeeld mag ook een geluidspoor worden geboden, waarmee alle visuele informatie aan blinde bezoekers wordt voorgelezen. Zie voor meer informatie ons artikel over online video op: www.accessibility.nl/kennisbank/videotutorial SUCCESCRITERIUM 1.2.2 (NIVEAU A) Ondertiteling voor doven en slechthorenden (vooraf opgenomen) Er worden ondertitels voor doven en slechthorenden geleverd voor alle vooraf opgenomen audiocontent in gesynchroniseerde media, behalve als het mediabestand een media-alternatief is voor tekst en duidelijk als zodanig is gelabeld. 8 De onderzochte set webpagina's voldoet niet aan dit succescriterium. Op pagina https://rhenen.raadsinformatie.nl/vergadering/768674/ Raadsvergadering%2002-02-2021? staat een video. Voor deze video is geen ondertiteling aanwezig voor mensen die doof of slechthorend zijn. Uitleg van dit successcriterium Voor alle gesproken tekst en andere belangrijke geluiden in een video dient ondertiteling geboden te worden. Op die manier is de informatie ook beschikbaar is voor bezoekers die doof of slechthorend zijn. Er is een uitzondering, waarbij geen ondertiteling geboden hoeft te worden: als concreet is aangegeven dat de video een media-alternatief is voor de tekst op de pagina én de video ook niet meer informatie geeft dan die tekst. Zie voor meer informatie ons artikel over online video op: www.accessibility.nl/kennisbank/videotutorial SUCCESCRITERIUM 1.2.3 (NIVEAU A) Audiodescriptie of media-alternatief (vooraf opgenomen) Er wordt een alternatief voor op tijd gebaseerde media of audiodescriptie van de vooraf opgenomen videocontent geleverd voor gesynchroniseerde media, behalve als het mediabestand een media-alternatief is voor tekst en duidelijk als zodanig is gelabeld. 9 De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. Uitleg van dit successcriterium Audiodescriptie is gesproken tekst die is toegevoegd aan het standaard audiospoor om belangrijke visuele details te beschrijven, die niet vanuit het standaard audiospoor alleen te begrijpen zijn. Vaak kan audiodescriptie in een videospeler aan of uit worden gezet. De audiodescriptie is belangrijk voor blinde bezoekers, die niet kunnen zien wat in beeld gebeurt/verschijnt. Voor succescriterium 1.2.3 (niveau A) zijn twee uitzonderingen, waarbij geen audiodescriptie nodig is: 1. Er wordt een uitgeschreven transcript geboden. Dit transcript dient alle informatie in de video (dus beeld en geluid) in de juiste volgorde bevatten. 2. Als concreet is aangegeven dat de video een media- alternatief is voor de tekst op de pagina én de video ook niet meer informatie geeft dan die tekst. LET OP: bovenstaande uitzonderingen gelden niet voor succescriterium 1.2.5 (niveau AA). Zie voor meer informatie ons artikel over online video op: www.accessibility.nl/kennisbank/videotutorial SUCCESCRITERIUM 1.2.4 (NIVEAU AA) 10 Ondertitels voor doven en slechthorenden (live) Er worden ondertitels voor doven en slechthorenden geleverd voor alle live audiocontent in gesynchroniseerde media. De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. Uitleg van dit successcriterium Voor alle gesproken tekst en andere belangrijke geluiden in een live video dient ondertiteling geboden te worden. Het doel van dit succescriterium is om mensen die doof of slechthorend zijn in staat te stellen live video's te bekijken. SUCCESCRITERIUM 1.2.5 (NIVEAU AA) Audiodescriptie (vooraf opgenomen) Er wordt een audiodescriptie geleverd voor alle vooraf opgenomen videocontent in gesynchroniseerde media. De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. 11 Uitleg van dit successcriterium Audiodescriptie is gesproken tekst die is toegevoegd aan het standaard audiospoor om belangrijke visuele details te beschrijven, die niet vanuit het standaard audiospoor alleen te begrijpen zijn. Vaak kan audiodescriptie in een videospeler aan of uit worden gezet. De audiodescriptie is belangrijk voor blinde bezoekers, die niet kunnen zien wat in beeld gebeurt/verschijnt. In tegenstelling tot succescriterium 1.2.3 (niveau A), is er voor succescriterium 1.2.5 (niveau AA) geen uitzondering mogelijk en dient altijd audiodescriptie geboden te worden (indien nodig). Zie voor meer informatie ons artikel over online video op: www.accessibility.nl/kennisbank/videotutorial RICHTLIJN 1.3 Aanpasbaar Creëer content die op verschillende manieren gepresenteerd kan worden (bijvoorbeeld eenvoudiger lay-out) zonder verlies van informatie of structuur. SUCCESCRITERIUM 1.3.1 (NIVEAU A) Info en relaties Informatie, structuur, en relaties overgebracht door presentatie kunnen door software bepaald worden of zijn beschikbaar in tekst. 12 De onderzochte set webpagina's voldoet niet aan dit succescriterium. Op pagina https://www.rhenen.nl/mozard/!suite86.scherm0325? mPag=263 (en ook op andere pagina's) wordt het strong element gebruikt om tekst vetgedrukt weer te geven of op kopteksten mee op te maken. Beide zijn niet de bedoeling. Gebruik CSS voor het vetgedrukt weergeven en gerbuik header elementen (h1, h2, enz.) om kopteksten mee op te maken. Gebruik een strong element alleen als er sterke nadruk nodig is op een (korte) tekst. Dit zijn vaak enkele woorden. Bijvoorbeeld "Let op!". Deze tekst wordt dan ook door voorleessoftware met extra nadruk voorgelezen. Op deze pagina wordt het strong element bijvoorbeeld verkeerd gebruikt voor de hele vetgedrukte aline bovenaan de content. En ook voor de kopteksten "Spoedaanvraag", "Meer producten", enz. Bovenstaande komt ook voor op pagina https://www.rhenen.nl/ mozard/!suite86.scherm0325?mVrg=8861, zie de teksten "Bibliotheek Rhenen" en "Bibliotheek Elst". Bovenstaande komt ook voor op de pagina https:// www.rhenen.nl/mozard/!suite86.scherm0325?mVrg=9681 met de teksten "Wat kunt u van ons verwachten?" en "Handhavingsprocedure'. Bovenstaande komt ook voor op de pagina https:// www.rhenen.nl/mozard/!suite86.scherm0325?mVrg=7786. Hier zijn veel koptekst met een strong element opgemaakt in plaats van met header elementen. Bovenstaand problemen komt op veel meer pagina's voor. Op pagina https://www.rhenen.nl/mozard/!suite86.scherm0325? mPag=281&mVrg=1041 staat bovenaan een zin "Hier staat hoe u contact met ons op kunt nemen". Deze is opgemaakt met een em element, maar er is tekstueel/structureel/semantisch geen 13 De onderzochte set webpagina's voldoet niet aan dit succescriterium. noodzaak voor nadruk. Als tekst visueel moet opvallen kan beter CSS gebruikt worden. Het em element is bedoeld voor (semantische) nadruk en niet om visueel iets op te laten vallen. Dit wordt vaak inline gebruikt om iets nadruk te geven ten opzichte van omliggende tekst. En daar is hier ook geen sprake van. Dit komt op meer pagina's voor. Op pagina https://www.rhenen.nl/mozard/!suite86.scherm0325? mVrg=1441 staat onder de koptekst "Snoeihout of snoeiafval" en ongeordende lijst. Deze is niet met ul en li elementen opgemaakt. En ook hier wordt een em element verkeerd gebruikt voor de opmaak van de hele eerste alinea. Ook op pagina https://www.rhenen.nl/mozard/! suite86.scherm0325?mVrg=7062 staat een ongeordende lijst die niet als zodanig is opgemaakt met ul en li elementen. Dit probleem komt op meer pagina's voor. Ook op pagina https://www.rhenen.nl/mozard/! suite86.scherm0325?mVrg=9681 staat een ongeordende lijst die niet als zodanig is opgemaakt met ul en li elementen. Dit probleem komt op meer pagina's voor. Op pagina https://rhenen.raadsinformatie.nl/ kan een keuze gemaakt worden tussen "kalender" en "Lijst". Visueel is aangegeven welke van de twee 'actief' is. Dit is door hulpsoftware niet te bepalen. Bij de keuze tussen "Week" en "Maand" is dit wel duidelijk door middel van een aria-label bij de 'actieve' link. Er zit echter nog wel een probleem in de tekst van dit aria-label. Zie succescriterium 2.5.3. 14 De onderzochte set webpagina's voldoet niet aan dit succescriterium. Op pagina https://rhenen.raadsinformatie.nl/ is de kalender visueel een soort tabel met kolomkoppen en rijkoppen (weeknummers). Maar de kalender is niet opgemaakt als tabel in de code, waardoor de dagen van de week (ma tot en met zo) en de weeknummers geen relatie hebben met de datums. Er is ook een optie om een lijst te tonen. Dit kan als alternatief dienen voor de kalender. Het wordt aangeraden om beide opties toegankelijk te maken, maar in ieder geval één variant moet helemaal toegankelijk zijn. De lijst moet dan dezelfde informatie en functionaliteit als de kalender bevatten. Dat is nu niet helemaal het geval. In de kalender is het mogelijk om via selectievensters bijvoorbeeld snel naar maart 2017 te gaan. In de lijst kan dit alleen door de knoppen te gebruiken om naar de vorige en volgende maand te gaan. In onderstaand PDF document staat op de eerste pagina een koptekst "Privacyverklaring gemeente Rhenen". Deze is nu getagd als een alinea, maar kan beter met een h1 getagd worden. Zie: https://www.rhenen.nl/mozard/document/docnr/1746742/ Privacyverklaring%20Gemeente%20Rhenen Bovenstaand probleem met de titel op de eerste pagina doet zich ook voor in onderstaand PDF document. Daarnaast is de koptekst "Hoe doe ik een rechtenverzoek" nu getagd als h2, maar kijkend naar de structuur is het logischer als dit een h1 is. De subkoppen hiervan zijn namelijk ook h2 en dat kan niet hetzelfde zijn als de hoofdkop; het moet een niveau lager zijn. Zie: https:// www.rhenen.nl/mozard/document/docnr/1746747/Uw %20rechten%20ten%20aanzien%20van%20uw %20persoonsgegevens 15 Uitleg van dit successcriterium Alle informatie die visueel wordt overgedragen, dient ook tekstueel of semantisch (in betekenisvolle code) te worden overgedragen. Op deze manier kan de informatie ook aan blinde bezoekers worden voorgelezen. Let in het bijzonder op het volgende: Gebruik correcte lijstopmaak, namelijk

elementen. Gebruik

en

voor definitielijsten. Maak alle koppen correct op, namelijk met

tot en met

elementen. Gebruik voor de kop van een tabel en voor de kop van een groep (
) formuliervelden. Gebruik voor datatabellen. Maak rij- en kolomkoppen op met
en datacellen met . Voeg zo nodig het attribuut scope of de attributen id en headers toe om associaties te maken. Zeer eenvoudige datatabellen van 2 kolommen, zonder kolomkoppen hebben geen rijkoppen nodig. Bied namen aan invoervelden en groepeer bij elkaar horende velden. Zie voor meer informatie ons artikel: www.accessibility.nl/ kennisbank/artikelen/toegankelijke-formulieren-in- webrichtlijnen-2 SUCCESCRITERIUM 1.3.2 (NIVEAU A) Betekenisvolle volgorde Als de volgorde waarin content wordt gepresenteerd van invloed is op zijn betekenis, kan een betekenisvolle leesvolgorde door software bepaald worden. 16 De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. Uitleg van dit successcriterium Content dient in een betekenisvolle volgorde in de broncode te staan. De voorleessoftware van blinde bezoekers kan de informatie dan correct voorlezen. Een voorbeeld waarbij dit verkeerd gaat: wanneer op een vraagteken-icoon wordt geklikt, verschijnt visueel naast het icoon een uitleg. Deze informatie staat in de broncode echter onderaan de pagina en niet direct onder het icoon. Hierdoor kan de informatie niet direct worden voorgelezen aan blinde bezoekers. Voor HTML-pagina's is de leesvolgorde te testen door de website zonder stylesheets te bekijken. In Firefox kan dit door in het menu te gaan naar: Beeld - Paginastijl - Geen Stijl. SUCCESCRITERIUM 1.3.3 (NIVEAU A) Zintuiglijke eigenschappen Instructies die geleverd worden om content te begrijpen en te bedienen zijn niet alleen afhankelijk van zintuiglijke eigenschappen van componenten zoals vorm, omvang, visuele locatie, oriëntatie of geluid. De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. 17 Uitleg van dit successcriterium Instructies mogen niet alleen afhankelijk zijn van vorm, omvang, locatie, oriëntatie of geluid. Meer toelichting: Vorm: Denk aan bijvoorbeeld een legenda: informatie door stippellijnen, driehoeken etc. dient ook tekstueel overgebracht te worden. Omvang: Bijvoorbeeld: hoe groter een zoekwoord getoond wordt, hoe meer resultaten er voor zijn. Die informatie dient ook tekstueel te worden overgebracht. Locatie: ‘Links vind je gerelateerde artikelen’ is bijvoorbeeld niet te begrijpen voor blinde bezoekers, tenzij ‘gerelateerde artikelen’ ook bovenaan die lijst met artikelen staat. Symbolen en iconen: Bied altijd een goed tekstueel alternatief, zodat de informatie ook aan blinde bezoekers kan worden voorgelezen (zie ook succescriterium 1.1.1) Geluid: Dit komt niet vaak voor. Denk bijvoorbeeld aan geluid dat aangeeft dat een quiz-vraag goed is beantwoord. Deze informatie dient ook tekstueel te worden geboden. Oriëntatie: Dit komt ook niet vaak voor. Denk aan bijvoorbeeld een icoon dat schuin een andere betekenis heeft, dan rechtopstaand. 18 Uitleg van dit successcriterium Voor eisen met betrekking tot kleur zie Richtlijn 1.4. SUCCESCRITERIUM 1.3.4 (NIVEAU AA) Oriëntatie De weergave en bediening van content is niet beperkt tot een enkele schermstand, zoals staand of liggend, tenzij een specifieke schermstand essentieel is. De onderzochte set webpagina's voldoet aan dit succescriterium. Er zijn geen problemen gevonden. Uitleg van dit successcriterium Voorbeelden waarbij een specifieke schermstand essentieel is, zijn een bankoverschrijving, piano-toepassing, dia's voor een projector of televisie of VR-content (Virtual Reality) waarbij de binaire schermstand niet van toepassing is. SUCCESCRITERIUM 1.3.5 (NIVEAU AA) Inputdoel identificeren Het doel van elk invoerveld waarmee informatie over de gebruiker wordt verzameld, kan door software worden bepaald. 19 De onderzochte set webpagina's voldoet niet aan dit succescriterium. Op pagina https://www.rhenen.nl/mozard/!suite09.scherm1089? mWfrs=1009527&mSchp=gn&mNch=p7iz44rbyl (Formulier Reactie antwoord internet /Stap "Aanvrager") staat een formulier waar persoonlijke gegevens kunnen worden ingevuld. Voor persoonlijke gegevens is het belangrijk dat bij de invoervelden daarvoor het autocomplete attribuut wordt gebruikt met de juiste waarde. Dit zorgt ervoor dat hulpsoftware (of een browser of andere User Agent) de velden automatisch kan invullen, of extra hulp kan bieden bij het invullen. Dit autocomplete attribuut ontbreekt nu bij deze invoervelden. Een volledig overzicht van alle invoervelden waarvoor een autocomplete nodig is en welke waarde verplicht is is hier te vinden: https://www.w3.org/ Translations/WCAG21-nl/#input-purposes. Uitleg van dit successcriterium Het doel van elk invoerveld waarmee informatie over de gebruiker wordt verzameld, kan door software worden bepaald wanneer: • De invoervelden een doel dienen dat is geïdentificeerd in de paragraaf Inputdoelen voor componenten van de gebruikersinterface; en • De content wordt geïmplementeerd met technologieën waarmee de verwachte betekenis van de gegevens van het invoerformulier kan worden geïdentificeerd. RICHTLIJN 1.4

الإبلاغ عن إساءة

تفاصيل ال-PDF

معلومات الاتصال

WCAG 2.1 onderzoek