Toegankelijkheidsonderzoek

Issues:
Audit digitale toegankelijkheid website Winstuitjewoning.nl

(Alleen de bevindingen)

Scope van de evaluatie

Naam website Winstuitjewoning.nl
Datum 9 juni 2023
Scope van de website Binnen de scope van het onderzoek valt:
Buiten de scope van het onderzoek valt:
  • 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: 66

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 homepagina staan op twee plekken zoekbalken: één rechtsboven en één in het midden van de pagina. In deze zoekbalken wordt een afbeelding van een vergrootglas gebruikt. De alternatieve tekst is “search”. Het element waarin deze afbeelding zich bevindt, heeft een toegankelijke naam die ook “search” luidt. Nu hoort een blinde gebruiker twee keer “search”. Verberg de afbeelding bijvoorbeeld met role=”presentation” voor hulpsoftware.

Bevinding 2: In de footer van iedere pagina staat een logo met de alternatieve tekst “Winst uit je woning is ISO 27001 gecertificeerd”. De zichtbare tekst op het logo verschilt van deze verborgen tekst. Zorg ervoor dat zichtbare tekst van het logo wordt herhaald in de alternatieve tekst van de afbeelding.

Bevinding 3: Op pagina https://winstuitjewoning.nl/maatregelen/isolatieglas/ staat een video met een logo van Vimeo. Deze afbeelding is een svg-element met role=”img” zonder alternatieve tekst. Alle elementen met deze rol moeten een tekstalternatief krijgen. De afbeelding kan als decoratief worden gezien omdat het deel uitmaakt van een knop waar de toegankelijke naam “Watch on Vimeo.com” is. In dit geval kan role=”img” worden vervangen door role=”presentation”.

Bevinding 4: Op pagina https://winstuitjewoning.nl/contact/ staan onder kopjes “Service” en “Advies” iconen van een envelop en een telefoon. Deze iconen zijn onzichtbaar voor de screenreader. Deze iconen zijn informatief en hebben daarom een alternatieve tekst nodig.

Bevinding 5: Op pagina http://winstuitjewoning.nl/amsterdam/inkoopactie/ staat een logo van Gemeente Amsterdam. Deze informatieve afbeelding is verborgen voor hulpsoftware met een leeg alt-attribuut. Geef dit logo alt=”Gemeente Amsterdam”.

Bevinding 6: Op pagina https://aanmelden.winstuitjewoning.nl/ staat het logo van Winstuitjewoning. Deze afbeelding mist een beschrijving. Voeg een alt-attribuut met “Winst uit je woning” toe.

Bevinding 7: Advies: Midden op pagina https://winstuitjewoning.nl/witgoed/ staat een logo van Coolblue. Deze afbeelding is verborgen voor hulpsoftware met een leeg alt-attribuut. Op deze pagina staat de afbeelding tegenover een kopje “Coolblue” en mag als decoratief worden beschouwd. Voor alle andere gevallen wanneer een logo op een pagina staat moet een logo alternatieve tekst krijgen waarin de tekst van het logo in terugkomt. Daarom is het belangrijk om aan dit logo en alle andere logo’s in de mediatheek van de website alternatieve teksten toe te voegen.

1.2 Op tijd gebaseerde media

1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 8: In een aantal video’s op deze website ontbreekt de ondertiteling. Dat betekent dat alle gesproken tekst en belangrijke geluiden niet toegankelijk zijn voor mensen die doof zijn of slechthorend.
Zie https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ en
https://winstuitjewoning.nl/maatregelen/isolatieglas/.

1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 9: De video op onder andere pagina https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ bevat onder andere geschreven tekst. Voor al deze visuele informatie moet een alternatief geboden worden voor mensen die blind zijn. Dit kan voor dit succescriterium door een volledig transscript in tekst aan te bieden waar alle (visuele en auditieve) informatie uit de video in zit. Om te voldoen aan niveau AA is echter ook succescriterium 1.2.5 van toepassing die aangeeft dat een transscript geen oplossing meer is. Zie succescriterium 1.2.5.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Uitkomst: Onvoldoende

Bevinding 10: Op pagina https://winstuitjewoning.nl/nieuws-extra-middelen-voor-de-opschaling-van-de-aanpak-van-energiearmoede/ staat een video waar tekst in beeld komt als een andere spreker begint te spreken, bijvoorbeeld op 1:16. Deze informatie is belangrijk om te kunnen begrijpen waar de video over gaat en moet daarom toegankelijk worden gemaakt voor mensen die deze teksten niet kunnen zien. De video op onder andere pagina https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ bevat ook geschreven tekst. Voeg daarom een audiodescriptie toe aan de video's. Dit kan door dit in het bestaande audiospoor op te nemen, of door dit in een apart audiospoor erbij te plaatsen.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Uitkomst: Onvoldoende

Bevinding 11: Op pagina https://winstuitjewoning.nl/privacy/ zijn alle tussenkopjes tussen “Privacy en actievoorwaarden” en in de blauwe sectie onderaan de pagina niet als kopjes opgemaakt. Ze zijn opvallend gemaakt door middel van een strong-element. Bezoekers die gebruik maken van voorleessoftware kunnen aan de hand van een sneltoets of koppenlijst over een pagina navigeren, maar dat kan alleen als visuele kopjes opgemaakt zijn als koppen. Gebruik daarom het h-element om deze teksten op te maken.

Bevinding 12: Op pagina https://winstuitjewoning.nl/witgoed/ heeft een kopje “Veelgestelde vragen” niveau twee (h2). De vragen zijn ook opgemaakt met koppen van niveau twee. Onder een kop moet content, ofwel een kop van een lager niveau staan. Verander daarom de vragen in koppen van niveau drie.

Bevinding 13: Op pagina https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ staat een overzicht van adviseurs. De naam van een adviseur is opgemaakt als een kop van niveau 3, en zijn functie is opgemaakt als een kop van niveau 4. Het gebruik van koppen wekt de suggestie dat er content onder zou volgen, maar in dit geval is het niet het geval. De heading-elementen zijn hier gebruikt voor opmaak. Verander de tekst met kopniveau 4 in een span- of een paragraafelement en gebruik CSS om de tekst te stylen.

Bevinding 14: Op pagina https://winstuitjewoning.nl/subsidie/ staan vetgedrukte teksten in een tabel die op tussenkopjes lijken. Zie tabel onder het kopje “Hoeveel subsidie ontvang ik voor isolatieglas?”. De vetgedrukte tussenkopjes zijn “HR ++ glas” en “Triple glas”. Deze kopjes zijn met CSS opvallend gemaakt. De screenreader leest ze niet als koppen voor waardoor de structuur van informatie verandert.

Bevinding 15: Op veel plekken op de website, waaronder op pagina https://winstuitjewoning.nl/veelgestelde-vragen/, zijn koppen naast het kop-element óók opgemaakt met het strong-element. Gebruik het strong-element nooit puur voor opmaak maar gebruik CSS om kopteksten aan te passen aan de gewenste stijling.

Bevinding 16: Op pagina https://winstuitjewoning.nl/onze-inkoopacties/ staat een sectie met veelgestelde vragen. Onder de vraag “Wat zijn de voordelen van aankoop (..)?” staat een opsomming die alleen visueel is te herkennen als een lijst. De lijst is opgemaakt als alinea’s waar bolletjes aan toegevoegd zijn. Zonder correcte opmaak kan hulpsoftware niet aan een blinde gebruiker voorlezen dat hier een lijst staat met zoveel punten. Een vergelijkbaar probleem komt voor op pagina https://winstuitjewoning.nl/veelgestelde-vragen/.

Bevinding 17: Op pagina https://winstuitjewoning.nl/maatregelen/isolatieglas/ staan datatabellen. De koprij is met td-elementen opgemaakt. Dit is geen correcte opmaak voor een datatabel. Gebruik th-elementen gebruiken voor de koprij. “De bedragen bij 2 maatregelen” is een tussenkop, maar is met een strong-element opgemaakt. Door deze opmaak wordt het niet uitgesproken als een kop en mist een blinde bezoeker de juiste structuur van informatie.

Bevinding 18: Op pagina https://winstuitjewoning.nl/nieuws-extra-middelen-voor-de-opschaling-van-de-aanpak-van-energiearmoede/ staat een alinea die vetgedrukt is door middel van een strong-element. Het strong-element geeft aan dat tekst belangrijker is dan de omliggende informatie. Gebruik dit element daarom niet om alinea’s te stijlen.

Bevinding 19: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staan kopjes die niet als koppen zijn opgemaakt. Het gaat om “Meedoen werkt zo:” en “Goed om te weten:”. Verander de strong-elementen in kopteksten van niveau drie.

Bevinding 20: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staat een lijst met cijfers een tot en met vijf. Deze lijst is opgemaakt met ul-elementen. De cijfers zijn als tekst toegevoegd. In de HTML is een ol-element beschikbaar voor genummerde lijsten. Alle visuele presentatie moet ook in de code kunnen worden afgelezen. Verander het ul-element in een ol-element. Deze lijst staat onder “Meedoen werkt zo:”.

Bevinding 21: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staat een kopje “Kom ook naar de informatieavond”. Dit is een kop van niveau twee. Daaronder staan twee events met elk een datum als een kopje. Deze kopjes zijn opgemaakt als koppen van niveau een. Het lijkt erop dat h1-element is gebruikt voor styling. Verander deze koppen in kopjes van niveau drie.

Bevinding 22: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een kop1 die gevolgd is door kop 3 met tekt “Meld je dan nu vrijblijvend aan om van start te gaan!”. Deze tekst is geen kop omdat er geen content onder staat. Verander deze h3 in een alinea-element en gebruik CSS om de tekst te stijlen.

Bevinding 23: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie onder “Veelgestelde vragen”, vraag 3 “Wat zijn de voordelen (..)?” staat een opsomming die niet als een lijst is opgemaakt. Deze lijst is opgemaakt met alinea-elementen. Verander deze lijst in een correct opgemaakte opsomming. Onder de vraag “Hoe weet ik dat mijn gevel (..)” staat een genummerde lijst die niet als een lijst is opgemaakt. Gebruik hier het ol-element. Ook onder de vraag “Wat zijn de voor- en nadelen van de isolatiechips” staat een lijst die alleen visueel als een lijst te onderscheiden.

Bevinding 24: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een groep keuzerondjes met een groepslabel “Ik ben een …”. Dit label is niet gebonden met de groep en wordt daarom niet als een groepslabel voorgelezen. Maak hier gebruik van een fieldset en legend combinatie. Zie ook stap 3 in dit formulier.

Bevinding 25: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 3 komen tussenkopjes in beeld die niet als koppen zijn opgemaakt. Het gaat om “Hybride warmtepomp” en “All-electric ready warmtepomp”. Zet deze alinea-elementen om in h3-elementen.

Bevinding 26: Het onderzochte pdf-document heeft geen tags en daardoor is voor hulpsoftware (zoals voorleessoftware) geen informatie beschikbaar om de PDF te interpreteren. Omdat tags 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. Zie https://winstuitjewoning.nl/wp-content/uploads/2023/03/Algemene-voorwaarden-Winst-uit-je-woning-acties-1.pdf.

Bevinding 27: Advies: De koppenstructuur op de homepagina is goed, maar de koppen in de footer zijn opgemaakt met het h3-element. Hierdoor vallen ze in de structuur onder 'Laatste nieuws'. Maak de kopjes in de footer daarom op met een h2-element. Op pagina https://winstuitjewoning.nl/duurzame-oplossingen/ worden ook kopniveaus overgeslagen.

1.3.5 Identificeer het doel van de input (Niveau AA)

Informatie over succescriterium 1.3.5 Identificeer het doel van de input

Uitkomst: Onvoldoende

Bevinding 28: Op pagina https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ staat een formulier om in te schrijven voor een nieuwsbrief. Het invoerveld waarin het e-mailadres moet worden ingevuld mist een autocomplete attribuut. Op de volgende pagina is meer informatie te vinden over de toepassing van dit attribuut en welke waardes verplicht zijn om te gebruiken. Zie: https://www.w3.org/TR/WCAG21/#input-purposes.

Bevinding 29: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier waarin persoonlijke gegevens moeten worden ingevuld, zoals een postcode en een e-mail. Op deze invoervelden ontbreekt een autocomplete attribuut om de bezoeker te helpen om zijn informatie automatisch in te vullen. Dit geldt ook voor velden in stap 3 van dit formulier.
Informatie over de velden waar het autocomplete-attribuut voor gebruikt moet worden en de bijbehorende waarden is te vinden op pagina https://www.w3.org/TR/WCAG21/#input-purposes.

1.4 Onderscheidbaar

1.4.1 Gebruik van kleur (Niveau A)

Informatie over succescriterium 1.4.1 Gebruik van kleur

Uitkomst: Onvoldoende

Bevinding 30: Op pagina https://winstuitjewoning.nl/privacy/ staan twee links onder 'Contactgegevens'. Het contrast tussen een link en gewone tekst is 2,2:1. Er is geen tweede visuele clue om aan te geven dat dit een link is. Ook op pagina https://winstuitjewoning.nl/witgoed/ onder “Veel gestelde vragen”, onder de vraag “Met wie kan ik contact opnemen (..)” staat een link. Ook op https://winstuitjewoning.nl/handen-uit-de-mouwen-aanpak-energiearmoede-in-de-praktijk/ staan links in de tekst van het artikel die alleen in kleur te onderscheiden zijn van de gewone tekst. Deze links komen op meer pagina’s voor.
Zie ook pagina https://winstuitjewoning.nl/amsterdam/inkoopactie onder “Veelgestelde vragen”, vraag 1 “Hoe kan ik meedoen (..)?”. In de sectie die openklapt, onder “Stap 1” staat een link met tekst “hier” die alleen in kleur te onderscheiden is van de gewone tekst.

Bevinding 31: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 2 van het proces staat een knop “Terug”. Als deze knop focus krijgt, verandert de achtergrond van kleur en wordt lichtgrijs. De focus wordt alleen in kleur aangegeven.

Bevinding 32: In stap 3 van het formulier op pagina https://aanmelden.winstuitjewoning.nl/ staan links die alleen in kleur te onderscheiden zijn van gewone tekst.

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Uitkomst: Onvoldoende

Bevinding 33: De rand van het invoerveld in de zoekbalk is grijs ( HEX #CED4DA). Deze kleur in combinatie met de witte achtergrond geeft contrastwaarde van 1,5:1. Dit moet minimaal 3,0:1 zijn. Dit invoerveld komt op meerdere pagina’s voor: https://winstuitjewoning.nl/witgoed/ en https://winstuitjewoning.nl/nieuwe-uitvoerder-inkoop/.

Bevinding 34: Op de homepagina staan onder het kopje “Recent gestart” links met namen van de steden. Als focus op deze links landt, krijgt de link een lichtblauwe rand (HEX #C6DAFF). Het kleurcontrast is 1,4:1. Dit moet minimaal 3,0:1 zijn.

Bevinding 35: Op pagina https://winstuitjewoning.nl/gemeenten/ staat onder het kopje “Alle duurzame oplossingen (...)” een slider. Op een desktop zijn twee methodes geboden om de slider te bedienen. Als men inzoomt, blijven alleen de grijze bolletjes onder de slider over. Deze bolletjes zijn grijs voor een actieve slide (HEX #999) en lichtgrijs voor de slides die niet in beeld zijn (HEX #DDD). Het kleurcontrast is in beide gevallen onvoldoende: 2,8:1 en 1,4:1.

Bevinding 36: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staat een widget van Trustpilot. De groene en grijze kleur in de afbeeldingen met sterren hebben onvoldoende kleurcontrast. De groene kleur (#00B57A) heeft contrastwaarde 2,7:1 en de grijze kleur (#DCDBE5) 1,4:1. Dit moet minimaal 3,0:1 zijn.

Bevinding 37: De randkleur (#d6d6d6) van de invoervelden op pagina https://aanmelden.winstuitjewoning.nl/ heeft onvoldoende kleurcontrast, namelijk 1,5:1. Dit moet minimaal 3,0:1 zijn.

1.4.13 Content bij hover of focus (Niveau AA)

Informatie over succescriterium 1.4.13 Content bij hover of focus

Uitkomst: Onvoldoende

Bevinding 38: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 2 van het proces staan twee checkboxen. Rechts tegenover deze checkboxen staan iconen met tooltips. Als een bezoeker met een muis boven deze iconen beweegt, verschijnt nieuwe informatie. Deze nieuwe informatie bedekt de checkboxen waardoor extra eisen aan deze nieuwe content wordt gesteld. Er is een mechanisme beschikbaar waarmee de aanvullende content kan worden gesloten zonder de aanwijzer hover of de toetsenbordfocus te verplaatsen. Dak kan bijvoorbeeld met een Esc toets.

2. Bedienbaar

2.4.2 Paginatitel (Niveau A)

Informatie over succescriterium 2.4.2 Paginatitel

Uitkomst: Onvoldoende

Bevinding 39: In het onderzochte pdf-document is de titel aanwezig en beschrijft de inhoud van het document. Echter, moet hier ook worden ingesteld dat de titel wordt getoond in de titelbalk en niet de bestandsnaam, zoals nu het geval is. Zie https://winstuitjewoning.nl/wp-content/uploads/2023/03/Algemene-voorwaarden-Winst-uit-je-woning-acties-1.pdf.

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Uitkomst: Onvoldoende

Bevinding 40: In de header loopt de focus van de zoekbalk naar enkele items in het menu daaronder. De menulinks “Lopende acties”, “Financiering” en “Partners” worden overgeslagen. Dit is geen logische focusvolgorde. Zorg ervoor dat de focusvolgorde voor bezoekers die gebruik maken van het toetsenbord om over de pagina te navigeren, ook logisch is.

Bevinding 41: Als het mobiele menu is geopend, loopt de focus over de menulinks, verlaat het menu en gaat vervolgens op de onderliggende pagina verder. Dit is geen logische focusvolgorde. Zorg ervoor dat focus binnen dit menu blijft en pas na het klikken op de menuknop dit onderdeel verlaat, of dat het menu automatisch sluit wanneer de bezoeker na het laatste menu-item verder navigeert.

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Uitkomst: Onvoldoende

Bevinding 42: Op pagina https://winstuitjewoning.nl/gemeenten/ staan onder het kopje “Alle duurzame oplossingen (..)” links met dezelfde linktekst “Lees meer”. Deze tekst zegt niets over het linkdoel van deze links. Een blinde gebruiker kan een overzicht van links genereren om zo de inhoud van de pagina te scannen. Links met teksten als “lees meer” of “klik hier” zijn onvoldoende beschrijvend. Pas de linkteksten aan, bijvoorbeeld door het onderwerp of de titel van de pagina waar naar wordt verwezen te benoemen.
Zie ook pagina https://winstuitjewoning.nl/amsterdam/inkoopactie onder “Veel gestelde vragen”, vraag 1 “Hoe kan ik meedoen (..)?”. In de sectie die openklapt, onder “Stap 1” staat een link met tekst “hier”.

2.4.5 Meerdere manieren (Niveau AA)

Informatie over succescriterium 2.4.5 Meerdere manieren

Uitkomst: Onvoldoende

Bevinding 43: Voor elke pagina op de website moet een tweede manier aanwezig zijn om de pagina te vinden. Dit kan via zoeken, een sitemap, links op homepagina of links in de footer. De pagina “Vacatures” is niet via de tweede manier te vinden. Zie footer van de website.

2.4.6 Koppen en labels (Niveau AA)

Informatie over succescriterium 2.4.6 Koppen en labels

Uitkomst: Onvoldoende

Bevinding 44: Op pagina https://winstuitjewoning.nl/maatregelen/isolatieglas/ staat een video van Vimeo. De toegankelijke naam van dit iframe is “Vimeo video”. Deze naam is niet beschrijvend genoeg. Voeg een beschrijvende naam toe, bijvoorbeeld de naam van de video. Op deze manier hoort een blinde gebruiker waar de video overgaat in plaats van een generieke tekst.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Uitkomst: Onvoldoende

Bevinding 45: Op sommige knoppen is de focusrand verwijderd met CSS-code “outline:none”. Zie bijvoorbeeld de knop om het mobiele menu te openen, de zogenaamde hamburger knop (drie horizontale streepjes).
Hierdoor weten bezoekers die met toetsenbord navigeren niet altijd op welke elementen de focus zich bevindt. Ze kunnen ongewenst en per ongeluk links en knoppen activeren. De focus moet altijd zichtbaar zijn.

Bevinding 46: Op pagina https://winstuitjewoning.nl/witgoed/ staat een donkerblauwe sectie. In de tweede en derde kolom staan interactieve elementen die focusrand krijgen die uit een blauwe rand bestaat. De focus is hierdoor niet zichtbaar.

Bevinding 47: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 2 van het proces staan twee checkboxen. Wanneer de bezoeker met een toetsenbord navigeert, is de focus is niet zichtbaar op deze interactieve elementen. Voeg een duidelijke focusrand toe of gebruik de standaard focusindicator.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Uitkomst: Onvoldoende

Bevinding 48: Dit succescriterium is bedoeld om bediening met spraaksoftware mogelijk te maken. Belangrijk hierbij is dat de visueel zichtbare tekst onderdeel is van de toegankelijkheidsnaam van het element. Rechtsboven elke pagina staat een zoekbalk. Deze zoekbalk komt soms ook midden op de pagina voor, bijvoorbeeld de zoekbalk op de homepagina onder het kopje “Vind jouw gemeente”.
De toegankelijke naam van de zoekbalk is “Voer uw zoekterm in” afkomstig van een aria-label. Zichtbare tekst is “Zoeken”. De bezoeker kan dit veld niet bedienen door de zichtbare tekst in te spreken.

Bevinding 49: Advies: De alternatieve tekst van het logo in de linkerbovenhoek van elke webpagina is ”Ga naar de Winst uit je woning homepage”. De zichtbare tekst komt nu voor in de alternatieve tekst en de alternatieve tekst beschrijft het doel van de link en de afbeelding, maar idealiter staat de zichtbare tekst vooraan in de alternatieve tekst, bijvoorbeeld: ‘Winst uit je woning – ga naar de homepage’

3. Begrijpelijk

3.1 Leesbaar

3.1.1 Taal van de pagina (Niveau A)

Informatie over succescriterium 3.1.1 Taal van de pagina

Uitkomst: Onvoldoende

Bevinding 50: In de meta data van het onderzochte pdf-document is de taal niet ingesteld. De taal hoort ingesteld te worden, zodat hulpsoftware de informatie uit het bestand in de correcte taal kan overdragen aan de bezoeker. Dit kan worden ingesteld via de bestandseigenschappen.
Zie https://winstuitjewoning.nl/wp-content/uploads/2023/03/Algemene-voorwaarden-Winst-uit-je-woning-acties-1.pdf.

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Uitkomst: Onvoldoende

Bevinding 51: Sommige buttons op deze website hebben title-attributen met Engelstalige teksten, bijvoorbeeld “Submit the search query.” en “Clear the search query.”. Zie bijvoorbeeld de zoekbalk rechtsboven de pagina.
Deze teksten dienen Nederlandstalig te zijn, omdat de basistaal van de pagina Nederlands is. Als deze teksten toch Engelstalig blijven is het de bedoeling om door middel van een lang attribuut ook aan te geven dat het Engelse tekst is, anders wordt het niet goed voorgelezen.

3.3 Assistentie bij invoer

3.3.1 Foutidentificatie (Niveau A)

Informatie over succescriterium 3.3.1 Foutidentificatie

Uitkomst: Onvoldoende

Bevinding 52: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 3 verschijnt een foutmelding “Vul een voorkeursplaats in” als het invoerveld onder “Waar wil je de zonnepanelen geïnstalleerd hebben?” leeg wordt verstuurd. Dit is geen foutmelding, maar een instructie. Een goede foutmelding bevat in de meeste gevallen een ontkenning en zou hier moeten luiden “Voorkeursplaats is niet ingevuld”.
In stap 3 van het formulier moet een telefoonnummer worden ingevuld. Als dat niet het geval is, verschijnt “Voer een geldig telefoonnummer in”. Hier moet een bepaald aantal cijfers worden ingevuld en ook in een bepaald formaat. Uit deze foutmelding is niet af te leiden wat er precies fout gaat met de invoer.

3.3.2 Labels of instructies (Niveau A)

Informatie over succescriterium 3.3.2 Labels of instructies

Uitkomst: Onvoldoende

Bevinding 53: Op pagina https://winstuitjewoning.nl/veelgestelde-vragen/ staan zoekvelden om binnen de veelgestelde vragen te zoeken. Deze zoekvelden missen labels. Een placeholder tekst is onvoldoende als een label omdat het verdwijnt zodra een bezoeker begint te typen.

Bevinding 54: Op pagina https://winstuitjewoning.nl/nieuwe-uitvoerder-inkoop/ staat een formulier. Het veld “Telefoonnummer” vereist een bepaald formaat. Dit formaat wordt pas zichtbaar als de bezoeker een foutieve gegevens in dit veld heeft ingevoerd. Door het formaat in het label te plaatsen, help je de bezoeker om fouten te voorkomen.
Zie ook stap 3 op https://aanmelden.winstuitjewoning.nl/.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Uitkomst: Onvoldoende

Bevinding 55: Op pagina https://winstuitjewoning.nl/witgoed/ is een aria-expanded attribuut gebruikt in combinatie met een aria-haspopup attribuut. Deze combinatie is niet toegestaan. Dit komt ook in het hoofdmenu terug en op alle pagina’s waar een sectie met de uitklapdelen staat.

Bevinding 56: Op pagina https://winstuitjewoning.nl/onafhankelijke-adviseurs-informatie/ staat een formulier om in te schrijven voor een nieuwsbrief. De toegankelijke naam van dit invoerveld is gegeven door middel van een placeholder tekst. Deze optie wordt gezien als het minst ondersteunde manier om toegankelijke naam te geven. Gebruik liever het label-element, een aria-label of aria-describedby.

Bevinding 57: Op pagina https://winstuitjewoning.nl/veelgestelde-vragen/ staan zoekvelden
om binnen de veelgestelde vragen te zoeken. Deze invoervelden hebben een toegankelijke naam via een placeholder tekst gekregen. Gebruik hiervoor een label-element dat via “for en id” gekoppeld is aan het invoerveld. Het label dan van het scherm verborgen worden, maar moet zichtbaar blijven voor hulpsoftware.

Bevinding 58: Op pagina https://winstuitjewoning.nl/gemeenten/ staat een slider. In deze slider is een aria-hidden attribuut gebruikt op een interactief element. Verwijder dit attribuut.

Bevinding 59: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staat een link “
Meld je aan voor de inkoopactie”. Deze link is gecodeerd als een a-element waaraan role=”button” is toegevoegd. Dit is overbodig en kan verwarrend zijn voor een voorleessoftware gebruiker die bij het horen van role=”button” andere toetsenbordtoetsen gaat gebruiken dan die bij een link horen. Verwijder role=”button”. Dit komt vaker op deze pagina voor. Dit komt ook voor op de pagina https://aanmelden.winstuitjewoning.nl/. Het logo is gecodeerd als een afbeelding met role=”button”. Door het klikken op deze afbeelding wordt de bezoeker naar de homepagina gestuurd. Deze afbeelding moet een link zijn in plaats van een knop.

Bevinding 60: Op pagina https://winstuitjewoning.nl/amsterdam/inkoopactie staat een Trustpilot widget. De knoppen om door de beoordelingen te bladeren zijn niet als knoppen gecodeerd. Ze missen de toegankelijkheidsnaam en rol. De voorleessoftware kan niet aan een blinde bezoeker vertellen dat het bedieningselementen zijn.

Bevinding 61: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een checkbox zonder toegankelijkheidsnaam. Het label “Ik ga akkoord met (..)” is niet gebonden met de checkbox.

Bevinding 62: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een logo van Winstuitjewoning. Deze afbeelding maakt deel uit van een knop. Deze knop heeft geen toegankelijkheidsnaam. Geeft deze afbeelding een alternatieve tekst die als toegankelijkheidsnaam gebruikt kan worden.

Bevinding 63: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 2 van het proces staan twee checkboxen. Rechts tegenover deze checkboxen staan iconen met tooltips. Deze iconen schakelen zichtbaarheid van informatie aan en uit, en toch zijn ze verborgen voor hulpsoftware met role=”presentation”. Verwijder deze rol.

Bevinding 64: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. In stap 3 staat een tekstvak zonder toegankelijkheidsnaam. De tekst “Heb je nog toevoegingen ..?” staat er als losse tekst bij en is niet gebonden met het tekstvak. Dit geldt ook voor de invoervelden in stap 3 (een select en een tekstvak).

4.1.3 Statusberichten (Niveau AA)

Informatie over succescriterium 4.1.3 Statusberichten

Uitkomst: Onvoldoende

Bevinding 65: Rechtsboven elke pagina staat een zoekbalk. Als een bezoeker een zoekopdracht intypt die niet op de website te vinden is, verschijnt een extra venster met informatie. Dit kan een gevonden item zijn of een mededeling dat niets gevonden is. Dit is een statusbericht, maar wordt niet als dusdanig voorgelezen. Geef dit venster een aria-live="polite" of role="status".

Bevinding 66: Op pagina https://aanmelden.winstuitjewoning.nl/ staat een formulier. De foutmelding “Helaas hebben wij geen adresgegevens gevonden (..)” is een statusbericht. Deze melding verschijnt tijdens het invoeren van gegevens en krijgt geen focus. Een bezoeker die naar een schermlezer luistert, hoort deze foutmelding niet. Daarom moet bij deze melding een aria-live="polite" of role=”status” worden toegevoegd, zodat deze melding voorgelezen wordt als de melding verschijnt. Er verschijnt ook een melding bij de laatste vraag.
Als het formulier wordt verzonden, verschijnt een extra venster met een mededeling “Bezig met verzenden”. Dit is ook een statusbericht dat niet wordt voorgelezen. Zorg ervoor dat hulpsoftware dit statusbericht als zodanig kan herkennen.

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-05-09 17:09:59 v2.4-011