Audit digitale toegankelijkheid van website rechtsbijstand.nl/
Samenvatting
Wij hebben de website rechtsbijstand.nl/ onderzocht tussen 25 en 30 april 2025. Op dit moment zijn 38 van de 55 succescriteria als voldoende beoordeeld. In dit rapport lees je wat er bij de overige 17 nog fout gaat, en hoe je dat kunt verbeteren.
Resultaat
In dit onderzoek hebben we alle 55 toegankelijkheidseisen (succescriteria) uit de norm WCAG 2.2 onderzocht. We hebben het onderzoek uitgevoerd volgens de onderzoeksmethode WCAG-EM.
Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website
De van derden afkomstige inhoud (wettelijke uitzondering voor de overheid)
Basisniveau toegankelijkheidsondersteuning
Mozilla Firefox, versie 137
Google Chrome, versie 134
Apple Safari, versie 18
PAC software to test PDF
NVDA schermlezer in combinatie met Firefox
VoiceOver schermlezer in combinatie met Safari
Andere gangbare browsers en hulpapparatuur
Technologieën van de website
HTML
CSS
JavaScript
WAI-ARIA
SVG
PDF
Over dit onderzoek
Leeswijzer
Onze rapporten zijn anders. Bij het bespreken van de gevonden problemen volgen wij niet de structuur van de norm, maar die van jouw website of app. Hierdoor kun je gewoon per pagina of scherm aan de slag gaan. Wel zo makkelijk! Je vindt verderop een overzicht van alle pagina’s met problemen.
We geven je bij elk gevonden issue een paar voorbeelden, maar niet een complete lijst. Controleer zelf of het probleem ook nog op andere plekken voorkomt. Zie het rapport als een leidraad.
Gebruikte norm
Dit onderzoek laat zien in hoeverre de website op dit moment voldoet aan WCAG 2.2, niveau A en AA. WCAG staat voor Web Content Accessibility Guidelines. Dit is de internationale norm voor digitale toegankelijkheid. De Europese norm EN 301 549 bevat alle eisen van WCAG op niveau A en AA.
In dit rapport hebben we korte beschrijvingen van de succescriteria uit de norm opgenomen, met een algemene uitleg erbij. Wil je ze helemaal lezen? Bekijk dan de documentatie van WCAG.
Gebruikte onderzoeksmethode
We gebruiken de onderzoeksmethode WCAG-EM van het W3C. Het proces ziet er als volgt uit:
vaststellen wat binnen en buiten scope valt
vaststellen welke technologieën zijn gebruikt
steekproef (sample) samenstellen
steekproef onderzoeken
gevonden issues beschrijven
Het grootste deel van het onderzoek doen we met de hand. Voor een deel van de toegankelijkheidseisen gebruiken we automatische tools als ondersteuning, zoals axe-core en Chrome Developer Tools.
Belangrijk om te weten
Dit rapport helpt je om de toegankelijkheid van je website te verbeteren. Maar let op: het is geen definitieve, volledige lijst van alle aanwezige toegankelijkheidsproblemen. Dat zit zo:
Het is een steekproef
Ten eerste is het onderzoek gebaseerd op een steekproef. Die is op een betrouwbare manier genomen, en de meeste problemen zullen daardoor zeker aan het licht komen. Toch kan een probleem net buiten de steekproef vallen. Bij een volgend onderzoek kan het wel ontdekt worden.
Op basis van falsificatie
We beoordelen vanuit het principe van falsificatie. Dat houdt in dat we proberen te bewijzen dat iets niet waar is, in plaats van te bevestigen dat het klopt. ‘Voldoet’ betekent daarom dat we geen reden hebben gevonden om een punt af te keuren. Maar als we later wél een reden vinden, kan het alsnog worden afgekeurd.
Voortschrijdend inzicht
Het komt voor dat de beoordeling van een succescriterium op detailniveau verandert. De norm beschrijft namelijk niet élk mogelijk scenario. Samen met andere onderzoeksbureaus overleggen we hoe we met bepaalde situaties omgaan. Zo kan iets dat nu wordt afgekeurd, soms bij een volgend onderzoek worden goedgekeurd en andersom.
Oplossen leidt tot nieuw probleem
Ten slotte kan het gebeuren dat bij het oplossen van een probleem onbedoeld een nieuw toegankelijkheidsprobleem ontstaat. Dat komt dan bij een volgend onderzoek pas naar voren.
Het dialoogvenster "Uw mening telt" heeft geen toegankelijke naam, waardoor schermlezers niet kunnen aankondigen wat dit dialoogvenster betekent.
Schermlezers kunnen hierdoor niet doorgeven welke inhoud het dialoogvenster heeft.
Oplossing:
Voeg een aria-label aan het dialoogvenster toe met een duidelijke beschrijving van de inhoud.
Voldoet niet aan SC 4.1.2
Iframe heeft geen toegankelijke naam
Het dialoogvenster "Uw mening telt" bevat een iframe zonder een title-attribuut.
Iframes moeten een goede beschrijving hebben. Die staat meestal in het title-attribuut van het iframe. Er moet in staan welk type inhoud het is (bijvoorbeeld een podcast of video), en waar het inhoudelijk over gaat. Deze beschrijving van de inhoud moet uniek en betekenisvol zijn. Door de beschrijving kunnen blinde bezoekers beslissen of het de moeite waard is om de inhoud van het iframe te verkennen.
Oplossing:
Voeg het title-attribuut aan het iframe-element toe, en zet daar een tekst in waaruit blijkt welk type inhoud het iframe bevat, en waar het inhoudelijk over gaat.
Voldoet niet aan SC 4.1.2
title-attribuut van de link is hetzelfde als de linktekst (advies)
Het volgende is niet fout, maar een advies om de site nog toegankelijker te maken.
In het dialoogvenster "Uw mening telt" heeft de link "Meer informatie en meedoen" een titel-attribuut dat eenvoudigweg de linktekst dupliceert.
Deze herhaling zorgt ervoor dat gebruikers van schermlezers dezelfde tekst twee keer achter elkaar te horen krijgen.
Oplossing:
Voegt een title-attribuut geen nieuwe informatie toe aan de linktekst? Dan kun je dit beter weglaten. Hierdoor verminder je het aantal herhalingen voor bezoekers met een schermlezer.
Hetzelfde wordt waargenomen in de footer met de link "Raad voor Rechtsbijstand". Deze link heeft een title-attribuut dat eenvoudigweg de linktekst dupliceert.
Advies bij SC 2.4.4
Knop heeft geen code die aangeeft dat er een popup opent
In de cookiebanner opent de knop "Cookievoorkeuren beheren" een dialoogvenster, maar deze functionaliteit wordt niet aangegeven in de code.
Oplossing:
Voeg het attribuut aria-haspopup="dialog" toe aan de knop. Dit attribuut geeft aan dat het klikken op de knop een dialoogvenster opent. De status van het dialoogvenster, open of gesloten, geef je aan met het aria-expanded-attribuut, dat de waarde true of false moet krijgen.
Voldoet niet aan SC 4.1.2
De relatie tussen keuzerondjes is niet in de code vastgelegd
In de cookiebanner opent de knop "Cookievoorkeuren beheren" een dialoogvenster. Er is een groep selectievakjes, voorafgegaan door de tekst "Cookievoorkeuren beheren". Hoewel ze visueel gegroepeerd zijn, is deze relatie niet gedefinieerd in de HTML.
Oplossing:
Je lost dit op door de elementen in een fieldset-element te plaatsen. Een fieldset met interactieve inhoud moet een naam hebben. Hiervoor kun je het legend-element gebruiken. Plaats hierin de tekst “Cookievoorkeuren beheren”.
Voldoet niet aan SC 1.3.1
De toetsenbordfocus kan uit het dialoogvenster ontsnappen
De eerste keer dat een bezoeker de website opent, verschijnt er een modaal dialoogvenster "Uw mening telt". In dit dialoogvenster opent de knop "Cookievoorkeuren beheren" een ander modaal dialoogvenster. De toetsenbordfocus landt correct binnen dit dialoogvenster. Echter, nadat het laatste item is bereikt, verlaat de focus ten onrechte het dialoogvenster en kan deze landen op de "X"-knop van het modale dialoogvenster "Uw mening telt", in plaats van in het geopende dialoogvenster "Cookievoorkeuren beheren" te blijven.
Dit is geen logische focusvolgorde.
Oplossing:
Zorg dat de toetsenbordfocus binnen de modale dialoog blijft, totdat de bezoeker de modale dialoog sluit.
Voldoet niet aan SC 2.4.3
Onzichtbaar element krijgt toetsenbordfocus
Op alle pagina's in de header komt de toetsenbordfocus terecht op een onzichtbaar interactief element na de links "Over mediation & rechtsbijstand", "Ik krijg mediation of rechtsbijstand" en "Zelf regelen".
De toetsenbordfocus mag niet terechtkomen op onzichtbare interactieve elementen (links, knoppen, formuliervelden). Als dat wel gebeurt, kan een bezoeker ze onbedoeld activeren.
Oplossing:
Zorg dat alleen elementen die zichtbaar zijn toetsenbordfocus kunnen krijgen en dat de focusvolgorde logisch is.
Voldoet niet aan SC 2.4.3
Bezoekers die inzoomen tot 400% kunnen niet meer alle tekst lezen
Wanneer de website wordt bekeken met een schermresolutie van 1280 bij 1024 en wordt ingezoomd tot 400%, wordt de placeholder-tekst in de zoekbalk in de header afgesneden en is deze niet leesbaar.
Oplossing:
Zorg dat alles nog werkt als je inzoomt tot 400% op een scherm van 1280 bij 1024 pixels.
Voldoet niet aan SC 1.4.10
Kleurcontrast van tekst is te laag (tekst kleiner dan 19px)
Als een bezoeker met de muis over de links in de header van de website gaat, dan worden de submenu's met links getoond. Als een bezoeker met de muis over deze links in de submenu's gaat, hebben de links een groene (#2E8300) kleur op de lichtgroene (#F0F6ED) achtergrond. De contrastverhouding is 4,4:1. Dit moet minstens 4,5:1 zijn.
Hetzelfde probleem doet zich voor wanneer een bezoeker een link selecteert uit een submenu, bijvoorbeeld "Wat is gesubsidieerde rechtsbijstand?" uit "Over bemiddeling & rechtsbijstand". De geselecteerde link heeft dezelfde kleurencombinatie waardoor het contrast van de tekst onvoldoende is.
Oplossing:
Deze tekst is kleiner dan 19px, daarom moet het contrast met de achtergrondkleur minimaal 4,5:1 zijn.
Voldoet niet aan SC 1.4.3
Decoratieve afbeelding is niet verborgen voor schermlezers
Op alle pagina's bevatten de header en footer links zoals "Over ons", "Nieuws", "Contact" en andere, gescheiden door verticale balken. Deze balken zijn decoratieve elementen, maar ze zijn niet verborgen voor de schermlezer. Sommige schermlezers kondigen ze aan als "verticale lijn". Decoratieve inhoud moet door de schermlezer worden genegeerd.
Voldoet niet aan SC 1.1.1
Kruimelpad navigatie heeft geen betekenisvolle toegankelijke naam
Op alle pagina's heeft het kruimelpad een toegankelijke naam: "Sitepad" die afkomstig is van het aria-label. Zo'n toegankelijke naam is niet zinvol of beschrijvend.
Oplossing:
Hierdoor begrijpen bezoekers die een schermlezer gebruiken niet wat het doel is van deze navigatieregio. Voor schermlezergebruikers is het belangrijk dat het toegankelijke naam het doel van het element beschrijft.
Op deze pagina is de tekst "Deel deze informatie" in de footer niet gemarkeerd als een kop.
Blinde bezoekers hebben niets aan een (tussen)kop die er wel uitziet als kop, maar die niet als kop is gemarkeerd. Via de koppen op een pagina kunnen gebruikers van hulpsoftware de inhoud scannen of snel naar een bepaalde sectie springen. Maar dat kan alleen als de kop ook echt in de code staat. Als koppen alleen visueel als kop zijn vormgegeven (bijvoorbeeld vetgedrukt), ontstaat bovendien nog een ander probleem: de structuur van de informatie in de code wijkt dan af van de visuele structuur.
Oplossing:
Dit voorkom je door koppen altijd te markeren met het juiste HTML-element, op het juiste kopniveau: h1, h2, h3, h4, h5 of h6. Meestal kun je het kopniveau kiezen via de content-editor in je CMS. De HTML-code voor de kop wordt dan automatisch toegepast.
Hetzelfde probleem wordt waargenomen op andere pagina's die deze tekst bevatten:
Op deze pagina staan kopjes met nietszeggende tekst. Het gaat om “Direct naar”.
Teksten zoals “Snel naar”, “Direct naar”, en “Ga naar” zijn te algemeen: links leiden in principe altijd naar een andere pagina, dit weet je ook al zonder dat er bijvoorbeeld “Direct naar” boven staat. Zo’n soort kop geeft dus geen extra informatie of context. Dat is vooral voor bezoekers die schermlezers gebruiken een probleem. Zij laten de koppen voorlezen om snel de structuur van een pagina te begrijpen, en de inhoud te vinden die voor hen relevant is.
Oplossing:
Gebruik een meer specifieke kop, die duidelijk maakt wat voor soort inhoud of functionaliteit erna komt. Bijvoorbeeld door context te geven aan de links die volgen. Denk aan een kop als “Populaire pagina’s” of “Belangrijke onderwerpen”.
In de sectie onder de kop "Raad voor Rechtsbijstand" staan teksten in het Engels: "For individuals," en "Calling us from abroad”. Er is geen taalswitch toegepast op deze inhoud. Deze tekst wordt nu voorgelezen volgens de uitspraakregels van de primaire taal van de pagina. Die is ingesteld in het lang-attribuut op het html-element, in dit geval op “nl”. Je wilt echter dat de schermlezer bij deze tekst op de taal van deze zin overschakelt. Dat bereik je door deze anderstalige inhoud een lokaal lang-attribuut te geven met de juiste waarde.
Oplossing:
Voeg een lang-attribuut met de juiste taalcode toe aan het HTML-element dat de tekst in een andere taal bevat. Als de tekst bijvoorbeeld in het Engels is, voeg je lang="en" toe aan het element.
Voldoet niet aan SC 3.1.2
Kleurcontrast van tekst is te laag (tekst kleiner dan 19px)
Onder het kopje "Contact Raad voor Rechtsbijstand", staat een formulier met een captcha die een grijze ( #777777) link bevat met het label "Friendly Captcha" op een witte ( #FAFAFA) achtergrond. De kleurcontrastverhouding tussen de link en de achtergrond is 4,3:1.
Oplossing:
Deze tekst is kleiner dan 19px, daarom moet het contrast met de achtergrondkleur minimaal 4,5:1 zijn.
Voldoet niet aan SC 1.4.3
De kleur van de rand van het invoerveld en de kleur van het pictogram van de knop hebben niet genoeg contrast.
Onder het kopje "Contact Raad voor Rechtsbijstand", staat een formulier met een captcha die een selectievakje bevat voor de captcha-verificatiemethode. De grijze ( #AAAAAA) rand heeft een lage contrastverhouding van 2,2:1 tegen de lichtgrijze ( #FAFAFA) achtergrond. Dezelfde kleurencombinatie wordt gebruikt voor de knop met drie stippen. Het icoon is dus niet voor iedereen zichtbaar.
Oplossing:
Zorg dat het contrast minimaal 3,0:1 is.
Voldoet niet aan SC 1.4.11
Iframe heeft geen toegankelijke naam
Op deze pagina bevat het formulier een iframe met een captcha zonder titel-attribuut.
Iframes moeten een goede beschrijving hebben. Die staat meestal in het title-attribuut van het iframe. Er moet in staan welk type inhoud het is (bijvoorbeeld een podcast of video), en waar het inhoudelijk over gaat. Deze beschrijving van de inhoud moet uniek en betekenisvol zijn. Door de beschrijving kunnen blinde bezoekers beslissen of het de moeite waard is om de inhoud van het iframe te verkennen.
Oplossing:
Voeg het title-attribuut aan het iframe-element toe, en zet daar een tekst in waaruit blijkt welk type inhoud het iframe bevat, en waar het inhoudelijk over gaat.
Voldoet niet aan SC 4.1.2
Onzichtbaar element krijgt toetsenbordfocus
In de sectie, onder de kop "Raad voor Rechtsbijstand", komt de toetsenbordfocus terecht op een onzichtbaar interactief element na de link "+31 88 787 1234".
De toetsenbordfocus mag niet terechtkomen op onzichtbare interactieve elementen (links, knoppen, formuliervelden). Als dat wel gebeurt, kan een bezoeker ze onbedoeld activeren.
Oplossing:
Zorg dat alleen elementen die zichtbaar zijn toetsenbordfocus kunnen krijgen en dat de focusvolgorde logisch is.
Voldoet niet aan SC 2.4.3
Link heeft geen toegankelijke naam
Onder het kopje "Raad voor Rechtsbijstand", staat achter de link "+31 88 787 1234" nog een link die niet zichtbaar is. Deze onzichtbare link heeft geen toegankelijke naam.
Hierdoor begrijpen bezoekers die een schermlezer gebruiken niet wat de bestemming of de functie is van de link.
Oplossing:
Geef deze link een toegankelijke naam, door gebruik te maken van beschrijvende linktekst, een aria-label of andere geschikte technieken.
Voldoet niet aan SC 4.1.2
Link heeft geen tekst, waardoor linkdoel onbekend is
Onder het kopje "Raad voor Rechtsbijstand", staat achter de link "+31 88 787 1234" nog een link die niet zichtbaar is. Deze onzichtbare link mist inhoud en heeft daarom geen waarneembaar linkdoel.
Een blinde bezoeker weet daardoor niet waar de link naartoe zal leiden.
Oplossing:
Om dit op te lossen moet je de link content geven. Dat kun je als volgt doen:
Tekst toevoegen aan het a-element: voeg beschrijvende tekst toe binnen het element.
aria-label gebruiken: voeg het aria-label-attribuut toe aan de link en plaats hier een beknopte beschrijving van de bestemming in.
Zorg dat alle links een duidelijk linkdoel hebben.
Voldoet niet aan SC 2.4.4
Bezoekers die inzoomen tot 400% kunnen niet meer alle functies gebruiken
Wanneer deze pagina wordt bekeken met een schermresolutie van 1280 bij 1024 pixels en ingezoomd wordt tot 400%, komen in het formulier onder het label "Beveiligingsvraag" het menu met de drie puntjes en de link "Friendly Captcha" buiten de rechterrand van het viewport. Hierdoor is het menu met de drie puntjes niet zichtbaar en wordt de linktekst afgesneden.
Oplossing:
Zorg dat alles nog werkt als je inzoomt tot 400% op een scherm van 1280 bij 1024 pixels.
###De videospeler gebruikt letters als sneltoetsen
Deze pagina bevat een videospeler die sneltoetsen met één letter gebruikt.
De speler gebruikt sneltoetsen, zoals de ‘k' om de video te starten of stoppen en de 'm' om het geluid uit te zetten. Deze sneltoetsen botsen met schermlezers. Ze zijn namelijk ook actief als de toetsenbordfocus op een ander element in de videospeler staat. Dit kan problemen geven voor mensen die met spraakbediening werken, omdat deze letters soms in de uitgesproken woorden zitten. Ook voor mensen die per ongeluk een toets op het toetsenbord indrukken is het onhandig.
Oplossing:
De sneltoetsen moeten worden uitgeschakeld, terwijl toetsenbordbediening mogelijk blijft.
Voldoet niet aan SC 2.1.4
Het type content in het iframe is niet beschreven in het title-attribuut
Deze pagina bevat een iframe met het title-attribuut "rvr.bbvms".
Iframes moeten een goede beschrijving hebben. Die zet je meestal in het title-attribuut van het iframe. Er moet in staan welk type inhoud het is (bijvoorbeeld een podcast of video), en waar het inhoudelijk over gaat. Deze beschrijving van de inhoud moet uniek en betekenisvol zijn. Door de beschrijving kunnen blinde bezoekers beslissen of het de moeite waard is om de inhoud van het iframe te verkennen.
Oplossing:
Verander de tekst van het title-attribuut zodat duidelijk is welk type inhoud het iframe bevat, en waar het inhoudelijk over gaat.
Voldoet niet aan SC 2.4.6
Video bevat tekst of logo’s waarvoor geen alternatief is
Op deze pagina wordt een video gepresenteerd onder de titel "Ratz". De video bevat tekst en logo's op verschillende punten (bijvoorbeeld rond 0:43).
Bezoekers die blind of slechtziend zijn, missen hierdoor informatie.
Oplossing:
Je kunt het beste een audiobeschrijving toevoegen die de visuele elementen in de video beschrijft, zoals namen, functies, logo’s en teksten. Een andere oplossing is het toevoegen van een geschreven tekst (een media-alternatief). Maar om ook te voldoen aan succescriterium 1.2.5 moet je sowieso een audiobeschrijving toevoegen.
Voldoet niet aan SC 1.2.3
De video heeft geen audiobeschrijving, terwijl daar wel ruimte voor is
Deze video op deze pagina voldoet niet aan succescriterium 1.2.5, dat audiobeschrijving of een media-alternatief voor video's vereist. Specifiek voor deze video is audiobeschrijving (niveau AA) nodig, aangezien er voldoende ruimte is binnen het bestaande audiospoor.
Oplossing:
Voeg een audiobeschrijving toe aan de video. Een media-alternatief is hier niet meer toegestaan als oplossing. Dit is van belang voor mensen die de video’s niet (goed) kunnen zien.
Deze pagina bevat de links met pijlpictogrammen die dialoogvensters met aanvullende informatie openen. Zie bijvoorbeeld de volgende links: "eigen bijdrage", "inkomen", "vermogen", en andere. Deze links hebben meerdere problemen die al zijn beschreven voor de vergelijkbare links van de pagina Wat is mediation? - Rechtsbijstand
Er zijn links met dezelfde tekst maar een andere bestemming
Op deze pagina opent de link "peiljaarverlegging" onder de kop "Dit jaar minder inkomen en vermogen?" een tooltip. Er staat een link met dezelfde tekst onder dezelfde kop, maar de bestemming van deze tweede link is anders. Hetzelfde probleem wordt waargenomen bij de links "eigen bijdrage".
Er zijn dus meerdere links aanwezig in de steekproef met dezelfde tekst, maar een verschillend linkdoel. Dit kan verwarrend zijn voor bezoekers.
Oplossing:
Zorg dat links met dezelfde tekst ook naar dezelfde bestemming leiden. Als het om een andere bestemming gaat, moet de linktekst ook anders zijn.
Voldoet niet aan SC 2.4.4
strong-element is gebruikt in koptekst
Op deze pagina staan in de sectie die wordt geopend door "Bekijk de vermogensgrens Uitklappen" de kopjes "- Rechtsbijstand en mediation" en "- Vermogensgrens i.v.m. resultaatsbeoordeling". In deze rubriek worden het heading-element en het strong-element gebruikt.
Het strong-element heeft een semantische waarde. Het geeft een bepaalde betekenis aan de tekst die erin staat, namelijk dat de tekst extra nadruk moet krijgen. Om die reden mag je dit element niet gebruiken om alleen een visueel effect te bereiken (vetgedrukt).
Oplossing:
Gebruik CSS om de tekst vetgedrukt te maken, en verwijder het strong-element.
Voldoet niet aan SC 1.3.1
Opsomming is niet opgebouwd met het HTML-element <ul> of <ol>
Op deze pagina, onder het kopje "Schulden of failliet?" is een lijst met 2 items aanwezig, maar deze mist de juiste markup.
Tekst die eruitziet als een opsomming, moet ook zo in de code worden gemarkeerd. Je gebruikt voor lijsten en opsommingen de HTML-elementen ol (lijst met cijfers) of ul (lijst met bullets). Meestal is hier een knop voor in de content-editor van een CMS. Hulpsoftware weet dan hoe de tekst is gestructureerd. Bovendien kondigen schermlezers dan het aantal items in de lijst aan, voordat ze die gaan voorlezen. Zo weet een blinde bezoeker hoeveel informatie er nog komt.
Oplossing:
Zorg dat alle opsommingen op de juiste manier in de code zijn gemarkeerd.
Voldoet niet aan SC 1.3.1
Een kopcel is ten onrechte gemarkeerd als gegevenscell (td)
Op deze pagina in het gedeelte dat wordt geopend door de knop "Bekijk de vermogensgrens" staat een tabel onder de kop "Vermogensgrens i.v.m. resultaatsbeoordeling In 2025 geldt:". De kolomkopcel met tekst "2025" is ten onrechte gemarkeerd als een gegevenscel (td).
Oplossing:
Gebruik voor kolomkoppen het th-element.
Voldoet niet aan SC 1.3.1
Relatie tussen tabel en bijschrift niet vastgelegd
Op deze pagina zijn in het gedeelte dat geopend wordt door de knop "Bekijk de vermogensgrens" twee tabellen aanwezig. Onder deze tabellen staat informatie die bij de tabel hoort, namelijk de tekst die begint met "De vermogensgrens is met ingang ...". Voor schermlezers is de relatie tussen de tabel en de bron eronder niet beschikbaar.
De relatie tussen de tabel en het bijschrift is niet in de code vastgelegd, en daardoor niet beschikbaar voor schermlezers.
Oplossing:
Je kunt dit op verschillende manieren oplossen:
Neem de tabel op in een figure-element en gebruik daarin het figcaption-element voor het bijschrift.
Zet het bijschrift in een span-element met een id-attribuut. Gebruik vervolgens bij het table-element het aria-describedby-attribuut en laat dit verwijzen naar het id van het span-element met het bijschrift. Als de schermlezer de tabel tegenkomt, wordt het bijschrift direct voorgelezen.
Invoervelden voor persoonlijke gegevens hebben geen autocomplete-attribuut
Op deze pagina mist een formulier met invoervelden voor persoonlijke informatie (bijvoorbeeld "Achternaam mediator", "Postcode") het autocomplete-attribuut.
Invoervelden voor persoonlijke informatie zoals achternaam, e-mailadres of telefoonnummer moeten het autocomplete-attribuut hebben. Hierdoor kunnen browsers en hulpsoftware helpen bij het invoeren. Bijvoorbeeld door de velden al automatisch in te vullen.
Oplossing:
Gebruik het autocomplete-attribuut voor alle velden waar persoonlijke informatie in moet worden gevuld. Voor het e-mailadres gebruik je bijvoorbeeld autocomplete="email". Op deze pagina vind je meer informatie over autocomplete en welke waardes je verplicht moet gebruiken: Input purposes.
Voldoet niet aan SC 1.3.5
Knoppen met dezelfde tekst hebben een andere functie
Op deze pagina staan in het formulier onder het kopje "Specialisme" selectievakjes. Naast elk selectievakje staat een knop met een pijl. Al deze knoppen hebben dezelfde toegankelijke naam: "Toelichting". Deze knoppen hebben echter verschillende functies.
Je kunt met deze knoppen een andere actie uitvoeren. Dit kan verwarrend zijn voor bezoekers met een schermlezer. Het is niet duidelijk welke actie elke knop uitvoert.
Oplossing:
Zorg dat de tekst past bij de actie van de knop, zodat knoppen met verschillende functies ook verschillende knopteksten hebben, zoals “Arbeidsconflicten Toelichting“.
Deze pagina bevat een formulier met een Captcha-element. Dit Captcha element heeft meerdere problemen die al beschreven zijn voor hetzelfde Captcha element van de pagina Contact Raad voor Rechtsbijstand - Rechtsbijstand
Foutmelding is een instructie in plaats van een uitleg over de fout
Op deze pagina worden foutmeldingen in het formulier weergegeven, zoals "Veld Ik heb rechtsbijstand nodig voor: is verplicht."
Dit is een instructie, geen foutmelding. Een goede foutmelding maakt duidelijk dat er een fout is gemaakt, en geeft aan waar de fout zit. Vaak staat er een ontkenning in. Een voorbeeld van een goede foutmelding is: "Het veld is niet (goed) ingevuld."
Oplossing:
Pas de foutmelding aan, zodat de bezoeker weet wat er fout is.
Voldoet niet aan SC 3.3.1
Skiplink verwijst niet naar de juiste plek
Op deze pagina staat een formulier. Wanneer een bezoeker het formulier met de juiste gegevens invult, wordt de stap "Matchingformulier Mijnbouwschade - Bevestigen" weergegeven. De skip link richt zich niet op de unieke inhoud op deze pagina, maar herlaadt de pagina en brengt de bezoeker terug naar de stap met een formulier.
De skiplink moet verwijzen naar (het begin van) de unieke inhoud op de pagina, zodat een bezoeker alle herhalende of niet-essentiële content kan overslaan.
Oplossing:
Zorg dat de skiplink verwijst naar het juiste startpunt van de unieke content op de pagina.
Naam van de link beschrijft de link bestemming niet
Op deze pagina staat onder het kopje "Wat wordt bedoeld met een gebouw?" een link "de". Deze tekst beschrijft de bestemming van de link niet adequaat, waardoor onduidelijkheid ontstaat, vooral voor gebruikers met cognitieve beperkingen of gebruikers die afhankelijk zijn van schermlezers. Een blinde bezoeker weet daardoor niet waar de link naartoe zal leiden.
Oplossing:
De links "de" en "meest gestelde vragen" moeten één link worden. Om dit probleem op te lossen, combineer je ze tot één link met de tekst "de meest gestelde vragen".
Voldoet niet aan SC 2.4.4
Alternatieve tekst van afbeelding is niet betekenisvol
Op deze pagina staat onder het kopje "Meer informatie of heeft u vragen?" een afbeelding met de tekst "Twijfel niet en bel. Wij kijken graag met u mee." is aanwezig. Het tekstalternatief is "Banner Mijnbouwschade". Dit tekstalternatief is niet zinvol en bevat niet de tekst op de afbeelding.
Afbeeldingen die informatie overdragen moeten een betekenisvolle alternatieve tekst hebben, waarin de belangrijke informatie uit de afbeelding wordt beschreven.
Oplossing:
Voeg een beschrijvende alternatieve tekst toe aan het alt-attribuut dat de tekst van de afbeelding zou bevatten.
Informatieve afbeelding is als achtergrondafbeelding geplaatst
Alle pagina's van dit PDF-document bevatten een logo "Raad voor Rechtsbijstand" als artefact.
Afbeeldingen die als artefact zijn toegevoegd, zijn niet zichtbaar voor schermlezers. De informatie in deze afbeeldingen is daardoor niet toegankelijk voor bezoekers die de tekst laten voorlezen. Informatieve afbeeldingen moeten via een Figure-tag worden geplaatst en een alt-tekst krijgen die de afbeelding duidelijk beschrijft.
Oplossing:
Voeg het logo toe met de Figure-tag en geef het een beschrijvende alt-tekst.
Voldoet niet aan SC 1.1.1
Tabelkoppen zijn niet gemarkeerd
In dit PDF-document zijn de tabellen op alle pagina's gegevenstabellen. De juiste markering ontbreekt.
Bij een datatabel moet je speciale tags toevoegen voor de tabelkoppen. Dan begrijpen schermlezers de relatie tussen de kop en onderliggende datacellen.
Oplossing:
Markeer de cellen in de koprij van de tabel met TH-tags en de datacellen met TD-tags.
Voldoet niet aan SC 1.3.1
Koppen zijn niet als kop gemarkeerd
In dit PDF-document zijn er verschillende rubrieken die niet gemarkeerd zijn als rubrieken. Zie bijvoorbeeld "Reguliere toevoeging", "Personen- en familierecht", "Korting op de eigen bijdrage", "Bemiddeling", en andere.
Op deze manier verschilt de visuele informatiestructuur van de structuur van het document in de tags.
Oplossing:
Vervang de P-tag door de H-tag, zodat de tag-structuur gelijk is aan de visuele structuur.
In de bestandseigenschappen van dit PDF-document is geen titel ingesteld.
Zelfs als er een titel op de eerste pagina staat, moet je in de PDF-instellingen ook een documenttitel instellen. Als je een PDF opent in een PDF-lezer (zoals Adobe Acrobat of een browser), zie je de bestandsnaam meestal bovenaan in de titelbalk, bijvoorbeeld document123.pdf. Maar als je een documenttitel in de PDF-metadata instelt, dan wordt die titel in plaats van de bestandsnaam getoond. Dit maakt het document toegankelijker voor bezoekers met verschillende beperkingen. Zij kunnen dan snel en gemakkelijk zien of het document relevant is.
Los het op in Adobe Acrobat:
Open het PDF-document in Adobe Acrobat.
Ga naar Bestand > Eigenschappen.
Ga naar het tabblad Beschrijving.
Vul in het veld Titel een beschrijvende titel in.
Klik op OK en sla het bestand op.
Voldoet niet aan SC 2.4.2
Informatieve afbeelding is als achtergrondafbeelding geplaatst
Alle pagina's van dit PDF-document bevatten een logo "Raad voor Rechtsbijstand" als artefact.
Afbeeldingen die als artefact zijn toegevoegd, zijn niet zichtbaar voor schermlezers. De informatie in deze afbeeldingen is daardoor niet toegankelijk voor bezoekers die de tekst laten voorlezen. Informatieve afbeeldingen moeten via een Figure-tag worden geplaatst en een alt-tekst krijgen die de afbeelding duidelijk beschrijft.
Oplossing:
Voeg het logo toe met de Figure-tag en geef het een beschrijvende alt-tekst.
Voldoet niet aan SC 1.1.1
Gegevenscellen zijn onjuist gemarkeerd als TH
In dit PDF-document op pagina 9 en 11, de tabellen onder de kopjes “Bijlage 1 Begrippenlijst bij de privacyverklaring” en “Bijlage 2 Overzicht van derden met wie de Raad persoonsgegevens deelt ” zijn gegevenstabellen. De cellen met teksten die beginnen met "De Basisregistratie Personen (BRP) bevat
persoonsgegevens ..." en "Als een piketmelding is gedaan ..." zijn gemarkeerd als tabelkop met TH.
Oplossing:
Zorg ervoor dat alleen de echte kopcellen gemarkeerd zijn met TH-tags, en de overige cellen met TD-tags.
Voldoet niet aan SC 1.3.1
Koppen zijn niet als kop gemarkeerd
In dit PDF-document staan verschillende koppen die niet als kop gemarkeerd zijn. Zie bijvoorbeeld "Privacyverklaring Raad voor Rechtsbijstand", "Missie", "Visie", "Onderzoek", en anderen.
Oplossing:
Vervang de P-tag door de H-tag, zodat de tag-structuur gelijk is aan de visuele structuur.
Voldoet niet aan SC 1.3.1
Lijsten zijn onjuist gemarkeerd
In dit PDF-document staat op pagina 4 en 5 onder het kopje "4. Waarom verwerken wij uw persoonsgegevens?" een lijst van 5 items. In de tags staan echter twee aparte lijsten.
Oplossing:
Combineer de lijsten: voeg de afzonderlijke L-tags samen tot één enkele lijst, zodat schermlezers de items als een doorlopende lijst voorlezen. Je kunt de twee lijsten ook ongewijzigd laten en bij de tweede lijst een toelichting plaatsen waarin staat dat deze lijst een vervolg is op de lijst van de vorige pagina.
Een soortgelijk probleem wordt waargenomen op pagina 7 onder het kopje "10. Welke privacyrechten heeft u?". Een enkele lijst is gemarkeerd met 2 aparte L-tags. Bovendien is het visueel duidelijk dat de tekst die begint met "In gevallen waar u toestemming heeft gegeven ..." verwijst naar het lijstitem "Recht om te vergeten te worden:". In tags is het echter gemarkeerd met P-tag als een afzonderlijk element.
Op deze pagina onder het kopje "RvR.org (website voor advocaten en mediators)." bevat de link met de tekst "onderzoeksrapport" een PDF-icoon. Hierdoor weet een blinde bezoeker niet dat dit een PDF-document is. Dit is belangrijke informatie die als tekst aanwezig moet zijn, zodat een schermlezer het kan voorlezen.
Deze afbeelding wordt ook verborgen voor schermlezers door het attribuut `aria-hidden="true"`` te gebruiken op het i-element dat de afbeelding bevat.
Schermlezers negeren inhoud met het attribuut aria-hidden="true". Deze inhoud is dus verborgen voor blinde bezoekers. Verwijder deze attributen zodat een blinde bezoeker dezelfde informatie krijgt als een ziende bezoeker.
Voldoet niet aan SC 1.1.1
Taalwisseling ontbreekt op anderstalige content
Op deze pagina staat een kopje "RaadvoorRechtsbijstand.org (corporate website)". Het gedeelte van de koptekst "corporate website" is in een andere taal. Er is geen taalcode toegepast op deze inhoud.
Oplossing:
Voeg een lang-attribuut met de juiste taalcode toe aan het HTML-element dat de tekst in een andere taal bevat. Als de tekst bijvoorbeeld in het Engels is, voeg je lang="en" toe aan het element.
Dialoogvenster heeft niet de juiste rol en juiste toegankelijke naam
Op deze pagina staan links met de tekst "mediator" in de rubriek "Hoe werkt mediation?" en de link "mediation" in de rubriek "Het Juridisch Loket". Het activeren van deze links opent een dialoogvenster met aanvullende informatie. Dit dialoogvenster heeft geen ARIA-rol en geen toegankelijke naam. Momenteel is het onjuist gemarkeerd met de role="tooltip". Lees hier waarom deze rol niet geschikt is op dit element: Role=tooltip.
De toegankelijke naam bevat de hele inhoud van dit venster inclusief de inhoud van het button-element: de tekst "Popup mediator sluiten".
Schermlezers kunnen hierdoor niet doorgeven dat het om een dialoogvenster gaat, en wat de inhoud ervan is.
Oplossing:
Voeg twee attributen toe aan het dialoogvenster: een aria-label met een duidelijke beschrijving van de inhoud (aria-label="Beschrijving van de inhoud") en role="dialog".
Voldoet niet aan SC 4.1.2
Voldoet niet aan SC 2.4.6
Toetsenbordfocus komt niet op een logische plek nadat dialoogvenster is gesloten
Op deze pagina openen de links met de tekst "mediator" in het gedeelte onder "Hoe werkt mediation?" en de link "mediation" onder het kopje "Het Juridisch Loket" een dialoogvenster.
Na het sluiten van het dialoogvenster keert de toetsenbordfocus niet terug naar het element dat de focus heeft geactiveerd of naar het volgende logische element in de focusvolgorde van de pagina.
Oplossing:
Zorg dat de focus na het sluiten van het venster terechtkomt op het element waarmee het dialoogvenster werd geopend.
Voldoet niet aan SC 2.4.3
Link heeft geen code die aangeeft dat er een popup opent
Op deze pagina openen de links met de tekst "mediator" in de sectie onder "Hoe werkt mediation?" en de link "mediation" onder het kopje "Het Juridisch Loket", een dialoogvenster, maar deze functionaliteit wordt niet aangegeven in de code.
Oplossing:
Voeg het attribuut aria-haspopup="dialog" toe aan de link. Dit attribuut geeft aan dat het klikken op de link een dialoogvenster opent. De status van het dialoogvenster, open of gesloten, geef je aan met het aria-expanded-attribuut, dat de waarde true of false moet krijgen.
Voldoet niet aan SC 4.1.2
Informatieve afbeelding is als achtergrond gebruikt, en er is geen tekstalternatief
Op deze pagina staan de links met de tekst "mediator" in het gedeelte onder "Hoe werkt mediation?" en de link "mediation" onder het kopje "Het Juridisch Loket" pijlafbeeldingen die aangeven dat er aanvullende inhoud kan worden geopend. Deze pijlafbeeldingen hebben geen tekstalternatief, waardoor deze informatie niet toegankelijk is voor gebruikers van schermlezers.
Oplossing:
Zorg ervoor dat de informatie toch beschikbaar is via een tekstalternatief. Dit kan via een verborgen tekst. Je kunt de afbeelding ook via het img-element plaatsen en de informatie in de alternatieve tekst zetten.
Voldoet niet SC 1.1.1
Link is niet programmatisch gekoppeld aan de pop-up die wordt bestuurd.
Op deze pagina openen de links met de tekst "mediator" in de rubriek "Hoe werkt mediation?" en de link "mediation" in de kop "Het Juridisch Loket" een dialoogvenster. Bij deze links ontbreekt het aria-controls-attribuut. Hierdoor zijn de links niet gekoppeld aan de dialogen die ze openen.
Oplossing:
Voeg dit attribuut toe.
Voldoet niet aan SC 1.3.1
Pijltjes bij links hebben geen tekstalternatief
Op deze pagina staan links met de tekst "mediator" in de rubriek "Hoe werkt mediation?" en de link "mediation" in de rubriek "Het Juridisch Loket". Deze links bevatten pijl-iconen die de aanwezigheid van extra inhoud aangeven. Deze pictogrammen hebben echter geen tekstalternatief.
Daardoor weten schermlezers niet dat hier extra content aanwezig is.
Voldoet of niet van toepassing: 38
Voldoet niet: 17
