Toegankelijkheidsonderzoek

Issues:
Content-audit digitale toegankelijkheid website Werken voor Groningen

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Werken voor Groningen
Datum 28 februari 2025
Scope van de website Binnen de scope van het onderzoek valt:
  • De content van alle pagina's op werkenvoorgroningen.nl.
  • Alle PDF's op werkenvoorgroningen.nl.
Buiten de scope van het onderzoek valt:
  • De techniek van alle pagina's op werkenvoorgroningen.nl. Dit is onderzocht bij het onderzoek "Systeemaudit digitale toegankelijkheid Softwareplatform Solutions Factory". Het onderzoek is te raadplegen op https://toegankelijkheidsrapport.swink.nl/softwareplatform-solutions-factory-hercontrole/.
  • Subwebsite(s) waarbij de HTML en/of het systeem afwijkt van de onderzochte website.
  • Alle externe systemen en websites waar via het onderzochte domein met een link naar wordt verwezen.
Conformiteitsdoel WCAG 2.1 niveau AA

Uitgebreide toetsresultaten

Aantal bevindingen: 12

1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 1: Op de hoofdpagina https://www.werkenvoorgroningen.nl/ staat het logo van "Werken voor Groningen". De afbeelding is van toegankelijke tekst in een alt attribuut voorzien die "logo" leest. Dit woord dient inderdaad deel te zijn van de alternatieve tekst, echter moet het tevens alle tekst bevatten die ook visueel te lezen is. Op meerdere andere pagina's dient het logo tevens als link naar de hoofdpagina, bijvoorbeeld op https://www.werkenvoorgroningen.nl/vacatures. Zorg dat aan de beschrijving tevens het linkdoel is toegevoegd, bijvoorbeeld "Logo Werken voor Groningen, ga terug naar de hoofdpagina".

Bevinding 2: Het hangslot-icoon in de footer op elke pagina van https://www.werkenvoorgroningen.nl/ wordt ingeladen als een icon font middels het span-element. Met aria-label wordt er geprobeerd een toegankelijke naam te geven. Echter, volgens de ARIA-standaard is het niet toegestaan om aria-label te gebruiken op div- en span-elementen te gebruiken. Geef icon fonts liever op de volgende manier een toegankelijke naam:
<span class="phone" aria-hidden="true"></span>
<span class="sr-only">Phone number</span>

Bevinding 3: Op vacaturepagina's zoals bijvoorbeeld https://www.werkenvoorgroningen.nl/vacatures/adviseur-woz--belastingen/0524a2b1-79b5-4546-bb13-292354cd2095, wordt met iconen het opleidingsniveau, salarisschaal en aantal uren geillustreerd. De iconen hebben alt-tekst, maar de alt-tekst begint altijd wel met "icoon voor". Het type afbeelding vernoemen in de alt-tekst is hier niet nodig en kan dus verwijderd worden.

Bevinding 4: Op de inlogpagina https://tsfloginportal.b2clogin.com/tsfloginportal.onmicrosoft.com/oauth2/v2.0/authorize?p=b2c_1a_27&client_id=2e1ba490-82d6-4703-b1a2-54b4c97e47de&nonce=default&redirect_uri=https%3A%2F%2Fwww.werkenvoorgroningen.nl%2Fsignin-oidc&scope=offline_access%20openid&response_type=code&prompt=login&state=2112b10d-cb68-47bf-afa6-9b0ec75ef722&client=8 heeft het logo in het inlogformulier als alt-tekst "logo". Dit woord dient inderdaad deel te zijn van de alternatieve tekst, echter moet het tevens alle tekst bevatten die ook visueel te lezen is. Pas de alt-tekst naar bijv. "Logo Werken voor Groningen".

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 5: Op pagina https://www.werkenvoorgroningen.nl/vacatures/medewerker-uitkeringsadministratie/9b2378e9-159b-4fed-96bf-244f42724bcf wordt veelvuldig gebruik gemaakt van linebreaks (br) om witruimte tussen platte tekst te creëren. Tussen de paragraaf "Je registreert, (her)berekent [...]" en "Dit krijg je van ons" bijvoorbeeld viermaal. Indien br-elementen elkaar opvolgen, kan het voorkomen dat hulpsoftware veelvuldig tussen de tekst content "leeg" voorleest, wat onnodige ruis veroorzaakt. Gebruik voor styling de opties die CSS biedt.
Het is overigens ook op te merken dat dit tevens ontstaat door shift+enter te gebruiken in tekstverwerkers zoals Microsoft Word. Correcte opmaak in Word, zoals positionering en gebruik van alternatieve teksten, kan over het algemeen tijdswinst opleveren bij content management. Het is ook goed om deze best practises voortdurend onder de aandacht te houden bij delen van de organisatie verantwoordelijk voor het aanleveren van content, mede door periodieke mutaties in het personeelsbestand.

Bevinding 6: Op pagina https://www.werkenvoorgroningen.nl/vacatures/inhoudelijk-coordinator-jeugd-en-leerlingzaken/4649dd73-f384-47a9-b2d5-d23423c8ddd2 staan meerdere visuele subkoppen, bijvoorbeeld "Jouw werkplek" en "Dit is wat we van je vragen", die in HTML middels het bold element (b) zijn opgemaakt. Gebruik hier kopelementen (h) van het daartoe bestemde niveau. Sommige bezoekers vragen de koppenstructuur op om efficient door pagina's te navigeren. Op meerdere vacaturepagina's komen in deze structuur slechts de functieomschrijving (h1), de contactpersonen (h2+h3), het sollicitatieformulier (h2+h3) en de interactieve footer-elementen (h2+h3) voor. Zorg dat alle visuele koppen ook als zodanig zijn opgemaakt in HTML.

Bevinding 7: Op pagina https://www.werkenvoorgroningen.nl/vacatures/inhoudelijk-coordinator-jeugd-en-leerlingzaken/4649dd73-f384-47a9-b2d5-d23423c8ddd2 worden delen van de tekstuele content gestyled middels het emphasis element (em). Bijvoorbeeld "De functie is in het kader van organisatieontwikkeling Nijambt volop in beweging. We verwachten een actieve rol van jou in het ontwikkelproces van de functie. Deze beschrijving is slechts een korte weergave van de huidige situatie." Dit element is bedoeld om de intonatie op bepaalde woorden te leggen, door de semantische waarde kan schermleessoftware dit vertraagd voorlezen. Maak gebruik van de stylingopties die CSS biedt.

Bevinding 8: Op pagina https://www.werkenvoorgroningen.nl/organisaties/gemeente-eemsdelta/4e6bf585-9612-43c3-06ea-08db3c11254d staat een opsomming onder "Wil jij werken bij een organisatie:", die niet als zodanig in HTML is opgemaakt. De content is in meerdere paragrafen (p) geplaatst. Maak gebruik van een ongeordende lijst (ul) met hierin de individuele lijstitems (li) genest. Plaats tevens de opsommingstekens niet als tekst.

Bevinding 9: Op pagina https://www.werkenvoorgroningen.nl/vacatures/consulent-inkomen/e6f7d0b0-3906-47b8-ae96-d3407429c7b4 staat een vijftallige opsomming onder "Dit ga jij doen als Consulent inkomen". Vier zijn correct opgemaakt als ongeordende lijst (ul) maar de eerste staat direct in de div erboven. Gebruikers van schermleessoftware horen dat er een viertallige lijst is, wat verwarrend kan zijn. Zorg dat dit correct is opgemaakt.

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Uitkomst: Onvoldoende

Bevinding 10: Op pagina https://www.werkenvoorgroningen.nl/contact staat witte tekst op een deels eucalyptusgroene achtergrond (HEX #7FC0C6). Er is hier sprake van 2,0:1 contrast waar het minimaal 4,5:1 behoort te zijn. Het probleem doet zich op meerdere pagina's voor in met verschillende contrastproblemen, zoals op https://www.werkenvoorgroningen.nl/vacatures. Zorg dat de achtergrondbeelden die voor de headers gebruikt worden, voldoende contrast hebben met de witte teksten, en borg dit integraal op alle pagina's van de website.

Bevinding 11: Op pagina https://www.werkenvoorgroningen.nl/contact staat een formulier. Indien velden niet zijn ingevuld, krijgt de placeholder een rode kleur (HEX #E00000) en ontstaat een foutmelding onder het lichtgrijze veld (HEX #E5E7EB). Dit levert een contrast van 4,0:1 op waar het minimaal 4,5:1 behoort te zijn. Pas de kleurencombinatie aan.

3. Begrijpelijk

3.1 Leesbaar

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 12: Op de diverse vacaturepagina's, bijvoorbeeld https://www.werkenvoorgroningen.nl/vacatures/inhoudelijk-coordinator-jeugd-en-leerlingzaken/4649dd73-f384-47a9-b2d5-d23423c8ddd2, bevindt zich een sollicitatieformulier. Bij de optie om een bestand te kiezen staat de tekst "no file chosen". Zorg dat dit onderdeel van Nederlandse tekst is voorzien, daar dit ook de taalinstelling betreft. Dit probleem doet zich ook voor indien men voor de optie "
Ik wil graag mijn motivatiebrief uploaden en als bijlage toevoegen" kiest.

Onderbouwing van de evaluatie

Het onderzoek is uitgevoerd op basis van de evaluatiemethode van het W3C, WCAG-EM. Dit gebeurt grotendeels handmatig door een steekproef te nemen. Voor een quickscan geldt dat we slechts delen uit deze methodiek gebruiken. Ondanks alle zorgvuldigheid en ervaring van de onderzoeker kan het voorkomen dat een probleem niet gesignaleerd is. Houd er rekening mee dat in een volgend onderzoek bepaalde onderdelen anders worden beoordeeld omdat technologieën en hulpsoftware worden doorontwikkeld. Bij het handmatig onderzoek wordt gebruik gemaakt van tools.

Steekproef getoetste webpagina's

Ondersteunende technieken

Bronnen

Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.

Geprint: 2025-03-09 23:00:19 v2.4-011