Rapport:
Audit digitale toegankelijkheid Architectenregister.nl

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina’s van https://www.architectenregister.nl staat in de header een logo dat is gecodeerd als een SVG-icoon zonder alternatieve tekst. Er is geprobeerd een alt-attribuut met de tekst "Logo Architectenregister" aan de SVG toe te voegen, maar dit is niet de juiste oplossing. Voor SVG-iconen moet een <title>-element worden gebruikt (als eerste onderliggende element van het svg-elemnet) om een toegankelijk alternatief te bieden.

Op alle pagina’s van https://www.architectenregister.nl verschijnt, bij inzoomen, een menuknop waarmee het mobiele menu wordt geopend. In dit menu bevinden zich links die submenu’s openen. Er zijn icoontjes die aangeven dat er submenu’s zijn. Er is geen tekstalternatief voor deze informatie. De aanwezigheid van deze submenu’s wordt niet aan de schermlezer doorgegeven. Dit kan worden opgelost door een verborgen tekst toe te voegen die alleen voor de schermlezer zichtbaar is.

Op pagina https://www.architectenregister.nl/nieuws ontbreken alt-attributen bij twee afbeeldingen in de eerste twee nieuwsberichten. Zonder een alt-attribuut leest de schermlezer de bestandsnaam voor, wat geen toegankelijke ervaring biedt. Voeg een alt-attribuut toe en laat deze leeg.

Op pagina https://www.architectenregister.nl/wie-wij-zijn staat een afbeelding van tekst. Het alt-attribuut is leeg. Een bezoeker die deze afbeelding niet kan zien, heeft geen toegang tot deze informatie. Voeg een tekst alternatief toe in het alt-attribuut.

Op de pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat in de header een logo met de volledige tekst "more app". De alternatieve tekst is echter slechts "Logo", waardoor niet alle informatie uit het logo wordt overgebracht. Dit moet worden aangepast, zodat gebruikers die het plaatje niet kunnen zien, de volledige tekst uit het logo kunnen horen.
Hetzelfde probleem doet zich voor bij een ander logo op deze pagina. De volledige tekst van het logo is "Architectenregister", maar de alternatieve tekst is "Door de gebruiker aangeleverde afbeelding". Dit is onvoldoende om de inhoud van het logo correct over te brengen. Zorg ervoor dat de alt-tekst de volledige tekst van het logo bevat.

Uitkomst: Niet aanwezig

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.architectenregister.nl/nieuws verschijnt bij inzoomen een filterknop. In de filters bevinden zich groepen met radioknoppen, maar de groepslabels "Disciplines" en "Type" zijn niet correct gekoppeld aan de bijbehorende selectievakjes. Hierdoor herkent de schermlezer de relatie tussen het groepslabel en de keuzevakjes (checkboxes) niet. De schermlezer leest alleen de individuele labels van elk keuzevakje voor, zonder context. Dit kan worden opgelost door gebruik te maken van <fieldset>- en <legend>-elementen. Andere oplossingen zijn ook mogelijk.

Op pagina https://www.architectenregister.nl/nieuws bevindt zich een paginering, maar deze is niet correct opgebouwd. De paginering staat in een lijst (<ul>), maar bevat directe kindelementen die niet zijn toegestaan, zoals <div> in plaats van <li>. Daarnaast wordt het huidige paginanummer visueel anders weergegeven dan de andere paginanummers, maar dit onderscheid ontbreekt in de HTML. Hierdoor kan een schermlezer deze informatie niet doorgeven aan de bezoeker. Dit kan worden opgelost door een verborgen tekst aan de link toe te voegen of door het aria-current-attribuut te gebruiken.

Op pagina https://www.architectenregister.nl/nieuws/geslaagde-bep-borrel-bij-het-architectenregister staan onder de kop "Geslaagde BEP borrel bij het Architectenregister" twee alinea’s tekst. In de HTML zijn deze alinea’s echter samengevoegd in één <p>-element. Visueel lijkt de tekst uit meerdere alinea’s te bestaan, met witruimtes ertussen. Deze structuur moet ook correct in de code worden weergegeven. Zorg ervoor dat elke alinea in een apart <p>-element wordt geplaatst, zodat het aantal visueel zichtbare alinea’s overeenkomt met het aantal <p>-elementen in de HTML.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e is de volgende tekst geen kop: "• gewaarmerkte kopie van …" en andere soortgelijke teksten. Toch is een <h4>-element gebruikt om de tekst een groter lettertype te geven. Het <h4>-element wordt hier niet betekenisvol gebruikt, maar puur voor visuele opmaak. Kop-elementen zijn bedoeld om structuur te geven aan de inhoud van een pagina. Mensen die schermlezers gebruiken, vertrouwen op koppen om efficiënt te navigeren en de opbouw van een pagina te begrijpen. Gebruik kop-elementen niet uitsluitend voor visuele opmaak, zoals een groter of vetgedrukt lettertype. Zorg ervoor dat teksten die in een kop-element staan daadwerkelijk een kop of tussenkopfunctie hebben. Op pagina https://app.moreapp.com/form/5f05d55b21d6d40809cc7545?id=fc1ff35a-dce5-464b-aa80-b1187d2ae6f7 staat de tekst “The start date of your BEP is the first day..”. Deze tekst is gemarkeerd met een h4-element terwijl het geen koptekst is. Zie ook andere teksten tussen de invoervelden.

Op pagina https://www.architectenregister.nl/privacy-en-cookies zijn de volgende koppen onjuist gemarkeerd met een <strong>-element: "Wat zijn cookies?", "Welke cookies gebruiken wij?", en andere. Het element strong is niet bedoeld om koppen mee te markeren. Dit moet altijd gedaan worden met een kop-element, zoals h2. Koppen zijn bedoeld om een tekst te structureren. Alleen als deze teksten als kop worden gemarkeerd met een kop-element, begrijpt hulpsoftware die betekenis. Het strong-element is wel geschikt om nadruk te geven aan enkele woorden of een zinsdeel.

Op pagina https://www.architectenregister.nl/privacy-en-cookies, onder de kop “Welke cookies gebruiken wij?”, staat een lijst met 3 items. De juiste markering ontbreekt.
Tekst die eruitziet als een opsomming, moet ook zo in de code worden gemarkeerd. Meestal is hier een knop voor in de content-editor in het CMS. Voor lijsten en opsommingen worden de HTML-elementen ol (lijst met cijfers) of ul (lijst met bullets) gebruikt. 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.

Op pagina https://www.architectenregister.nl/wie-wij-zijn staat een lijst met drie punten. In de HTML is deze lijst gemarkeerd als drie aparte lijsten (ul-elementen). Zorg ervoor dat de visuele structuur van informatie ook in de HTML dezelfde wordt.

Op pagina https://www.architectenregister.nl/wie-wij-zijn/team komt na <h3> “Medewerkers” een kop van een <h2> “Team Architectenregister”. Dit is geen logische gebruik van headigs-elementen. Onder het h3-element mag een h4-element komen, of andere content, maar geen h2-element. Dit komt vaker op deze pagina voor.

Het PDF-document https://backend.architectenregister.nl/assets/pdf/2023-jaarverslag.pdf heeft geen codes en daardoor is voor hulpsoftware (zoals voorleessoftware) geen informatie beschikbaar om de PDF te interpreteren. Omdat codes ontbreken, kan de PDF niet volledig onderzocht worden (alle succescriteria met betrekking tot de PDF-codelaag, zoals semantische koppen en alternatieve teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.

In het PDF-document https://backend.architectenregister.nl/assets/algemeen/privacystatement-250109.pdf zijn alle koppen niet gemarkeerd als koppen. Bijvoorbeeld: op pagina 1, “PRIVACYSTATEMENT”, “Persoonsgegevens waarvoor wij verantwoordelijk zijn” en andere. Op deze manier verschilt de visuele informatiestructuur van de structuur van het document in de tags. Vervang de p-tag door de h-tag om de structuur van het document in de tags te laten overeenkomen met wat te zien is in het document.

Uitkomst: Onvoldoende

Bevindingen: Op de homepage https://www.architectenregister.nl, onder de koppen "Cursusaanbod" en "Events", is de leesvolgorde in de nieuwsberichten niet logisch. Datums en begeleidende tekst staan boven de artikelkoppen, waardoor het bij voorlezen van boven naar beneden onduidelijk is bij welk artikel deze informatie hoort. Dit probleem ontstaat doordat de koppen niet bovenaan in de HTML-code van elk artikel staan. Dit kan verwarrend zijn voor bezoekers die een schermlezer gebruiken. De oplossing is om alle inhoud die bij een bepaalde kop hoort, in de code direct onder die kop te plaatsen. Dit zorgt voor een logische structuur, terwijl de visuele vormgeving ongewijzigd kan blijven. Hetzelfde probleem komt voor op de pagina’s https://www.architectenregister.nl/nieuws en https://www.architectenregister.nl/wie-wij-zijn/team. Daar bevinden zich afbeeldingen boven de koptekst, en deze afbeeldingen hebben alt-teksten. Hierdoor worden ze door schermlezers voorgelezen voordat de kop zelf wordt bereikt, wat de navigatie minder intuïtief maakt.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op de pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier met invoervelden die persoonlijke informatie verzamelen, zoals “Persoonlijk e-mailadres”. Het autocomplete-attribuut heeft de waarde “off”. Kan een bezoeker in een formulier persoonlijke gegevens invullen zoals achternaam, e-mailadres of telefoonnummer? Dan moeten deze invoervelden het autocomplete-attribuut hebben. Hierdoor kunnen browsers en hulpsoftware helpen bij het invoeren. Bijvoorbeeld door de velden al automatisch in te vullen. Gebruik het autocomplete-attribuut voor alle velden waar persoonlijke informatie in moet worden gevuld. Voor het e-mailadres moet bijvoorbeeld autocomplete="email" worden gebruikt.
Op deze pagina staat meer informatie over autocomplete en welke waardes verplicht gebruikt moeten worden: https://www.w3.org/Translations/WCAG22-nl/#input-purposes.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier. Aangepaste toetsenbordfocus is toegepast op de knop “Akkoord”. De toetsenbordfocus verandert de randkleur van de knop van grijs (HEX#E8EAED) naar lichtblauw (HEX#5392F7). Het gebruik van kleur als enige manier om de locatie van de toetsenbordfocus aan te geven voldoet niet aan dit succescriterium. Voor bezoekers met een visuele beperking of kleurenblindheid is zo’n subtiele kleurverandering vaak niet duidelijk genoeg. En ook mensen die met het toetsenbord navigeren moeten goed kunnen zien waar op de pagina ze zijn. Daarvoor moet er een duidelijk zichtbare focusindicator zijn. Hiervoor kan het beste een extra visuele aanduiding toegevoegd worden. Denk aan een dikkere rand, een onderstreping of een verandering van achtergrond.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op de homepage https://www.architectenregister.nl, onder de kop "Actualiteiten", hebben de teksten "Nieuws" en "Lees meer" een te laag kleurcontrast van 4,2:1. De tekstkleur is zwart (HEX #0F0F0F) en de achtergrondkleur is bruin (HEX #87725F). Dit contrast voldoet niet aan de minimale WCAG-richtlijn voor niveau AA, waarbij een contrastverhouding van minstens 4,5:1 vereist is voor standaard tekst.

In de footer van elke pagina op https://www.architectenregister.nl staan links die blauwe (HEX #4171D3) tekst krijgen wanneer een bezoeker de muis over de link beweegt. Het kleurcontrast op de zwarte (HEX #0F0F0F) achtergrond wordt 4,1:1. Dit moet minimaal 4,5:1 zijn.

Wanneer op de homepage https://www.architectenregister.nl 400% wordt ingezoomd, verandert het hoofdmenu in een knop met horizontale lijntjes. Als een bezoeker op deze knop klikt en vervolgens op het menu-item “Ik zoek een architect”, opent een extra venster met een blauwe achtergrond en witte tekst. Slechts een deel van dit venster heeft de blauwe achtergrond. Vanaf de checkbox “Registratienummer” wordt de achtergrond wit waardoor het kleurcontrast 1,1:0 wordt. Zorg ervoor dat de achtergrond even groot als het venster blijft.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier waarin sommige invoervelden placeholder-tekst bevatten met instructies voor correcte invoer. Een voorbeeld hiervan is het veld "Telefoon", waar het telefoonnummerformaat "+31 (0)" wordt weergegeven. De placeholder-tekst heeft een te laag kleurcontrast van 2,5:1. De tekstkleur is grijs (HEX #9CA3AF) en de achtergrondkleur is wit (HEX #FFFFFF). Omdat deze tekst kleiner is dan 24px en niet vetgedrukt, moet het contrast minimaal 4,5:1 zijn. Zie ook https://app.moreapp.com/form/5dc0453f4b04b2000181176e?id=ac92f78d-c806-421d-b39a-4eb5d6525d4c.

Op pagina https://www.architectenregister.nl/wie-wij-zijn/team staat informatie over de medewerkers. De namen van medewerkers, zoals "Jorrit Rosema", worden weergegeven in blauwe tekst (HEX #4171D3) op een lichtgrijze achtergrond (HEX #F7F6F1). Het kleurcontrast tussen de tekst en de achtergrond is 4,3:1, wat niet voldoet aan de minimale WCAG-richtlijn voor niveau AA. Voor standaard tekst is een contrastverhouding van minimaal 4,5:1 vereist om leesbaarheid en toegankelijkheid te garanderen.

Op pagina https://www.architectenregister.nl/wie-wij-zijn staat groene (HEX#00892F) tekst op een beide (HEX#F4F3ED) achtergrond. Het kleurcontrast is 4,2:1. Dit moet minimaal 4,5:1 zijn. Zie ook https://www.architectenregister.nl/nieuws/geslaagde-bep-borrel-bij-het-architectenregister.

Op pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect staat een slider met afbeeldingen en tekst onder sommige foto’s. De tekstkleur is grijs (HEX #838383) en de achtergrondkleur is lichtgrijs (HEX #F7F6F1). Het kleurcontrast tussen de tekst en de achtergrond is 3,5:1, wat onvoldoende is volgens de WCAG-richtlijnen. Omdat de tekst kleiner is dan 24px en niet vetgedrukt, moet het contrast minimaal 4,5:1 zijn om goed leesbaar te zijn voor gebruikers met een visuele beperking.

In het PDF-document https://backend.architectenregister.nl/assets/pdf/2023-jaarverslag.pdf zijn verschillende teksten met onvoldoende contrast. Op pagina 9 staat bruine tekst (HEX #AE6F27) op een witte achtergrond (HEX #FFFFFF), zoals in de zin "Alle (potentiële) opdrachtgevers … en landschap". Het kleurcontrast is 4,1:1, wat te laag is. Op pagina's 24-25 staat witte tekst (HEX #FFFFFF) op een groene achtergrond (HEX #35A938) met een contrast van 3,1:1. Op pagina 26 staat witte tekst (HEX #FFFFFF) op een lichtblauwe achtergrond (HEX #96BFE7) met een contrast van 1,9:1. Omdat deze teksten kleiner zijn dan 24px en niet vetgedrukt, moeten ze een contrastverhouding van minimaal 4,5:1 hebben. Om de leesbaarheid en toegankelijkheid te verbeteren, moeten de tekstkleur of achtergrondkleur worden aangepast om aan deze norm te voldoen.

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl, bij een schermresolutie van 1280 x 1024 en een zoomniveau van 200%, zijn de zoek-, inlog- en taalwisselknoppen in de header niet zichtbaar. Dit probleem wordt ook onder succescriterium 1.4.10 genoemd. Wanneer een bezoeker inzoomt tot 200% op een scherm van 1280 x 1024 pixels, moet de website volledig functioneel blijven.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e is in de <head>-sectie van de HTML-code de parameter user-scalable=no opgenomen. In sommige browsers kan deze instelling problemen veroorzaken als sterk wordt ingezoomd of als de pagina op een klein scherm wordt bekeken. Moderne browsers kunnen deze code negeren, maar het is alsnog aan te raden deze te verwijderen.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.architectenregister.nl/wie-wij-zijn staat een afbeelding van tekst. Als tekst als afbeelding wordt geplaatst, kunnen veel bezoekers er niets meer mee. Dit komt omdat ze de tekst in de afbeelding niet kunnen vergroten of aanpassen. Het is beter om deze tekst gewoon als normale tekst op de pagina te plaatsen. Op die manier kunnen mensen de grootte, kleur of het lettertype aanpassen zodat het voor hen leesbaarder wordt.

Uitkomst: Onvoldoende

Bevindingen: Er ontstaan problemen als een bezoeker inzoomt tot 400% op https://www.architectenregister.nl bij een scherm van 1280 bij 1024 pixels. Bij succescriterium 1.4.4 is al beschreven dat functionaliteit verloren gaat als tot 200% wordt ingezoomd. Dat gebeurt vanzelfsprekend ook als tot 400% wordt ingezoomd. Deze problemen zijn hier daarom niet nog een keer benoemd. Zorg dat de problemen niet alleen opgelost worden voor als tot 200% is ingezoomd, maar ook voor 400%.

Op alle pagina's van https://www.architectenregister.nl, bij een schermresolutie van 1280 bij 1024 en inzoomen tot 400%, is de volgende kop gedeeltelijk niet zichtbaar: “Bevorderen van het vakmanschap van ruimtelijk ontwerpers om de kwaliteit van onze leefomgeving te verbeteren”.

Wanneer de pagina https://www.architectenregister.nl/zoeken/?s=wer wordt bekeken bij een schermresolutie van 1280 bij 1024 en inzoomen tot 400%, overlapt de tekst “Lees meer” gedeeltelijk de tekst op de pagina. Bijvoorbeeld, “Wij onderscheiden ... en stedenbouwkundigen” en andere teksten.

Wanneer de pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect wordt bekeken bij een schermresolutie van 1280 bij 1024 en inzoomen tot 400%, is de linktekst “zoek een tuin- en landschapsarchitect” gedeeltelijk niet zichtbaar.

Uitkomst: Onvoldoende

Bevindingen: Op de homepage https://www.architectenregister.nl, onder de kop “Wettelijke titels mogen uitsluitend …”, is de focus op de link “Ik wil me registreren” een lichtblauwe (HEX#B6D5F5) rand. Het contrast tussen de focusrand en de lichtgrijze (HEX#F7F6F1) achtergrond is 1,4:1, terwijl dit minimaal 3:1 zou moeten zijn. Dit maakt het moeilijk of onmogelijk voor visueel beperkten en kleurenblinden om het onderscheid te zien. Gebruik een kleurencombinatie met voldoende contrast. Ditzelfde probleem doet zich voor op de pagina https://www.architectenregister.nl/wie-wij-zijn/contact met de link “contactformulier”, op de pagina https://www.architectenregister.nl/privacy-en-cookies met de link “Download privacystatement” en op de pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect met de links “Website NVTL” en “Zoek een tuin- en landschapsarchitect”.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier. De randen van invoervelden en radioknoppen hebben een te laag kleurcontrast: 1,2:1. De randkleur is lichtgrijs (HEX#E5E7EB), en de achtergrondkleur is wit (HEX#FFFFFF).
De randen van interactieve elementen zoals invoervelden moeten minimaal een contrast van 3,0:1 hebben met de achtergrond. Zie ook https://app.moreapp.com/form/5dc0453f4b04b2000181176e?id=ac92f78d-c806-421d-b39a-4eb5d6525d4c.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier. De knop om een land te selecteren opent een extra venster met een zoekveld. De rand van het invoerveld, het zoekicoon en de placeholdertekst hebben onvoldoende kleurcontrast. Het contrast tussen de lichtgrijze kleur (HEX#F3F4F6) en de witte achtergrond (HEX#FFFFFF) van de pagina is 1,1:1. Het contrast tussen grijs van het icoon en de tekst en de achtergrond van het invoerveld is 2,3:1. Dit moet minimaal 3,0:1 zijn voor de rand van het invoerveld tegen de witte achtergrond en het icoon tegen de grijze achtergrond en 4,5:1 voor de placeholdertekst tegen de grijze achtergrond.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.architectenregister.nl/nieuws staan filterknoppen. Wanneer een bezoeker de muis over deze knoppen beweegt, verschijnt extra content. Deze extra content bedekt informatie op de pagina, zoals bijvoorbeeld de kop “Geslaagde BEP borrel bij het Architectenregister”. De bezoeker moet de extra content makkelijk kunnen sluiten zonder de muis te gebruiken of de toetsenbordfocus te verplaatsen. Bijvoorbeeld door de Escape-toets in te drukken. Zo kan de bezoeker snel de extra informatie verbergen en doorgaan met de belangrijkste onderdelen van de pagina.

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.architectenregister.nl/nieuws staat een paginering. Deze paginering kan niet met het toetsenbord worden bediend. Bezoekers die op de website zonder een computermuis met alleen het toetsenbord navigeren moeten alle interactieve elementen kunnen bedienen. Zorg ervoor dat alle interactieve elementen met toetsenbord te bedienen zijn.

Op pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect staat een slider met afbeeldingen. Wanneer bezoekers de cursor over de slider bewegen, verschijnen knoppen met een pijlicoon om door de dia’s te scrollen en een knop met een “+” icoon om de afbeelding in een nieuw venster te openen. Deze knoppen zijn echter niet met het toetsenbord te bedienen.

Uitkomst: Voldoende

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl, in de footer, onder de tekst “Architectenregister”, staat een animatie van tekst die steeds verandert. Omdat de animatie automatisch beweegt, hebben bezoekers beperkte tijd om de tekst te lezen. Dit kan worden opgelost door een pauzeknop toe te voegen. Deze oplossing werkt ook voor het succescriterium 2.2.2.

Op pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect staat een carrousel met afbeeldingen die automatisch wisselen. Bij elke afbeelding staan ook teksten. Doordat de carrousel automatisch beweegt, hebben bezoekers beperkte tijd om de tekst te lezen. Dit zou opgelost kunnen worden door een pauzeknop toe te voegen. Dit is ook meteen een oplossing voor succescriterium 2.2.2.

Uitkomst: Onvoldoende

Bevindingen: Op de homepage https://www.architectenregister.nl, onder de kop, staat een video die automatisch afspeelt en niet gepauzeerd of gestopt kan worden. Het kan storend zijn voor mensen met een cognitieve beperking als een video op een website automatisch gaat spelen. De bewegende inhoud zorgt voortdurend voor afleiding terwijl ze de tekst op de pagina proberen te lezen. Daarom moet er een manier zijn waarmee bezoekers dit soort multimedia kunnen stoppen, pauzeren of verbergen. Dit geldt voor alle bewegende, knipperende, scrollende of automatisch actualiserende content die tegelijk met andere informatie wordt getoond, automatisch start en langer dan 5 seconden speelt.

Op alle pagina's van https://www.architectenregister.nl, in de footer, onder de tekst “Architectenregister”, staat een animatie van de tekst die verandert, die automatisch afspeelt en niet gepauzeerd of gestopt kan worden.

Op pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect staat een carrousel die elke paar seconden een nieuwe afbeelding toont. Deze carrousel kan niet worden gestopt, gepauzeerd of verborgen.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl ontbreekt de skiplink. Er moet een manier zijn om delen van een pagina over te slaan, zoals het navigatiemenu en andere elementen die op meerdere pagina’s terugkomen. Hiervoor wordt een skiplink gebruikt. Daarmee kunnen bezoekers vaste blokken met herhalende inhoud overslaan. Een skiplink moet de eerste link op de pagina zijn. Deze link mag verborgen zijn, maar moet zichtbaar worden zodra hij focus krijgt. Voeg een skiplink toe waarmee bezoekers herhalende delen van de pagina over kunnen slaan. Het gebruik van een h1-element op elke pagina zou dit probleem ook kunnen oplossen. Momenteel ontbreekt dit elementen op vele pagina’s van de steekproef.

Uitkomst: Onvoldoende

Bevindingen: De PDF-documenten https://backend.architectenregister.nl/assets/pdf/2023-jaarverslag.pdf en https://backend.architectenregister.nl/assets/algemeen/privacystatement-250109.pdf hebben geen documenttitel ingesteld in de bestandseigenschappen.
Een PDF-document moet een titel bevatten die duidelijk het onderwerp of het doel van het document beschrijft. Daarnaast dient deze titel in de titelbalk te worden getoond in plaats van de bestandsnaam. Dit is belangrijk voor bezoekers met verschillende beperkingen omdat het hen in staat stelt snel en gemakkelijk vast te stellen of de informatie in het document relevant is voor hen. Dit kan worden opgelost door dit aan te passen in de bestandseigenschappen van het bronbestand of van het PDF-document.

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl landt de toetsenbordfocus na de zoekknop op onzichtbare interactieve elementen in het zoekveld terwijl het gesloten is. Hetzelfde probleem is te zien na de menuknop in het mobile menu. Als bezoekers met het toetsenbord door de website navigeren, moeten de interactieve elementen zoals knoppen en links op een logische volgorde toetsenbordfocus krijgen. Logisch betekent dat het aansluit op de volgorde die de elementen hebben in de visuele vormgeving. Als de volgorde niet logisch en voorspelbaar is, kunnen bezoekers die alleen een toetsenbord gebruiken minder makkelijk door de pagina navigeren. Het gaat dan bijvoorbeeld om mensen met een motorische of visuele beperking of een leesstoornis. De toetsenbordfocus mag niet terechtkomen op onzichtbare interactieve elementen (links, knoppen, formuliervelden). Als dat wel gebeurt, kan een bezoeker ze onbedoeld activeren. Alleen elementen die zichtbaar zijn mogen dus toetsenbordfocus krijgen.

Op alle pagina’s van https://www.architectenregister.nl bevindt zich in de rechterbovenhoek een menu-knop. Wanneer een bezoeker met het toetsenbord navigeert en dit menu opent, komt de focus in het mobiele menu terecht. Echter, zodra het laatste item in het menu is bereikt, verschuift de focus naar de interactieve elementen op de pagina, terwijl het menu open blijft staan. Dit resulteert in een onlogische focusvolgorde. Terwijl het menu open is, moet de focus binnen het menu blijven en mag deze niet naar andere elementen op de pagina verschuiven. Dit helpt bezoekers om makkelijk door het menu te navigeren, zonder dat ze per ongeluk op iets anders klikken. Zorg ervoor dat de focus in het menu blijft totdat de bezoeker het menu sluit door op de sluitknop te klikken of de ESC-toets in te drukken. Een andere optie is om het menu automatisch te sluiten wanneer de focus het menu verlaat.

Op alle pagina’s van https://www.architectenregister.nl bevindt zich in de rechterbovenhoek een menu-knop om het mobile menu te openen. In het mobiele menu, hebben sommige links subitems. De focus komt terecht in de gesloten submenu’s. Deze volgorde van toetsenbordfocus is niet logisch.

Uitkomst: Onvoldoende

Bevindingen: In de header van https://www.architectenregister.nl staat een logo dat werkt als een link. Deze link heeft geen linkdoel. Hierdoor weten gebruikers van hulpsoftware niet naar welke pagina of inhoud de link leidt. Dit kan opgelost worden door een alternatieve tekst aan de afbeelding van het logo toe te voegen, of een tekst die alleen zichtbaar is voor schermlezers, zoals een aria-label. Zie ook succescriterium 1.1.1.

Op de homepage van https://www.architectenregister.nl staan links met de tekst “Toon alles”. Deze tekst verklaart niet waar de link naartoe leidt. Linkteksten die meerdere keren op een pagina voorkomen of nietszeggend zijn (zoals “Toon alles”), helpen niet bij het begrijpen welke bestemming deze links hebben. Zorg dat duidelijk is waar een link naartoe leidt, bijvoorbeeld door een tekst als ‘lees meer’ aan te vullen met de pagina titel. Als visueel duidelijk is bij welk onderdeel de link hoort, kan deze aanvullende tekst visueel verborgen worden.

Op pagina https://www.architectenregister.nl/nieuws/geslaagde-bep-borrel-bij-het-architectenregister, staat een link “← Actualiteiten”. Visueel is het duidelijk dat de link naar de vorige pagina “Actualiteiten” leidt, maar voor schermlezergebruikers wordt “left arrow Actualiteiten” voorgelezen. Het doel van de link is niet duidelijk. Hetzelfde probleem doet zich voor op de pagina https://www.architectenregister.nl/wie-wij-zijn/publicaties/jaarverslag-2023.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een logo dat als een link werkt. De zichtbare tekst van de link is “more app”. De toegankelijke naam is “Logo”. Het doel van de link is niet duidelijk.

Advies. Op pagina https://www.architectenregister.nl/nieuws staat paginering. Deze functionaliteit bestaat momenteel uit niet interactieve elementen. Wanneer deze elementen in links worden omgezet om dit toegankelijker te maken, ontstaat een ander probleem: de linktekst die uit cijfers bestaat is niet voldoende om het linkdoel duidelijk te maken. Voor ziende bezoekers is het duidelijk dat dit paginanummers zijn, maar voor slechtziende bezoekers en bezoekers die een schermlezer gebruiken, is het niet het geval. Dit kan verbeterd worden door de linkteksten aan te vullen met het (visueel verborgen) woord ‘pagina’.

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://www.architectenregister.nl/nieuws, staan filterknoppen die extra content openen en sluiten. De toegankelijke namen van deze knoppen, “Toon Disciplines” en “Toon Type,” blijven ongewijzigd wanneer de functie van de knop verandert. Wanneer de filterknop opengeklapt is, moet dit ook duidelijk zijn voor de schermlezer. Dit kan worden opgelost door de naam van de knop te veranderen of een aria-expanded attribuut toe te voegen.

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl, in de header, staat een select-element voor taalkeuze met de tekst “Taal”. De toetsenbordfocus is niet zichtbaar op dit select-element. Er wordt geen aangepaste alternatieve oplossing geboden. De toetsenbordfocus moet altijd zichtbaar zijn op interactieve elementen zoals links, knoppen en invoervelden die met het toetsenbord focus kunnen krijgen. Bezoekers die met het toetsenbord navigeren moeten goed kunnen zien waar op de pagina ze zijn. Anders weten ze niet op welk moment ze op Enter moeten drukken om een knop of link te bedienen.

Uitkomst: Niet aanwezig

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl, in de header, staat een logo. Deze afbeelding werkt als een link. De zichtbare tekst is “Architectenregister”. Er is geen toegankelijke naam. De toegankelijke naam van de link is dus niet hetzelfde als de zichtbare tekst in het logo. Daardoor werkt de link niet als deze met een stemgestuurd systeem wordt geactiveerd. Daarvoor spreekt de bezoeker de tekst uit die zichtbaar is in het logo. Als de toegankelijke naam anders is, zal het systeem de link niet herkennen. Zorg daarom dat de tekst die in het logo zichtbaar is voorkomt in de toegankelijke naam, het liefst vooraan.

Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e, staat een logo dat als een link fungeert. De zichtbare tekst van de link is “more app”. De toegankelijke naam van de link is “Logo”. Deze link is niet met stem te bedienen. Zorg dat de zichtbare tekst terugkomt in de toegankelijke naam, het liefst vooraan.

Uitkomst: Niet aanwezig

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl ontbreekt het lang-attribuut in het HTML-element. Wanneer het lang-attribuut ontbreekt, kan voorleessoftware de pagina niet in de juiste taal voorlezen. De software weet dan niet wat de primaire taal van de pagina is. Zorg ervoor dat het lang-attribuut aanwezig is en dat het de correcte taalcode van de pagina bevat.

In de metadata van het PDF-document https://backend.architectenregister.nl/assets/pdf/2023-jaarverslag.pdf is de taal ingesteld op "en-GB". Dit is onjuist, aangezien de taal van het document Nederlands is. Hierdoor leest de schermlezer het document voor met Engelse uitspraakregels, wat de toegankelijkheid voor blinde gebruikers bemoeilijkt. Verander de taalcode naar "nl".

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://app.moreapp.com/form/5f05d55b21d6d40809cc7545?id=fc1ff35a-dce5-464b-aa80-b1187d2ae6f7 is de taal van de pagina correct ingesteld op “en”. De inhoud van de pagina is in het Engels, behalve het kopje “Beroepservaringsperiode zelfstandige route ENG”. Deze tekst moet een lokaal taalattribuut krijgen: lang=”nl”. Zonder dit attribuut wordt deze tekst met de Engelstalige uitspraakregels voorgelezen.

De foutmeldignen die in het formulier op pagina https://app.moreapp.com/form/5f05d55b21d6d40809cc7545?id=fc1ff35a-dce5-464b-aa80-b1187d2ae6f7 worden gegenereerd zijn in het Nederlands. Deze teksten moeten een taalswitch krijgen. Een betere oplossing is deze teksten in de taal van de pagina te vertalen.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op pagina https://app.moreapp.com/form/5dc0453f4b04b2000181176e staat een formulier. Wanneer het formulier wordt ingediend met lege velden of onjuiste gegevens, verschijnen foutmeldingen met de tekst “Dit veld 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."

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Onvoldoende

Bevindingen: Op alle pagina's van https://www.architectenregister.nl, in de header, staat een logo. Deze afbeelding werkt als een link. Deze link heeft geen toegankelijke naam. Hierdoor begrijpen bezoekers die een schermlezer gebruiken niet wat de bestemming of de functie is van de link. Geef deze link een toegankelijke naam die het doel van de link beschrijft.

Op alle pagina's van https://www.architectenregister.nl, in de header, staat een zoekknop die een zoekveld opent. Het zoekveld en de knop met het vergrootglas-icoon hebben geen toegankelijke naam. Hetzelfde probleem doet zich voor op de pagina https://www.architectenregister.nl/nieuws, onder het kopje “Actualiteiten”, in het zoekveld, met de knop met een vergrootglas.

Op alle pagina’s van https://www.architectenregister.nl verschijnt, bij inzoomen, een menuknop waarmee het mobiele menu wordt geopend. In dit menu bevinden zich links die submenu’s openen. Echter, de aanwezigheid van deze submenu’s wordt niet aan de schermlezer doorgegeven. Dit kan worden opgelost door een verborgen tekst toe te voegen die alleen voor de schermlezer zichtbaar is. Dit aspect is al benoemd onder succescriterium 1.1.1. Daarnaast moet de schermlezer ook de status van het submenu (open of gesloten) kunnen doorgeven aan blinde bezoekers. Dit kan worden opgelost door het aria-expanded-attribuut toe te voegen aan de link met het submenu. De waarde van dit attribuut moet automatisch veranderen zodra de zichtbaarheid van het menu wijzigt.

Op pagina https://www.architectenregister.nl/nieuws staan filterknoppen die extra inhoud openen en sluiten. De knop geeft de staat van dit paneel (open of gesloten) niet aan.
Hierdoor kan een schermlezer niet aan een blinde bezoeker vertellen of dit onderdeel geopend of gesloten is. Dit kan worden opgelost door een verborgen tekst of een aria-expanded-attribuut toe te voegen.

Op pagina https://www.architectenregister.nl/nieuws staat een paginering. De links in deze paginering hebben geen interactieve rol. Hetzelfde probleem doet zich voor bij het element met de tekst “Volgende”.

Op pagina https://www.architectenregister.nl/architect-worden/tuin-en-landschaps-architect staat onder de header een slider met afbeeldingen. Wanneer een bezoeker de cursor over de slider beweegt, verschijnen knoppen met een pijltje-icoon om door de slides te scrollen en een knop met een “+”-icoon om de afbeelding in een nieuw venster te openen. Deze knoppen hebben echter niet de juiste rol en naam.

Uitkomst: Voldoende