Toegankelijkheidsonderzoek WenS platform

Op de homepagina is een grote afbeelding te zien, die tekst bevat. Deze heeft geen alt-tekst. Afbeeldingen met tekst moeten altijd een tekstalternatief bevatten. Dit heeft impact op blinden en slechtzienden.

Bij het aanmaken van een nieuwe vacature, dien je een organisatie, onderdeel en functiefamilie te kiezen. Dan verschijnen er functierollen. Deze rollen zijn in een lijst opgemaakt. De rollen in die lijst ontvangen focus, maar dat gebeurt enkel door subtiele kleurverandering (wit naar lichtgrijs). Deze verandering is te subtiel voor slechtzienden en kleurenblinden.

Op de pagina met vacatureformulieren wordt oranje (HEX #e17000) tekst gebruikt op witte achtergrond. Dat geeft een contrastverhouding van 3,22:1, waar het minstens 4,5:1 moet zijn.

Bij een vacatureformulier zelf komt hetzelfde oranje (HEX #e17000) voor met grijze achtergrond (HEX #f3f3f3). Dat geeft een contrastverhouding van 2,92:1 waar het minstens 4,5:1 moet zijn.

Bij het bekijken van de sollicitanten op een vacature, komt de combinatie oranje met grijs (HEX #edf6ff) voor. Dit heeft een contrastverhouding van 2,94:1, waar het minstens 4,5:1 moet zijn.

Dit heeft impact op slechtzienden en kleurenblinden.

Bij het zoomen naar 200% op de pagina met vacatureformulieren, valt het overzicht met de vacatures weg. Hierdoor gaat er informatie ontbreken voor slechtzienden. Dit komt ook voor als je bij een vacature de lijst van kandidaten bekijkt.

Op de homepagina is een grote afbeelding te zien, die tekst bevat. Deze heeft geen alt-tekst. Dit heeft impact op blinden en slechtzienden. De tekst op de afbeelding kan met HTML en CSS verzorgd worden.

Bij het aanpassen van het browservenster naar 1280 bij 1024 pixels en inzoomen naar 400% is de afbeelding op de homepagina niet leesbaar meer. Die past zich niet aan, waardoor een hoop tekst afgekapt wordt. Dit heeft impact op slechtzienden die zoomen en hun browservenster aanpassen.

Bij het aanpassen van het browservenster naar 1280 bij 1024 pixels en inzoomen naar 400% ontstaan er op alle pagina's een horizontale scrollbalk en valt er tekst over elkaar heen. Dit bemoeilijkt het lezen en navigeren voor slechtzienden.

In een vacatureformulier kun je de kandidaten oproepen. Op dat tabblad verschijnen de kandidaten in een tabel. Klikken op een kandidaat opent een scherm met meer informatie. Met het tabben door de pagina krijgen de kandidaten in de tabel wel visueel focus, maar met het toetsenbord kun je niet de gegevens openen van die kandidaat of de knop met opties bereiken bij elke kandidaat

In een vacatureformulier kun je de kandidaten oproepen. Op dat tabblad verschijnen de kandidaten in een tabel. Er is ook een toggle "Sollicitantenwerkbench" aanwezig. Als deze wordt uitgeschakeld, veranderd de weergave van de pagina. Filters verschijnen boven de tabel in plaats val checkboxen aan de zijkant.

De Filters zijn een balk die automatisch scrollt bij hover met de muis. Items krijgen focus en zijn bedienbaar, maar niet alle filters zijn bereikbaar met het toetsenbord, er zijn filters links die niet in beeld zijn en die zijn ook niet in beeld te krijgen met het toetsenbord. Hierdoor is niet alle functionaliteit beschikbaar voor schermlezers of spraakbesturing.

Op elke pagina ontbreekt een mechanisme om de herhalende content over te slaan. Bezoekers die de website met toetsenbord bedienen en/of hulpsoftware moeten op elke pagina langs dezelfde onderdelen gaan voordat ze bij de inhoud van de pagina zijn.

Op de homepagina/dashboard hebben de knoppen in het blok "Snelle acties" geen visuele focus. Dit heeft impact op slechtzienden en mensen die geen muis voor navigatie kunnen gebruiken. Visueel moet zichtbaar zijn waar de focus is op de pagina.

In het vacatureformulier komt er een checkbox "Social media caption aanvragen" voor. Deze heeft geen label. Labels mogen niet ontbreken, omdat ze belangrijk zijn voor mensen die schermlezers of spraakbesturing gebruiken.

Bij het aanmaken van een vacature, als je deze gaat invullen, zijn er verplichte velden aanwezig. Deze zijn aangeduid met een asterisk. Bovenaan het formulier is er echter niet aangegeven dat verplichte velden zijn aangeduid. Dat heeft impact op mensen met cognitieve problemen en gebruikers van schermlezers.

Bij het aanmaken van een nieuwe vacature moet men een standplaats en postcode invullen. Er is echter geen foutsuggestie aanwezig, als je bijvoorbeeld een verkeerde postcode invult. Dit heeft impact op mensen met cognitieve of motorische problematiek en gebruikers van schermlezers.

De pagina vacatureoverzichten bevat een tabel. Deze tabel heeft kolommen die gesorteerd kunnen worden. Met de schermlezer wordt de functie en staat niet direct voorgelezen, dat gebeurt pas na het voorlezen dat er een knop is en een pauze. Dat er gesorteerd kan worden, wordt hierdoor gemist.

Het vacatureformulier zelf heeft diverse velden waarin gegevens aangepast kunnen worden, zoals het veld kwaliteitenprofiel. Dit is een keuzelijst. In de code is het een <input> met het attribuut aria-expanded. Dat attribuut mag echter niet gebruikt worden op een <input> volgens de ARIA-standaard.

Het vacatureformulier zelf heeft diverse velden waarin gegevens aangepast kunnen worden, zoals de velden "Selectiecommissie", "Recruiting team", "Toetser team" en "HR Admin team". Dit zijn invoervelden die comboboxen zijn geworden m.b.v ARIA. Echter ontbreken er een paar verplichte attributen: aria-expanded en aria-controls ontbreken.

Op het vacatureformulier zijn er tooltips beschikbaar, die uitleg of tips geven bij de verschillende velden. De tooltips in het blok "Procesbetrokkenen" hebben geen label. Knoppen moet een label hebben, zodat het doel en context duidelijk is bij een schermlezer en ze geactiveerd kunnen worden met spraakbesturing.

Op het overzicht van de sollicitanten voor een vacature, wordt een <header> gebruikt: <header class="ui5-dynamic-page-title-header-wrapper" id="ui5wc_37-header" aria-label="Kop weergegeven"><slot name="titleArea"></slot></header>.

Er is een aria-label attribuut aanwezig, wat niet gebruikt mag worden op generieke elementen zoals beschreven in de ARIA-standaard. Dit komt ook op de detailpagina voor van een kandidaat.

Als je de lijst van sollicitanten bekijkt van een vacature, is er een zijbalk om de lijst te kunnen filteren. Visueel zijn die filters allemaal checkboxen. Een schermlezer leest echter niet voor dat het checkboxen zijn. Hierdoor weet een gebruiker niet dat deze bedienbaar zijn.

Als je de lijst van sollicitanten bekijkt van een vacature, is er een zijbalk om de lijst te kunnen filteren. De items (checkboxen) zijn in de code opgemaakt als treeitem door middel van ARIA. Semantisch is dit niet juist. Het is gewoon groep checkboxen, geen uitklapbare lijst van termen of indelingen van groepen. Correct gebruik van semantiek en structuur is belangrijk om gebruikers van schermlezers een beeld te geven van de opbouw van een pagina en hoe deze te gebruiken.

Op de kandidatenpagina kan men zoeken en is er ook mogelijkheid om een talentenpool te maken. Er is daar ook een knop "Opgeslagen zoekopdrachten". Deze bevat een knop zonder tekst:

<span role="button" class="globalArrowColor sfTriangle globalIconFont1Support globalIconFont1 fd-button fd-button--compact fd-button--transparent fd-select__button fd-select__button--compact directionbottom" id="triangle_74:" onclick="juic.fire("74:","_click",event);" "=""><span class="legacyFont1Icon globalIconFont1 bottom"></span></span>.

Deze knop kan nu niet bediend worden met spraakbesturing en met een schermlezer is het doel en de context niet duidelijk van de knop.

Bij het aanmaken van een nieuwe vacature, dien je een organisatie, onderdeel en functiefamilie te kiezen. Dan verschijnen er functierollen. Deze rollen zijn in een lijst opgemaakt. Het klikken op een rol toont de voorbeeldvacature en de optie om de vacature aan te gaan maken., De lijst van functierollen is een listbox: <div id="18:_roleList" role="listbox" class="roleList">. De listbox heeft geen toegankelijke naam, wat impact heeft op schermlezers, maar het is vooral de verkeerde rol. Dit omdat er niet meerdere items geselecteerd kunnen worden, men kan maar een optie selecteren.

In een vacatureformulier kun je de kandidaten oproepen. Op dat tabblad verschijnen de kandidaten in een tabel. Er is ook een toggle "Sollicitantenwerkbench" aanwezig. Als deze wordt uitgeschakeld, veranderd de weergave van de pagina. Filters verschijnen boven de tabel in plaats val checkboxen aan de zijkant.

In die filterbalk boven de tabel, zijn er filters die opties hebben die uitgeklapt kunnen worden, aangegeven met een pijltje. Bijvoorbeeld de filter "selectiegesprek". De filter en het pijltje zijn aparte knoppen, waarbij de knop met het pijltje geen label heeft. Dit heeft impact op schermlezers en spraakbesturing.

Foutmeldingen of bijv. meldingen als veranderingen succesvol zijn opgeslagen, worden niet opgepikt door de schermlezer. Dit komt omdat er geen live region wordt gebruikt. Belangrijke informatie of feedback wordt hierdoor gemist. Dit speelt vooral bij foutmeldingen bij het aanmaken van een nieuwe vacature en het opslaan van voorkeuren.