Rapport:
Audit digitale toegankelijkheid website Raad voor Plantenrassen

Uitkomst: Onvoldoende

Bevindingen: Op onder andere pagina www.raadvoorplantenrassen.nl/nl is bovenaan het logo te zien, dit is een afbeelding die in een link naar de homepagina staat. De afbeelding is voor hulpsoftware verborgen doormiddel van een leeg alt-attribuut. Bezoekers die niet kunnen zien weten hierdoor niet dat op deze plek het logo staat, en dat deze naar de homepagina linkt (de link heeft ook niet op andere wijze een toegankelijke naam gekregen). Los dit op door een tekst toe te voegen aan het alt-attribuut, bijvoorbeeld 'Raad voor plantenrassen logo, ga naar homepagina'. Zie succescriterium 2.4.4 en 4.1.2.

Op onder andere pagina www.raadvoorplantenrassen.nl/nl staan in de footer onder 'Direct regelen' witte pijlen bij de links. Deze iconen zijn via de CSS geplaatst en hebben de alternatieve tekst 'arrow_forward' gekregen. Deze Engelstalige tekst kan verwarrend werken op een Nederlandstalige website. Daarnaast herkent hulpsoftware zoals een screenreader de links al als links en leest deze als zodanig voor, waarmee de boodschap die door de iconen wordt overgebracht al duidelijk is op basis van de links. Daarom kunnen de iconen als decoratief worden gezien en worden verborgen voor hulpsoftware. Verwijder de tekst 'arrow_forward' uit de content van het icoon in de CSS. Een soortgelijk probleem komt voor bij de oranje pijlen op meerdere plekken op de website, bijvoorbeeld op de homepagina www.raadvoorplantenrassen.nl/nl bij de links onder de kop 'Direct regelen', en bij de links 'Meer thema's en 'Meer over de Raad'. Ook bij de links op andere pagina's komt dit voor, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/nl/contact/ en in het groene kader 'Direct regelen' op onder andere pagina www.raadvoorplantenrassen.nl/nl/herregistratie/.

Op de homepagina www.raadvoorplantenrassen.nl/nl staat bij de link 'Hennep' een icoon van een naar rechts wijzende driehoek (>). Deze is via de CSS geplaatst en heeft de alternatieve tekst 'chevron_right' gekregen. Deze tekst beschrijft niet goed welke informatie het icoon overbrengt (dat het hier om een link gaat). Omdat de link door hulpsoftware al als link herkend wordt, kan het icoon als decoratief worden gezien en worden verborgen voor hulpsoftware. Verwijder de de tekst uit de content van dit element in de CSS. Dit komt ook voor bij de andere links onder de kop 'Actuele Thema's'. Ook op andere pagina's komt dit voor, bijvoorbeeld bij de zoekresultaten op pagina www.raadvoorplantenrassen.nl/nl/zoeken/ en bij de links onder 'Of bekijk per onderwerp' op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/.

Op meerdere pagina's komen links voor waarbij een icoon staat waaruit de bezoeker kan opmaken dat het om een externe link gaat die in een nieuw venster opent. Bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/ bij de link 'Nationaal rassenregister' in het groene kader 'Direct regelen'. Het icoon is via de CSS toegevoegd en heeft als alternatieve tekst 'launch'. Deze tekst omschrijft niet goed welke informatie het icoon overbrengt. Vervang de tekst om aan dit succescriterium te voldoen, bijvoorbeeld door 'Opent in nieuw venster'. Een advies om dit nog toegankelijker te maken (het wordt niet op toegankelijkheid afgekeurd als dit advies niet opgevolgd wordt) is om links nooit in een nieuw tabblad te laten openen, en om als dit wel gebeurt deze informatie niet door middel van een icoon maar via tekst over te brengen.

Op pagina www.raadvoorplantenrassen.nl/nl staan onder de kop 'Actueel' links waar afbeeldingen bij staan. De afbeeldingen hebben een alternatieve tekst die overeenkomt met de kop die eronder staat, bijvoorbeeld 'Gazette van de Raad voor plantenrassen februari 2024'. Deze tekst beschrijft niet wat op de afbeelding te zien is. Bij een decoratieve afbeelding is het niet nodig om een alternatieve tekst toe te voegen, maar als deze er wel is dan moet deze de afbeelding beschrijven. Wijzig de alternatieve tekst of verberg de afbeelding voor hulpsoftware door het alt-attribuut leeg te laten. Een soortgelijk probleem komt ook op andere pagina's voor, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/en bij de afbeelding 'Gazette of the Board for plant varieties February 2024 is published'. En op pagina www.raadvoorplantenrassen.nl/nl/actueel/ bij de afbeeldingen onder de kop 'Nieuwsberichten'. Het komt ook voor op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/ bij alle nieuwsberichten onder de kop 'Nieuws' en op www.raadvoorplantenrassen.nl/nl/actueel/themas/ bij alle berichten onder 'Thema's'.

In het PDF document www.raadvoorplantenrassen.nl/media/dvhjioo2/aanvraagformulier_amateurrassen_nl-1-met-nieuwe-logo.pdf is een afbeelding met het logo te vinden. Deze heeft geen alternatieve tekst, waardoor het voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader niet duidelijk is dat zich hier het logo bevindt. Voeg een beschrijvende alternatieve tekst toe. Ditzelfde komt voor in het PDF document www.raadvoorplantenrassen.nl/media/c1mdnjku/handleiding_aanvraagformulier-met-nieuwe-logo.pdf. Ook het Word-document www.raadvoorplantenrassen.nl/media/hsbncjw2/naamsvoorstelform-nl_-3-met-nieuw-logo.docx, dat zich bevindt op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/naamsvoorstelformulier, bevat een afbeelding met het logo welke geen alternatieve tekst heeft.

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina, bijvoorbeeld www.raadvoorplantenrassen.nl/nl/, staat in het menu een knop waarmee de taalinstellingen gewijzigd kunnen worden ('NL'). Deze knop staat in een lijst met één lijst-item. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader kan het verwarrend werken als wordt voorgelezen dat zich hier een lijst bevindt, terwijl het niet om een lijst gaat maar om een enkel item (de knop). Maak alleen gebruik van het lijst-element (ul en li) wanneer het gaat om een opsomming van items. Verwijder het ul- en li- element waarin deze knop staat, en plaats de knop als los element in het menu.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/instandhouding-van-een-ras/ zijn bepaalde zinnen in de tekst visueel herkenbaar als (sub)kop, doordat deze met het strong-element zijn opgemaakt. Het gaat bijvoorbeeld om de tekst die begint met 'De registratie in het nationaal rassenregister..'. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is niet te herkennen dat het hier om koppen gaat. Het strong-element is bedoeld om nadruk te leggen op één of een paar woorden, maar niet om een kop te maken. Maak de (sub)koppen op andere wijze op, bijvoorbeeld door het h3-element te gebruiken. Voor de styling kan gebruik gemaakt worden van de eigenschappen van de CSS. Ditzelfde komt voor op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/wetgeving/, bijvoorbeeld bij de visuele (sub)kop 'Kwekersrecht'.

Op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/aanvraag-amateur-en-… staat de kop op kopniveau h2 'Gerelateerde documenten'. Dit is een lege kop, omdat deze geen content bevat en direct wordt opgevolgd door de footer. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is het mogelijk om de te navigeren via de koppenstructuur. Daarom is het belangrijk dat elke kop content bevat en dat de kop deze content goed beschrijft. Een mogelijke oplossing is is het verwijderen van de kop (zowel visueel als voor hulpsoftware) op het moment dat er geen gerelateerde documenten zijn. Of voeg een tekst toe onder de kop, zoals bijvoorbeeld 'Er zijn geen gerelateerde documenten'.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/tarievenlijst/ bevatten de tabbladen (bijvoorbeeld 'Groentegewassen') een tabel met daarin kopcellen. De eerste kopcel bevat geen content. Zorg dat elke kopcel een naam heeft die de bijbehorende cellen beschrijft of, als dit de eerste kolom betreft zorg dat deze niet als kop (<th> wordt gebruikt maar als cel (<td>) is opgemaakt.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/tarievenlijst/ bevatten de tabellen in de tabbladen (bijvoorbeeld 'Groentegewassen') voetnoten. Achter sommige onderwerpen wordt hier via '*' danwel '**' naar verwezen. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader kan het lastig zijn om de informatie van de voetnoten aan de juiste onderwerpen te koppelen, omdat deze pas na de tabel te vinden zijn. Zorg ervoor dat de informatie uit de betreffende voetnoot direct bij het betreffende onderwerp voorgelezen kan worden.

In het PDF document www.raadvoorplantenrassen.nl/media/dvhjioo2/aanvraagformulier_amateurrassen_nl-1-met-nieuwe-logo.pdf en www.raadvoorplantenrassen.nl/media/c1mdnjku/handleiding_aanvraagformulier-met-nieuwe-logo.pdf hebben verschillende elementen niet de juiste tag meegekregen in de codelaag. Daardoor is de structuur van de inhoud lastig te bepalen voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader. Een aantal voorbeelden:

• In www.raadvoorplantenrassen.nl/media/dvhjioo2/aanvraagformulier_amateurrassen_nl-1-met-nieuwe-logo.pdf staat op pagina 2 een opsomming waarin elk item als aparte lijst is opgemaakt (bijvoorbeeld 'I' met sub-items 'a' en 'b', en de items 'II' en 'III'.). Maak deze items op als lijst-items binnen één lijst.
• Het document www.raadvoorplantenrassen.nl/media/dvhjioo2/aanvraagformulier_amateurrassen_nl-1-met-nieuwe-logo.pdf bevat meerdere stappen die visueel onderscheiden zijn door een streep. Geef de visueel herkenbare koptekst bij de verschillende stappen (bijvoorbeeld 1. Aanvragers(s): Indien meerdere aanvragers:..) de juiste tag (bijvoorbeeld h2), en maak de kop die bovenaan in het document staat ('Aanvraag tot toelating...') op met de h1-tag.
• Het document www.raadvoorplantenrassen.nl/media/c1mdnjku/handleiding_aanvraagformulier-met-nieuwe-logo.pdf bestaat uit een opsomming van de punten 'a' tot en met 'p'. Zorg dat deze opsomming als zodanig kan worden voorgelezen door hulpsoftware, door deze te taggen als lijst met lijst-items. x

Het Word-document www.raadvoorplantenrassen.nl/media/hsbncjw2/naamsvoorstelform-nl_-3-met-nieuw-logo.docx, dat zich bevindt op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/naamsvoorstelformulier/, is niet toegankelijk opgemaakt. Hierdoor kan de structuur van de informatie onduidelijk zijn voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader. Een aantal voorbeelden:

• Het document bevat een lijst met items '1' tot en met '7'. Maak dit op als daadwerkelijke genummerde lijst.
• De tabellen bevatten geen kopcellen die de datacellen beschrijven. Zorg ervoor dat kopcellen in een tabel als zodanig zijn opgemaakt.
• De kop 'BETREFT: voorstel voor een rasbenaming' is niet als kop opgemaakt, waardoor deze voor hulpsoftware niet als zodanig herkenbaar is. Zorg ervoor dat koppen op de juiste manier worden opgemaakt, wat deze kop betreft bijvoorbeeld als 'Kop 1'.

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 kopstructuur belangrijk, omdat een lijst van koppen opgevraagd kan worden en op die manier genavigeerd kan worden. Zorg voor een goede koppenstructuur, die begint bij een kopniveau h1 voor de titel van de pagina (gebruik dit kopniveau eenmalig per pagina), kopniveau h2 voor de koppen, kopniveau h3 voor de tussenkoppen, etcetera. Sla hierbij geen koppen over.

Een aantal voorbeelden van een onjuiste koppenstructuur zijn:

• Op pagina www.raadvoorplantenrassen.nl/nl/contact/ volgt een kop op kopniveau h4 op een kop op kopniveau h1, hierbij worden kopniveau h2 en h2 overgeslagen.
• Op pagina www.raadvoorplantenrassen.nl/nl/zoeken/ komen twee koppen op kopniveau h1 voor, en wordt kopniveau h2, h3 en h4 overgeslagen.
• Op pagina www.raadvoorplantenrassen.nl/nl/herregistratie/ zijn kopniveau's niet in de juiste volgorde gebruikt (h4 volgt op h1, waarna h3 en dan h2 volgt).

Advies: Op alle pagina's zijn in de footer de koppen 'Contact' en 'Direct regelen' opgemaakt op kopniveau h5. Hierdoor kan voor bezoekers die met hulpsoftware zoals een screenreader navigeren via de koppenstructuur, de indruk ontstaan dat het hier gaat om subkoppen van de laatste kop die in de content staat (op de homepagina www.raadvoorplantenrassen.nl/nl is dit bijvoorbeeld de kop 'Over de Raad voor plantenrassen') terwijl deze de koppen in de footer niet beschrijft. Omdat het belangrijk is dat koppen de bijbehorende content (die ook uit subkoppen met content kan bestaan) goed beschrijven, kunnen deze koppen beter worden opgemaakt op een ander kopniveau zoals bijvoorbeeld h2.

Uitkomst: Onvoldoende

Bevindingen: Op pagina www.raadvoorplantenrassen.nl/nl staan onder de kop 'Actueel' links naar nieuwsberichten. In het div-element waarin deze link staat, staan meerdere elementen niet in de juiste volgorde. De afbeelding staat vooraan, daarna de tekst 'Nieuwsbericht' en dan de kop (bijvoorbeeld 'Gazette van de Raad voor plantenrassen februari 2024'). Als de nieuwsberichten achter elkaar worden voorgelezen is het niet duidelijk bij welke kop de afbeelding hoort. Zet de koppen vooraan in de HTML-code en zet hierachter de afbeelding. Visueel mag deze indeling wel aangehouden worden. Dit komt op meerdere pagina's voor, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/ bij alle nieuwsberichten onder de kop 'Nieuws' en op www.raadvoorplantenrassen.nl/nl/actueel/themas/ bij alle berichten onder 'Thema's'.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: In de footer op onder andere pagina www.raadvoorplantenrassen.nl/ zijn de links 'Disclaimer' en 'Privacyverklaring' te zien in een grijs (HEX #A4B3AE) lettertype. Deze kleur heeft onvoldoende contrast met de groene (HEX #0A6D4A) achtergrond, en is daardoor door sommige bezoekers slecht te zien De contrastverhouding is 2.9:1 waar deze minimaal 4.5:1 moet zijn.

Als de focus in de footer op de links onder de kop 'Direct regelen' valt (bijvoorbeeld 'Kwekersrecht en toelating'), wijzigt de tekstkleur naar oranje (HEX #DF5C1E). Deze kleur heeft onvoldoende contrast met de groene (HEX #0A6D4A) achtergrond. Daardoor is de tekst voor sommige bezoekers niet te lezen als de focus hierop staat. De contrastverhouding is 1.7:1 waar deze minimaal 4.5:1 moet zijn. Ditzelfde probleem doet zich voor in het kader met dezelfde groene kleur 'Direct regelen' dat op meerdere pagina's te vinden is, bijvoorbeeld www.raadvoorplantenrassen.nl/nl/herregistratie/ en www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/tarievenlijst/.

Op pagina www.raadvoorplantenrassen.nl/nl staat de oranje (HEX #DF5C1E) knop 'Naar nationaal rassenregister'. De witte tekst op deze knop heeft onvoldoende contrast met de achtergrondkleur, de contrastverhouding is 3.6:1. Als de muisaanwijzer naar de knop wordt gebracht wordt de achtergrondkleur van de knop licht-oranje (HEX E47440) en heeft een contrastverhouding van 3:1 met de witte tekst. Zorg dat de contrastverhouding altijd minimaal 4.5:1 is.

Als op pagina www.raadvoorplantenrassen.nl/nl/ de focus of muisaanwijzer naar de links in het grijze (HEX #F4F2F2) vlak onder de kop 'Direct regelen' wordt gebracht (bijvoorbeeld 'Kwekersrecht en toelating'), wijzigt de tekstkleur naar oranje (HEX #DF5C1E). Het contrast tussen deze kleuren is onvoldoende. De contrastverhouding is 3.3:1 waar deze minimaal 4.5:1 moet zijn. Op de Engelstalige homepagina www.raadvoorplantenrassen.nl/en doet zich hetzelfde probleem voor op dezelfde plek bij de links onder de kop 'Arrange immediately'.

Als op pagina www.raadvoorplantenrassen.nl/nl/contact/ de focus of muisaanwijzer naar de links onder de kop 'Vragen en opmerkingen' wordt gebracht (bijvoorbeeld 'teamsupport@rasraad.nl'), wijzigt de tekstkleur naar oranje (HEX #DF5C1E). Deze kleur heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 3.6:1 waar deze minimaal 4.5:1 moet zijn. Dit probleem doet zich ook bij links op andere pagina's voor, bijvoorbeeld de link 'Terug naar Aanvraagformulieren en protocollen' op pagina www.raadvoorplantenrassen.nl/nl/zoeken-in-onderwerp en de links 'Naar de tarievenlijst en 'Meer over de status van uw aanvraag' op pagina www.raadvoorplantenrassen.nl/nl/actueel/.

Als op pagina www.raadvoorplantenrassen.nl/nl/contact/ de focus of muisaanwijzer naar de links 'Meer over de Raad' en 'Meer over de nieuwsberichten' wordt gebracht, wijzigt de tekstkleur naar oranje (HEX #DF5C1E). Deze kleur heeft onvoldoende contrast met de lichtgroene (HEX #E6F0EC) achtergrond. Hierbij is de contrastverhouding 3.1:1, deze moet minimaal 4.5:1 zijn. Dit probleem doet zich ook bij links op andere pagina's voor, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/nl bij onder andere de link 'Hennep'.

Op pagina www.raadvoorplantenrassen.nl/ is bij de nieuwsberichten onder de kop 'Actueel' een datum te zien in een grijs (HEX #999999) lettertype. Deze kleur heeft onvoldoende contrast met de witte achtergrond. De contrastverhouding is 2.8:1 waar deze minimaal 4.5:1 moet zijn. Ditzelfde komt op meerdere pagina's voor, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/en onder de kop 'News' en op pagina www.raadvoorplantenrassen.nl/nl/zoeken-in-onderwerp onder de kop 'Aanvraagformulieren' (bij bijvoorbeeld de tekst 'Document | 17-02-2023').

Op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/gazette-van-de-raad-voor-plantenrassen-februari-2024/ is de datum '22 februari 2024' te zien op de afbeelding in de header. Het oranje (HEX #DF5C1E) lettertype valt op verschillende tinten groen, waarbij het contrast onvoldoende is. Bij de groentint HEX #153727 is de contrastverhouding bijvoorbeeld 3.5:1. Zorg dat de contrastverhouding overal minimaal 4.5:1 is.

Als bij een schermgrootte van 1280 bij 1024 pixels wordt ingezoomd tussen 175% en 250%, komt in de header op pagina www.raadvoorplantenrassen.nl/ de tekst 'Wij zijn er voor het verlenen van kwekersrecht en het toelaten van plantenrassen' op een ander deel van de achtergrondafbeelding te staan. Hierbij doen zich op verschillende punten contrastproblemen voor. Als bijvoorbeeld de witte tekst op de lichtgroene (HEX #8DD1BB) kleur valt is de contrastverhouding 1.7:1, als deze op de lichtgrijze (HEX #E5E9E8) kleur valt is het contrast 1.2:1. Zorg ervoor dat de tekst bij inzoomen altijd op een achtergrondkleur valt waarmee voldoende kleurcontrast (contrastverhouding van minimaal 4.5:1) is. Dit probleem doet zich ook voor als naast het inzoomen ook de regelhoogte, alinea- en tekstafstand wordt gewijzigd naar de waarden zoals beschreven voor succescriterium 1.4.12.

Op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/gazette-van-de-raad-voor-plantenrassen-februari-2024/ heeft de witte koptekst 'Gazette van de Raad...' op sommige punten onvoldoende contrast met de achtergrondkleuren van de afbeelding in de header, als de pagina op een klein scherm of in ingezoomde weergave bekeken wordt. Bij de grijsgroene (HEX #93A99B) kleur is de contrastverhouding bijvoorbeeld 2.5:1, en bij de gele (HEX #DBAE18) is dit 2:1. Omdat het om een groot lettertype gaat, moet de contrastverhouding minimaal 3:1 zijn. Een soortgelijk probleem doet zich voor in de header op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/nationale-rassenverkeerslijst/ bij de kop 'Nationale rassenverkeerslijst', die op sommige punten op een lichtbruine (HEX C0BBAA) achtergrondkleur valt en waarbij de contrastverhouding 1.9:1 is waar deze minimaal 3:1 moet zijn.

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina staat in de HTML-code in het head-element bij meta name="viewport" de volgende instelling: "user-scalable=no". Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Laat deze instelling weg.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina staat in de HTML-code in het head-element bij meta name="viewport" de volgende instelling: "user-scalable=no". Op mobiel of tablet kunnen bezoekers daarom in sommige gevallen niet inzoomen. Laat deze instelling weg.

Op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ kunnen dialoogvensters opengevouwen worden, bijvoorbeeld bij Harmen Harmsma. De tekst die in het dialoogvenster te vinden is verdwijnt uit beeld als de pagina vanaf 200% ingezoomd wordt bij een schermgrootte van 1280 bij 1024 pixels. Er verschijnt een verticale scrollbalk, maar daarmee kan de tekst niet volledig tevoorschijn worden gehaald. Zorg ervoor dat alle content beschikbaar blijft bij inzoomen.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/tarievenlijst/ staat onder het tabblad 'Overige' een tabel. De laatste kolom van deze tabel verdwijnt uit beeld als bij een schermgrootte van 1280 bij 1024% wordt ingezoomd tot 400%. Bij de tabellen in de andere tabbladen gaat dit wel goed en blijft alles in beeld. Zorg ervoor dat alle content beschikbaar blijft bij het inzoomen. Op een tabel mag een scrollbalk gebruikt worden, deze mag dan alleen op de tabel en niet op de hele pagina staan.

Uitkomst: Onvoldoende

Bevindingen: De transparant-oranje (dit is HEX #DEA68C op een witte achtergrond) focusrand van de zoek-knop die op elke pagina in het menu staat, heeft onvoldoende contrast met de witte achtergrond. Daardoor is het voor sommige bezoekers niet zichtbaar als de focus op deze knop staat. De contrastverhouding is 2.1:1 waar deze minimaal 3:1 moet zijn. Dezelfde knop staat op pagina www.raadvoorplantenrassen.nl/nl/zoeken/ in het lichtgroene (HEX #E6F0EC) vlak bij 'Gebruik de zoekfunctie'. Hier heeft de focusrand (HEX #D29F83) een contrastverhouding van 2:1 met de achtergrond, dit moet minimaal 3:1 zijn.

De focusrand van de knop 'Naar nationaal rassenregister' op de homepagina www.raadvoorplantenrassen.nl/nl/ heeft onvoldoende contrast met de achtergrond, waardoor het voor sommige bezoekers niet zichtbaar is als de focus op deze knop staat. De focusrand is transparant, waardoor de kleur afhankelijk is van de achtergrondkleur waar deze op staat. Het punt waarop het kleurcontrast het grootst is is wanneer de oranje (HEX #7B532C) rand op de donkere (HEX #052119) kleur staat. De contrastverhouding is hier 2.5:1, waar deze minimaal 3:1 moet zijn. Een soortgelijk probleem doet zich voor bij de focusrand van de knop 'Online aanvraag indienen', de contrastverhouding tussen de groene (HEX #205D44) kleur en de donkere (HEX #04271C) achtergrond is 2:1 waar deze minimaal 3:1 moet zijn. Ditzelfde probleem doet zich voor op de Engelstalige homepagina, www.raadvoorplantenrassen.nl/en.

Op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/ heeft de knop 'Bestanden zoeken' een groene (HEX #8BBAA9) focusrand. Deze kleur heeft onvoldoende contrast met de lichtgroene (HEX #E6F0EC) achtergrond. De contrastverhouding is 1.8:1 waar deze minimaal 3:1 moet zijn. Een soortgelijk probleem doet zich voor bij de uitvouwbare lijsten 'Selecteer' onder 'Onderwerp' en 'Type', hierbij is de focusrand lichtblauw (HEX #86B7FE) en heeft een contrastverhouding van 1.7:1 met de achtergrond.

Op meerdere pagina's komen links voor waarbij een icoon staat waaruit de bezoeker kan opmaken dat de link in een nieuw venster opent. De kleur van het transparante icoon heeft met elke achtergrondkleur onvoldoende contrast, waardoor de informatie die overgebracht wordt voor sommige bezoekers niet goed te zien is. Op witte achtergrond heeft de grijze (HEX #B2B2B2) kleur een contrastverhouding van 2.1:1, bijvoorbeeld op pagina www.raadvoorplantenrassen.nl/nl/contact/ bij de link 'Plan route'. Op groene (HEX #0A6D4A) achtergrond heeft het lichtgroene (HEX #549981) icoon een contrastverhouding van 1.8:1. Zorg dat het contrast overal minimaal 3:1 is.

Op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ kunnen dialoogvensters opengevouwen worden waarin een sluitknop ('Sluiten X') te vinden is. Bij portretfoto's met een lichte achtergrond ontstaat hier een contrastprobleem waardoor de sluitknop niet meer (goed) te zien is. Bijvoorbeeld bij Kees van Ettekoven, waar de witte content op de sluitknop op een lichtgrijze (HEX #F9F9FB) komt te staan. Hier is de contrastverhouding 1:1, waar deze minimaal 3:1 moet zijn.

Uitkomst: Onvoldoende

Bevindingen: Wanneer bezoekers op de pagina's de regelhoogte, alinea- en tekstafstand wijzigen naar de waarden zoals beschreven voor dit succescriterium, vallen de knop waarmee de taalinstelling gewijzigd kan worden en de zoekfunctie buiten beeld. Er verschijnt een horizontale scrollbalk (in de leesrichting) op de pagina, maar dat is geen toegankelijke oplossing. Zorg ervoor dat informatie beschikbaar en leesbaar blijft zonder dat daarbij een scrollbalk op de pagina verschijnt, ook wanneer bezoekers een eigen tekstopmaak toepassen.

Uitkomst: Onvoldoende

Bevindingen: Op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen staan onder 'Gebruik de zoekfunctie' knoppen waarop een vraagteken te zien is, zoals achter 'Trefwoord(en)'. Als de focus naar deze knop wordt gebracht verschijnt extra informatie, deze staat over andere content heen. Daarom is het belangrijk dat de extra informatie afgesloten kan worden via het toetsenbord, zonder de focus te verplaatsen. Dat is nu niet het geval. Los dit bijvoorbeeld op door een afsluitknop toe te voegen, of zorg dat het afgesloten kan worden met de Escape-toets.

Uitkomst: Onvoldoende

Bevindingen: Als de website op een klein scherm of in ingezoomde weergave bekeken wordt, is het menu samengevouwen onder een knop (hamburgermenu). Nadat dit menu opengevouwen is, is een afsluitknop zichtbaar (X). Deze knop is niet via het toetsenbord bereikbaar. Daardoor kunnen bezoekers die navigeren via het toetsenbord het menu niet via deze knop afsluiten, maar alleen door de escape-toets te gebruiken. Los dit op door de knop focusbaar en bedienbaar te maken via het toetsenbord.

De content in de dialoogvensters die op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ geopend kunnen worden bij de verschillende raadsleden (bijvoorbeeld 'Harmen Harmsma'), is lastig te bereiken en te bedienen via het toetsenbord. De focus kan bijvoorbeeld niet naar de afsluitknop ('sluiten X') gebracht worden. Deze kan alleen via de pijltjestoetsen bereikt worden, waarbij eerst de hele tekst doorlopen moet worden. Zorg ervoor dat de afsluitknop focusbaar en bedienbaar is via het toetsenbord, bijvoorbeeld door de knop op andere wijze op te maken. Zie succescriterium 2.4.3 en 4.1.2.

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op elke pagina ontbreekt een mechanisme om content die op elke pagina herhaald wordt (zoals het menu) over te slaan. Dit kan opgelost worden door een link op de pagina te plaatsen (skiplink) die de focus verplaatst naar de eerste unieke inhoud van de pagina. Deze link moet de eerste link van de pagina zijn (na de cookie-melding). Deze link mag standaard verborgen zijn voor bezoekers, maar moet zichtbaar worden als de focus er op komt wanneer met het toetsenbord wordt genavigeerd.

Uitkomst: Onvoldoende

Bevindingen: De PDF www.raadvoorplantenrassen.nl/media/dvhjioo2/aanvraagformulier_amateurrassen_nl-1-met-nieuwe-logo.pdf heeft geen documenttitel in de eigenschappen. Zorg voor een titel die de inhoud van het document beschrijft. Ditzelfde geldt voor de PDF www.raadvoorplantenrassen.nl/media/c1mdnjku/handleiding_aanvraagformulier-met-nieuwe-logo.pdf.

Uitkomst: Onvoldoende

Bevindingen: Op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ kunnen dialoogvensters geopend worden, bijvoorbeeld bij 'Harmen Harmsma'. Als dit dialoogvenster geopend is, kan de bezoeker via de tabtoets de focus verplaatsen naar andere elementen op de pagina, waarvan een deel op dat moment bedekt wordt door het geopende dialoogvenster. Pas de focus volgorde aan zodat overige elementen op de pagina pas bereikt kunnen worden na het afsluiten van het dialoogvenster, en zorg dat de sluitknop focusbaar is. Zie succescriterium 2.1.1 en 4.1.2.

Uitkomst: Onvoldoende

Bevindingen: Op onder andere pagina www.raadvoorplantenrassen.nl/nl is bovenaan het logo te zien, dit is een afbeelding die in een link naar de homepagina staat. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is het linkdoel onduidelijk, doordat een linktekst ontbreekt. Los dit bijvoorbeeld op door een tekst zoals 'Raad voor plantenrassen logo, ga naar homepagina' toe te voegen bij het alt-attribuut van de afbeelding met het logo. Zie succescriterium 1.1.1 en 4.1.2.

Op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ staan links waarmee een dialoogvenster geopend kan worden, bijvoorbeeld 'Harmen Harmsma'. Een toegankelijke naam ontbreekt en het href-attribuut is leeg, waardoor hulpsoftware zoals een screenreader niet de juiste naam van de link kan afleiden. Los dit bijvoorbeeld op door een aria-label toe te voegen met daarin de tekst die in de h3-kop die bij de link hoort staat.

Op de homepagina www.raadvoorplantenrassen.nl/nl staan onder 'Actueel' artikelen die een link bevatten met de tekst 'Lees meer'. Deze linktekst maakt het linkdoel onvoldoende duidelijk. Omdat de link niet in de paragraaf (<p>) staat waar deze bij hoort, is er voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader ook geen context waaruit het linkdoel kan worden opgemaakt. Een mogelijke oplossing is het toevoegen van een aria-label met daarin de koptekst van het nieuwsbericht waar de link bij hoort. Dit komt op meerdere pagina's voor, bijvoorbeeld www.raadvoorplantenrassen.nl/nl/actueel/ en www.raadvoorplantenrassen.nl/nl/actueel/nieuws/. Op pagina www.raadvoorplantenrassen.nl/en komt een soortgelijke situatie voor bij de links 'Read more'.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: In het menu staat een knop waarmee de bezoeker de taal van de pagina kan wijzigen. Deze knop heeft de tekst 'public NL' als label, als de pagina op Nederlands is ingesteld. Bezoekers die gebruik maken van hulpsoftware zoals een screenreader krijgen deze tekst voorgelezen bij de knop. Omdat de tekst de functie van de knop niet duidelijk beschrijft, is het voor deze bezoekers mogelijk onduidelijk dat zij hier de taal kunnen wijzigen. Pas de tekst aan, kies voor een Nederlandstalige tekst en zet de tekst die visueel op de pagina zichtbaar is ('NL') vooraan. Op die manier kunnen ook bezoekers die gebruik maken van spraaksoftware de knop goed aanspreken en bedienen.

Op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/gazette-van-de-raad-voor-plantenrassen-februari-2024/ staan meerdere koppen die dezelfde tekst bevatten; 'Gazette van de Raad voor plantenrassen februari 2024'. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader en die navigeren via de koppenstructuur, is het belangrijk dat zij aan de hand van de koptekst kunnen afleiden waar zij bepaalde content kunnen vinden op de pagina. Daarom is het belangrijk dat elke kop uniek is en de bijbehorende content goed beschrijft. Pas de kopteksten aan zodat deze uniek zijn.

Uitkomst: Onvoldoende

Bevindingen: Als de website op een klein scherm of in ingezoomde weergave bekeken wordt, is het menu samengevouwen onder een knop (hamburgermenu). Als de focus via het toetsenbord naar deze knop wordt gebracht, is dat niet zichtbaar. Voor bezoekers die kunnen zien en navigeren via het toetsenbord is het daardoor niet duidelijk waar de focus zich bevindt. Zorg ervoor dat het duidelijk zichtbaar is als de focus op de knop staat, bijvoorbeeld doormiddel van een focusrand.

Op pagina www.raadvoorplantenrassen.nl/nl/actueel/themas/ is de focus niet zichtbaar als deze op de verschillende thema's (links) valt, bijvoorbeeld 'Jaarverslagen'. Voor bezoekers die wel kunnen zien en navigeren via het toetsenbord is het daardoor lastig om te weten waar zij zich bevinden op de pagina. Los dit bijvoorbeeld op door een duidelijk zichtbare focusrand toe te voegen aan de links. Een soortgelijk probleem doet zich voor op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ bij de links waarmee een dialoogvenster met meer informatie over het betreffende raadslid geopend kan worden.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/ is de focus niet zichtbaar op de uitvouwbare knoppen op elk tabblad onder 'Veelgestelde vragen'. Daardoor is het niet duidelijk waar de focus zich bevindt. Voeg een duidelijk zichtbare focusrand toe.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op onder andere pagina www.raadvoorplantenrassen.nl/nl is de taalaanduiding van de hele pagina Engels. De pagina is echter in het Nederlands. Hierdoor leest hulpsofware zoals een screenreader de pagina niet met de juiste uitspraak voor, wat het lastig kan maken om de tekst te begrijpen. Los dit op door de taalaanduiding te vervangen door de Nederlandse, 'lang="nl"'.

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's staat in het menu een zoekfunctie, dit is een link die eruit ziet als een oranje knop waarop een vergrootglas te zien is. Voor bezoekers die gebruik maken van hulpsoftware is de naam 'search' te horen. Voor bezoekers die geen Engels spreken is deze tekst mogelijk onduidelijk. De taal die op de pagina gebruikt wordt is Nederlands, vervang de tekst van de knop door een Nederlandse tekst zoals bijvoorbeeld 'Zoeken'. Ditzelfde geldt voor de zoekfunctie in het uitgevouwen menu (hamburgermenu) dat te zien is als de pagina's op een kleiner scherm of ingezoomd bekeken worden.

Als op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ een dialoogvenster wordt geopend (bijvoorbeeld 'Harmen Harmsma'), is een sluitknop te zien. Deze heeft via een aria-label de naam 'Close' gekregen. Voor bezoekers die geen Engels spreken is hierdoor de functie van de knop onduidelijk. Vervang de tekst van het aria-label door een Nederlandstalige tekst, bijvoorbeeld 'Sluiten'.

Op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/ staat onder de nieuwsberichten een paginering met links naar de verschillende pagina's. Deze hebben via een title-attribuut de tekst 'Go to page 1' gekregen. Voor bezoekers die geen Engels spreken is deze tekst mogelijk onduidelijk. Vervang deze door een Nederlandstalige tekst.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op onder andere pagina www.raadvoorplantenrassen.nl/nl is bovenaan het logo te zien, dit is een afbeelding die in een link naar de homepagina staat. Doordat een linktekst ontbreekt, kan de naam van de link niet door software bepaald worden. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is hierdoor het linkdoel onduidelijk. Los dit bijvoorbeeld op door een tekst zoals 'Raad voor plantenrassen logo, ga naar homepagina' toe te voegen bij het alt-attribuut van de afbeelding met het logo. Zie succescriterium 1.1.1 en 2.4.4.

Als de website op een klein scherm of in ingezoomde weergave bekeken wordt, is het menu samengevouwen onder een knop (hamburgermenu). Deze knop heeft geen toegankelijke naam. Hierdoor is het voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader duidelijk dat zich hier een knop bevindt, maar niet waar de knop voor dient. Het menu is voor deze bezoekers hierdoor lastig vindbaar. Ook voor bezoekers die gebruik maken van spraaksoftware is het lastig om de knop aan te spreken en te bedienen. Voeg een naam toe die de functie van de knop beschrijft. Ook bij de afsluitknop (X) die in het menu te zien is nadat deze is opengevouwen, ontbreekt een naam.

Als de website op een klein scherm of in ingezoomde weergave wordt bekeken, is het menu samengevouwen onder een knop (hamburgermenu). De staat van deze knop (ingevouwen of uitgevouwen) wordt niet correct voorgelezen. Dit komt doordat het aria-expanded attribuut dat op de knop staat, de waarde 'true' heeft wanneer het menu is samengevouwen. Deze waarde zou op dat moment 'false' moeten zijn. Bezoekers die gebruik maken van hulpsoftware zoals een screenreader, krijgen hierdoor niet de juiste informatie voorgelezen. Het kan daardoor lastig zijn om het menu te bedienen en de menu-items te bereiken. Zorg dat het aria-expanded attribuut de juiste staat van de knop voorleest.

Als op pagina www.raadvoorplantenrassen.nl/nl/over-de-raad/samenstelling-van-de-raad/ een dialoogvenster wordt geopend (bijvoorbeeld 'Harmen Harmsma'), is een sluitknop te zien. Deze is opgemaakt als een link met het a-element, maar doordat hierin het href-attribuut ontbreekt wordt dit niet door hulpsoftware als link herkend en voorgelezen. Ook ontbreekt de functionaliteit die bij een link verwacht kan worden (zoals focusbaarheid). Maak de knop op andere wijze op zodat de functionaliteit van het element goed wordt voorgelezen door hulpsoftware, en deze te bereiken en bedienen is via het toetsenbord. Voeg bijvoorbeeld een linkdoel toe in HTML, via het href-attribuut. Of maak de knop op als knop, met het button-element. Zie succescriterium 2.1.1 en 2.4.3.

Op pagina www.raadvoorplantenrassen.nl/nl/kwekersrecht-en-toelating/ staan onder 'Veelgestelde vragen' onder alle tabbladen uitvouwbare knoppen. De staat van deze knoppen (samengevouwen of uitgevouwen) kan niet goed geïnterpreteerd worden door hulpsoftware zoals een screenreader, waardoor bij samengevouwen knoppen wordt voorgelezen dat de knop is uitgevouwen of bij uitgevouwen knoppen dat deze zijn samengevouwen. Dit komt doordat het aria-expanded attribuut niet goed is opgemaakt, deze bevat extra leestekens (aria-expanded=""false""). Pas dit aan naar aria-expanded="false" danwel aria-expanded="true".

Bij de links in de paginering onder de nieuwsberichten op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/ is visueel te onderscheiden welke link de huidige pagina betreft. Voor bezoekers die gebruik maken van hulpsoftware zoals een screenreader is niet niet af te leiden. Los dit op door bijvoorbeeld aria-current="page" toe te voegen.

Op pagina www.raadvoorplantenrassen.nl/nl/zoeken-in-onderwerp is naast 'Filter op trefwoord' een icoon te zien (tooltip) via welke de tekst 'Vul een trefwoord in om te zoeken binnen deze documenten' te zien is als de muisaanwijzer of toetsenbordfocus hier naartoe wordt gebracht. Deze informatie kan door hulpsoftware zoals een screenreader niet worden voorgelezen. Omdat dit element is opgemaakt als link naar de huidige pagina, met het a-element zonder toegankelijke linktekst, wordt in plaats daarvan de paginatitel voorgelezen. Maak de tooltip op andere wijze op, zodat de juiste tekst kan worden voorgelezen. Een soortgelijk probleem komt voor op pagina www.raadvoorplantenrassen.nl/nl/aanvraagformulieren-en-protocollen/, waar in de zoekfunctie ('Gebruik de zoekfunctie') drie tooltips staan (te herkennen aan iconen met daarop een vraagteken). Hier wordt in plaats van de tekst die verschijnt bij focus de tekst 'help' voorgelezen.

Advies: Op pagina www.raadvoorplantenrassen.nl/nl/actueel/nieuws/ staat onder de nieuwsberichten een paginering met links naar de verschillende pagina's. Op het nav-element waar deze links in staan staat- aria-label="...". Deze waarde wordt door hulpsoftware zoals een screenreader niet voorgelezen. Door de combinatie van het nav-element en de linkteksten is het voor de bezoeker wel duidelijk dat hier door pagina's genavigeerd kan worden, dus er kan voor gekozen worden het aria-label te verwijderen of de tekst van het aria-label te vervangen om aan dit navigatiesysteem een naam gegeven.

Uitkomst: Niet aanwezig