Onderzoek toegankelijkheid sportencultuur.almere.nl

Inleiding

Openbare voorzieningen moeten bruikbaar en toegankelijk zijn voor alle burgers. Net zoals een gebouw rolstoeltoegankelijk moet zijn, moet een website of mobiele app ook bediend kunnen worden door mensen met een beperking. Dit kunnen bijvoorbeeld visuele, auditieve of motorische beperkingen zijn. Denk aan slechtzienden, doven en slechthorenden en mensen die hun handen niet of in beperkte mate kunnen gebruiken. Ook cognitieve factoren spelen een rol: is de content voor iedereen te begrijpen?

Nederlandse overheidsorganisaties moeten voldoen aan de Web Content Accessibility Guidelines (WCAG) versie 2.1, onder de Europese standaard voor overheidswebsites EN 301 549. Deze criteria variëren van technisch functionele eisen zoals een goede werking met het toetsenbord tot aan meer inhoudelijke eisen zoals duidelijke foutmeldingen en een heldere navigatiestructuur.

Dit onderzoek is handmatig uitgevoerd volgens de WCAG-EM evaluatiemethode met ondersteuning van automatische test tools. De pagina’s uit de sample zijn onderzocht op alle 50 criteria onder WCAG 2.1 A en AA. Wanneer aan een criterium niet wordt voldaan, worden hiervan een of meer voorbeelden gegeven. Deze bevindingen kunnen op meer plekken voorkomen en moeten structureel worden aangepakt.

De WCAG criteria zijn ingedeeld volgens vier principes, welke ook de leidraad vormen voor dit rapport: Waarneembaar, Bedienbaar, Begrijpelijk en Robuust. Gedetailleerde informatie over deze criteria is te vinden op de website van het W3C (Nederlandse vertaling).

Over deze evaluatie

Rapport auteur
Janita Top
Evaluatie opdrachtgever
Gemeente Almere
Evaluatiedatum
7 januari 2021

Managementsamenvatting

Uit dit onderzoek blijkt dat wordt voldaan aan 29 van de 50 criteria voor toegankelijkheid. Veel onderdelen van de site zijn dus al goed toegankelijk, maar er zijn nog verbeteringen mogelijk.

De website werkt goed op mobiele apparaten en wanneer je inzoomt op de desktop, schalen de teksten goed mee. Dankzij de skiplink is het voor toetsenbordgebruikers ook goed mogelijk om herhalende content bovenaan de pagina's over te slaan. Ook zijn er geen bewegende elementen die de gebruiker kunnen afleiden van de tekst, en blijven meldingen in beeld staan zodat de gebruiker tijd heeft om deze te lezen.

Wel ontbreken er goede alternatieve teksten bij enkele logo's en iconen, waardoor links en buttons geen duidelijk doel hebben. Ook zijn er veel invoervelden gevonden waar de labels niet correct zijn opgemaakt, waardoor het voor gebruikers van hulpsoftware niet duidelijk is wat er ingevuld moet worden. Hoewel de site in het algemeen goed te bedienen is met het toetsenbord, geeft dit nog wel problemen bij popups en bij het invullen van checkboxes in formulieren. Wat contrast betreft zijn er issues gevonden met groene en oranje teksten die door de gehele site worden toegepast.

Scope van de evaluatie

Website naam
sportencultuur.almere.nl
Scope van de website
Alle pagina's op https://sportencultuur.almere.nl/.
WCAG Versie
2.1
Conformiteitsdoel
AA
Basisniveau van toegankelijkheid-ondersteuning
Gangbare webbrowsers en hulpapparatuur.
Verdere onderzoeksvereisten

Uitgebreide toetsresultaten

Samenvatting

Gerapporteerd over 50 van 50 WCAG 2.1 AA Success Criteria.

Alle resultaten

1 Waarneembaar

1.1 Tekstalternatieven
Success Criterium Uitkomst Bevindingen
1.1.1: Niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Sport

Uitkomst: Onvoldoende

PDF Handleiding partners

Uitkomst: Onvoldoende

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Het logo ‘Sport & Cultuur in Almere’ heeft een lege alt-tekst. Logo’s zijn informatief en moeten altijd een beschrijving hebben van de tekst op de afbeelding. Voeg een alt-tekst toe. Dit geldt ook voor het logo onderaan de pagina van ‘Almere Kenniscentrum Talent’.

Wanneer het mobiele menu geopend is, staat er onder het menu een afbeelding van een kruis, welke als sluiten knop dient. Deze afbeelding heeft geen alternatieve tekst.

Opmerking: Decoratieve afbeeldingen kunnen het best verborgen worden voor hulpsoftware, zoals ‘sport pictogram groen’. Dit soort beschrijvingen voegen namelijk niets toe aan de content. Dit kan door de alt-tekst leeg te laten.

Sport

Onderaan de pagina staan 2 logo’s zonder alt-tekst, van 'Jeugdfonds Sport en Cultuur' en van 'Uniek sporten'. Voeg hier een alt-ekst toe.

Achter de namen van de filters staat een icoontje met een min-teken om aan te geven dat je het filter hiermee kunt wissen. Dit icoon heeft geen goede alternatieve tekst. Nu staat er bijvoorbeeld ‘balsporten indeterminate_check_box’.

Opmerking: Boven het eerste logo staat de tekst ‘Klik op de knop…’, maar er is geen knop.

PDF Handleiding partners

De afbeeldingen in het document missen alternatieve teksten.

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

De foto heeft een lege alt-tekst waardoor deze verborgen wordt voor hulpsoftware. Er is echter wel een caption, wat tegenstrijdig is (en waardoor screenreaders de figuur wel voorlezen). Deze caption is ook geen beschrijving van de afbeelding. Captions zijn bedoeld voor aanvullende informatie over de afbeelding (die niet in de alt-tekst thuis hoort of past). Voeg een goed beschrijvende alt- tekst toe, eventueel met aanvullende caption. Zet de kosten buiten de caption, dit is ‘normale’ content. Dit komt bij meerdere activiteiten voor.

1.2 Op tijd gebaseerde media
Success Criterium Uitkomst Bevindingen
1.2.1: Louter-geluid en louter-videobeeld (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing

1.2.2: Ondertitels voor doven en slechthorenden (vooraf opgenomen)
Hele sample

Uitkomst: Voldoende

1.2.3: Audiodescriptie of media-alternatief (vooraf opgenomen)
Hele sample

Uitkomst: Onvoldoende

Akt

Uitkomst: Onvoldoende

Akt

Er komt informatie in beeld die niet wordt uitgesproken, zoals groepen en leeftijden. Mensen die deze teksten niet kunnen zien, krijgen deze informatie niet mee. Behalve audiodescriptie kan deze informatie (onder dit niveau A criterium) ook via een alternatief worden aangeboden, zoals een uitgeschreven tekst onder de video.

1.2.4: Ondertitels voor doven en slechthorenden (live)
Hele sample

Uitkomst: Niet van toepassing

1.2.5: Audiodescriptie (vooraf opgenomen)
Hele sample

Uitkomst: Onvoldoende

Akt

Uitkomst: Niet getoetst

Akt

Er komt informatie in beeld die niet wordt uitgesproken, zoals groepen en leeftijden. Onder dit niveau AA kan niet worden volstaan met een alternatief, maar is audiodescriptie vereist.

1.3 Aanpasbaar
Success Criterium Uitkomst Bevindingen
1.3.1: Info en relaties
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Sport

Uitkomst: Onvoldoende

Akt

Uitkomst: Niet getoetst

PDF Handleiding partners

Uitkomst: Onvoldoende

Activiteit aanmaken (ingelogd)

Uitkomst: Onvoldoende

Homepage

De kophiërarchie klopt niet. Zo is er een h2-kop ‘Populair’, maar de items die hieronder vallen hebben ook een h2-kop. Dit moeten h3-koppen zijn. Zie screenshot 2.

Sport

De kophiërarchie klopt niet. Alle activiteiten hebben nu een kop op h2-niveau, maar dit zou h3 moeten zijn, onder de grotere h2-kop ‘Sport’. Nog beter zou zijn om van ‘Sport’ een h1 te maken (de pagina heeft nu namelijk geen h1), dan een h2 met ‘Activiteiten’ en daaronder alle activiteiten met een h3-kop. De filters (h3) kunnen dan een h2-kopje krijgen met ‘Filters’. Deze structuur komt op meerdere pagina’s voor.

Het invoerveld om te zoeken mist een label. Een placeholder is niet voldoende, omdat die niet overal wordt ondersteund. Dit komt op meerdere pagina’s voor.

Akt

Opmerking: er staat een zin geheel in hoofdletters. Voor sommige bezoekers kan dit lastig te lezen zijn, zoals voor mensen met dyslexie en voor gebruikers van screenreaders die deze tekst op een aparte manier voorlezen. Vermijd daarom het gebruik van hoofdletters voor langere teksten.

PDF Handleiding partners

De kopjes in het document missen kopopmaak, ze zijn nu gecodeerd als paragrafen. Hierdoor is het niet mogelijk voor gebruikers van hulpsoftware om een overzicht te krijgen van de indeling van het document. Voeg kopelementen toe. Hiermee is het ook mogelijk om bookmarks te genereren, waarmee blokken content overgeslagen kunnen worden.

Activiteit aanmaken (ingelogd)

Er zijn meerdere invoervelden zonder daaraan gekoppeld label. Er staan label elementen in de code, maar de id’s waar ze naar verwijzen komen niet terug in de betreffende invoervelden. Hierdoor is het voor gebruikers van hulpsoftware niet duidelijk wat er bij deze invoervelden ingevuld moet worden. Bij gegroepeerde invoervelden, zoals bij leeftijden, moeten deze ook in de code worden gegroepeerd. Dit kan d.m.v een fieldset om alle velden en een legend element om de groep te benoemen (geen label, een label is per veld).

1.3.2: Betekenisvolle volgorde
Hele sample

Uitkomst: Voldoende

Hele sample

Bevindingen:

De popup met de tekst over coronamaatregelen is het eerste wat een visuele gebruiker ziet, maar voor een screenreader gebruiker komt deze informatie pas helemaal onderaan de pagina. Het is dus goed mogelijk dat deze informatie niet gelezen wordt. Zie ook 2.4.3.

1.3.3: Zintuiglijke eigenschappen
Hele sample

Uitkomst: Voldoende

1.3.4: Weergavestand
Hele sample

Uitkomst: Voldoende

1.3.5: Identificeer het doel van de input
Hele sample

Uitkomst: Onvoldoende

Aanmelden Partners

Uitkomst: Onvoldoende

Aanmelden Partners

De invoervelden voor persoonlijke informatie zoals naam en adres hebben geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Dit maakt het invullen van formulieren voor veel gebruikers gemakkelijker, met name voor mensen voor wie het invoeren van tekst veel tijd kost omdat dit via speciale hulpmiddelen gaat zoals bijvoorbeeld het aanwijzen van letters. Dit kan worden verbeterd door ‘autocomplete’ attributen te plaatsen bij de invoervelden. Zie voor meer informatie https://www.w3.org/WAI/WCAG21/Techniques/html/H98 en voor een lijst van alle attributen https://www.w3.org/TR/WCAG21/#input-purposes.

1.4 Onderscheidbaar
Success Criterium Uitkomst Bevindingen
1.4.1: Gebruik van kleur
Hele sample

Uitkomst: Voldoende

1.4.2: Geluidsbediening
Hele sample

Uitkomst: Niet van toepassing

1.4.3: Contrast (minimum)
Hele sample

Uitkomst: Onvoldoende

PDF Handleiding partners

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Het contrast van de kop ‘Coronamaatregelen’ in de popup is niet voldoende (2.55:1). Het contrast van deze kop (grote tekst) moet minimaal 3:1 zijn.

Voor normale tekst geldt een minimum van 4.5:1. De groene en oranje teksten (op Home: Ga naar sport, Ga naar cultuur) hebben een te laag contrast (2.3:1 en 2.6:1). Hetzelfde geldt voor witte tekst op groene en oranje achtergrond (zoals ‘Sport uitgelicht’). Tekst met te laag contrast is moeilijk te lezen voor slechtziende en kleurenblinde bezoekers. De combinatie oranje/wit en groen/wit komt op veel plekken op de site voor. Voorbeelden:

  • Popup activiteiten: de groene en oranje links
  • Zoeken in de buurt: de actieve link in de footer
  • Contact: de ‘Subscribe’ button
  • Aanmelden partners: de ‘registreren’ knop
  • Activiteit aanmaken: de datumprikker

Formulieren, zoals bij Activiteit aanmaken: de foutmeldingen hebben te weinig contrast (rood op blauw, 2:1). Zie screenshot 1.

PDF Handleiding partners

Op pagina 2 staat oranje tekst met te weinig contrast (2.7:1).

1.4.4: Herschalen van tekst
Hele sample

Uitkomst: Voldoende

1.4.5: Afbeeldingen van tekst
Hele sample

Uitkomst: Voldoende

1.4.10: Reflow
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Homepage

Wanneer je een activiteit selecteert op mobiel, heeft de popup geen knop om het weer te sluiten. Er buiten klikken werkt ook niet, wat betekent dat je vastloopt. Zie screenshot 4. Op desktop gaat het ook niet helemaal goed aan de bovenkant van een activiteit in de popup. De ‘golf’ bedekt een deel van de tekst (en de sluit-knop) bij 250%. Zie screenshot 7.

Wanneer je inzoomt op meer dan 250% (bij 1280px breed en 1024px hoog), zijn niet alle items in het hoofdmenu zichtbaar. Het is ook niet mogelijk hier naartoe te scrollen (verticaal).

Wanneer je inzoomt op 400% (bij 1280px breed), moet je horizontaal scrollen om de activiteiten te kunnen lezen. Zorg ervoor dat alle ‘normale content’ tot aan 400% in een kolom gelezen kan worden zonder in 2 richtingen te scrollen. Zie screenshot 5.

1.4.11: Contrast van niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

In de ‘cononapopup’ op mobiel is de sluitknop blauw op een blauwgroene achtergrond. Dit heeft te weinig contrast. Zie screenshot 3.

Wanneer het mobiele menu geopend is, staat er onder het menu een sluit-knop in de vorm van een kruis. Deze heeft te weinig contrast (1.4:1). Zie screenshot 8.

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

In de popup van de activiteit heeft de button met het whatsapp icoon te weinig contrast. Interactieve elementen moeten minimaal een contrast van 3:1 hebben.

1.4.12: Tekstafstand
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Homepage

Wanneer text spacing instellingen worden aangepast (zoals line-height, letter of word spacing) is niet alle tekst meer goed leesbaar. Een deel van de teksten van de activiteiten verdwijnt buiten beeld, zie screenshot 6. Dit kan worden opgelost door containers in de layout te laten meegroeien met de tekst. Bezoekers die hun eigen styles gebruiken om de tekst leesbaar te maken missen nu mogelijk een deel van de tekst. Dit criterium kun je gemakkelijk testen met deze bookmarklet: http://www.html5accessibility.com/tests/tsbookmarklet.html

1.4.13: Content bij hover of focus
Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Wanneer je met de muis over de afbeelding met de vingerafdruk gaat (of er met toetsenbordfocus op komt), verschijnt het woord ‘Cookieverklaring’. Het is niet mogelijk deze weer weg te halen zonder de muis of focus te verplaatsen. Mensen die vergrotingssoftware gebruiken moeten de muis bewegen om andere delen van de website te bekijken. Wanneer zulke extra content over tekst heen valt, moet er een andere mogelijkheid zijn om deze ‘tooltip’ te sluiten, bijvoorbeeld de escape-toets.

2 Bedienbaar

2.1 Toetsenbordtoegankelijk
Success Criterium Uitkomst Bevindingen
2.1.1: Toetsenbord
Hele sample

Uitkomst: Onvoldoende

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

Uitkomst: Onvoldoende

Activiteit aanmaken (ingelogd)

Uitkomst: Onvoldoende

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

De button om de popup te sluiten (het min-teken) is niet te bedienen met het toetsenbord.

Activiteit aanmaken (ingelogd)

De checkboxes kunnen niet met het toetsenbord worden ingevuld. Aangezien deze verplicht zijn, kan er geen activiteit worden aangemaakt. Dit probleem doet zich ook voor bij het aanmelden van de nieuwsbrief op de Contactpagina.

Bij het invoeren van een datum komt met het toetsenbord ook de datumprikker in beeld, maar je kunt er vervolgens niet heen (met pijltjes of de tab-toets). Zorg dat deze ook werkt met het toetsenbord, of verberg de datumprikker met het toetsenbord en geef duidelijk aan hoe de datum handmatig ingevuld kan worden. (Dit werkt al wel, maar er is geen duidelijke instructie.)

2.1.2: Geen toetsenbordval
Hele sample

Uitkomst: Voldoende

2.1.4: Enkel teken sneltoetsen
Hele sample

Uitkomst: Voldoende

2.2 Genoeg tijd
Success Criterium Uitkomst Bevindingen
2.2.1: Timing aanpasbaar
Hele sample

Uitkomst: Niet van toepassing

2.2.2: Pauzeren, stoppen, verbergen
Hele sample

Uitkomst: Niet van toepassing

2.3 Toevallen en fysieke reacties
Success Criterium Uitkomst Bevindingen
2.3.1: Drie flitsen of beneden drempelwaarde
Hele sample

Uitkomst: Voldoende

2.4 Navigeerbaar
Success Criterium Uitkomst Bevindingen
2.4.1: Blokken omzeilen
Hele sample

Uitkomst: Voldoende

2.4.2: Paginatitel
Hele sample

Uitkomst: Onvoldoende

PDF Handleiding partners

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Opmerking: De paginatitels bevatten geen afzender, maar enkel bijvoorbeeld ‘Contact’. Voor een bezoeker die meerdere tabs open heeft staan is het handig als de titel bijvoorbeeld is ‘Contact - Sport en Cultuur Almere’ om onderscheid te maken met andere websites.

PDF Handleiding partners

​​Het PDF-bestand heeft geen titel. Voor gebruikers van hulpsoftware is het voor de navigatie tussen documenten/webpagina’s belangrijk dat de titel duidelijk maakt waar ze zijn. Wanneer een pdf geen titel heeft wordt de bestandsnaam getoond, deze is niet altijd even duidelijk. Pas de titel aan in de Documenteigenschappen in Adobe PDF.

2.4.3: Focus volgorde
Hele sample

Uitkomst: Onvoldoende

Activiteit aanmaken (ingelogd)

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De popup met Coronamaatregelen valt over alle content heen, maar de toetsenbordfocus blijft op de pagina eronder staan. Dit zelfde probleem doet zich voor wanneer je een activiteit selecteert en deze in een popup opent. Zorg dat wanneer een popup geopend is, de focus alleen in deze popup kan komen totdat deze weer gesloten wordt.

Activiteit aanmaken (ingelogd)

Als de activiteit wordt opgeslagen en er zijn nog fouten gevonden, scroll je visueel naar het eerste veld toe dat gecorrigeerd moet worden. De toetsenbordfocus blijft echter bij de opslaan-knop staan en gaat verder in de footer. Zorg dat de focus ook naar de eerste foutmelding gaat. Behalve voor toetsenbordgebruikers (in het algemeen) is dit ook belangrijk voor screenreadergebruikers, omdat zij geen melding krijgen van de foutmeldingen die in beeld komen. (Dit kan wel worden toegevoegd via live-regions, wat een vereiste is wanneer de focus niet wordt aangepast.)

2.4.4: Linkdoel (in context)
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Activiteiten

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De link naar de homepage heeft geen tekst. De alt tekst van het logo is leeg. Dit kan worden opgelost door het logo een goede beschrijving te geven.

Wanneer het mobiele menu geopend is, staat er onder het menu een link met een afbeelding van een kruis, welke als sluiten-knop dient. Deze link heeft geen tekst. Voor gebruikers van hulpsoftware is het nu niet duidelijk waar deze link voor dient. (Wanneer de menu-knop goed wordt opgemaakt met juiste naam en status, kan deze knop eventueel ook weggelaten worden. Zie ook 2.5.3 en 4.1.2)

Homepage

Onder ‘Populair’ staan 2 lege links, die bedoeld lijken voor een slider. Deze slider is niet in gebruik, maar deze links verschijnen wel in linkoverzichten van screenreaders en ontvangen wel totesenbordfocus. Het is beter deze links te verwijderen wanneer ze geen functie hebben.

Activiteiten

Er staat een lege link voor de eerste activiteit (deze gaat naar een preview in een nieuwe tab).

2.4.5: Meerdere manieren
Hele sample

Uitkomst: Voldoende

2.4.6: Koppen en labels
Hele sample

Uitkomst: Voldoende

2.4.7: Focus zichtbaar
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Homepage

De focus op het zoekveld is slecht zichtbaar. Geef dit invoerveld een focusstijl, zoals een extra rand om het veld wanneer je er in staat. (De outline staat nu op ‘none’).

2.5 Input Modaliteiten
Success Criterium Uitkomst Bevindingen
2.5.1: Aanwijzergebaren
Hele sample

Uitkomst: Niet van toepassing

2.5.2: Aanwijzerannulering
Hele sample

Uitkomst: Voldoende

2.5.3: Label in naam
Hele sample

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Wanneer je inzoomt, verschijnt er een knop met de zichtbare tekst ‘menu’. In de code heeft deze echter de naam ‘navigation’. De knop is hierdoor niet met stem te bedienen. Ook kan dit lastig zijn voor Nederlandse screenreader gebruikers omdat het Engelse tekst is.

2.5.4: Bewegingsactivering
Hele sample

Uitkomst: Niet van toepassing

3 Begrijpelijk

3.1 Leesbaar
Success Criterium Uitkomst Bevindingen
3.1.1: Taal van de pagina
Hele sample

Uitkomst: Voldoende

3.1.2: Taal van onderdelen
Hele sample

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Contact

De knop om aan te melden voor de nieuwsbrief staat in het Engels zonder dat dit in de code is aangegeven. Hierdoor wordt het mogelijk niet goed voorgelezen door screenreaders. Zet hier een taalwissel in de code of maak de knop Nederlandstalig (dit laatste heeft de voorkeur).

3.2 Voorspelbaar
Success Criterium Uitkomst Bevindingen
3.2.1: Bij focus
Hele sample

Uitkomst: Onvoldoende

3.2.2: Bij input
Hele sample

Uitkomst: Voldoende

3.2.3: Consistente navigatie
Hele sample

Uitkomst: Voldoende

3.2.4: Consistente identificatie
Hele sample

Uitkomst: Voldoende

3.3 Assistentie bij invoer
Success Criterium Uitkomst Bevindingen
3.3.1: Foutidentificatie
Hele sample

Uitkomst: Onvoldoende

Contact

Uitkomst: Onvoldoende

Contact

Wanneer de checkbox niet is aangevinkt en het formulier wordt verzonden, krijgt de gebruiker geen feedback over wat er mis is gegaan. Dit kan bijvoorbeeld zijn ‘Fout: de categorie is nog niet geselecteerd.’

3.3.2: Labels of instructies
Hele sample

Uitkomst: Voldoende

3.3.3: Foutsuggestie
Hele sample

Uitkomst: Voldoende

3.3.4: Foutpreventie (wettelijk, financieel, gegevens
Hele sample

Uitkomst: Niet van toepassing

4 Robuust

4.1 Compatibel
Success Criterium Uitkomst Bevindingen
4.1.1: Parsen
Hele sample

Uitkomst: Onvoldoende

Homepage

Uitkomst: Onvoldoende

Activiteit aanmaken (ingelogd)

Uitkomst: Onvoldoende

Activiteiten

Uitkomst: Onvoldoende

Homepage

In het figure element in de popup van de activiteit staat een div die niet wordt afgesloten. Incorrecte markup kan resulteren in verkeerde interpretatie door hulpsoftware.

Activiteit aanmaken (ingelogd)

Er zijn meerdere span elementen gevonden die worden afgesloten maar niet zijn geopend.

Activiteiten

Het button element is niet toegestaan binnen het link element. Dit komt op deze pagina 2 keer voor. Zie ook 4.1.2.

4.1.2: Naam, rol, waarde
Hele sample

Uitkomst: Onvoldoende

Akt

Uitkomst: Onvoldoende

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

Uitkomst: Onvoldoende

Activiteiten

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De button van de cookieverklaring heeft geen naam. Er staat een span element in met de tekst ‘cookieverklaring’, maar deze is via display:none verborgen voor hulpsoftware.

Wanneer je inzoomt, verschijnt er een knop met de zichtbare tekst ‘menu’. De status van dit menu wordt niet aangeven. Dit kan worden opgelost via het aria-expanded attribuut.

Akt

Er mist een title in de iframe van de video. Gebruikers van hulpsoftware weten niet wat er in dit iframe staat en of ze deze daarom willen openen of overslaan. Voeg een beschrijvende title toe.

Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere

De knop om de activiteit te sluiten heeft geen correcte naam en rol. Het is een div-element en geen button, en de enige tekst is ‘indeterminate_check_box’. Maak hier een button element van met een goede naam.

Activiteiten

Er zijn 2 buttons die binnen een link element staan: ‘Nieuwe activiteit aanmaken’ en ‘Export aanmeldingen’. Hierdoor is de rol niet duidelijk. Maak hier een button of een link van.

Opmerking: het is ook goed om bij de export button te vermelden dat hierbij een csv-bestand wordt gedownload.

4.1.3: Statusberichten
Hele sample

Uitkomst: Niet van toepassing

Sample met getoetste webpagina's

  1. Homepage - https://sportencultuur.almere.nl/
  2. Sport - https://sportencultuur.almere.nl/sport
  3. Cultuur - https://sportencultuur.almere.nl/cultuur
  4. Akt - https://sportencultuur.almere.nl/akt
  5. Zoeken in de buurt - https://sportencultuur.almere.nl/zoeken-in-de-buurt
  6. Veelgestelde vragen - https://sportencultuur.almere.nl/veelgestelde-vragen
  7. PDF Handleiding partners - https://sportencultuur.almere.nl/fileadmin/sites/sportencultuur/Handleiding_Partners-Sport_en_Cultuur_in_Almere_2021.pdf
  8. Contact - https://sportencultuur.almere.nl/contact
  9. Aanmelden Partners - https://sportencultuur.almere.nl/informatie-voor-partners/aanmelden-partners
  10. Inloggen - https://sportencultuur.almere.nl/inloggen
  11. Zoekresultaten (Vechtsport, volwassenen, kung fu) + popup activiteit Shaolin Kung Fu Almere - https://sportencultuur.almere.nl/sport?tx_solr%5Bfilter%5D%5B0%5D=a_subsoort_sport%3AVechtsporten+%2F+zelfverdediging&tx_solr%5Bfilter%5D%5B1%5D=c_leeftijd%3A9&tx_solr%5Bq%5D=kung+fu
  12. Activiteit aanmaken (ingelogd) - https://sportencultuur.almere.nl/informatie-voor-partners/activiteiten?tx_sfeventmgt_pievent%5Baction%5D=new&tx_sfeventmgt_pievent%5Bcontroller%5D=Edit&cHash=c0b27026bf17dd592f4c3014a0021641
  13. Activiteiten - https://sportencultuur.almere.nl/informatie-voor-partners/activiteiten
  14. Zoekresultaten 'klimmen' - https://sportencultuur.almere.nl/activiteiten?tx_solr%5Bq%5D=klimmen
  15. Informatie - https://sportencultuur.almere.nl/informatie/informatie-sport-en-cultuur-in-almere

Webtechnologie

HTML,CSS,WAI-ARIA,JavaScript,PDF

Onderbouwing van de evaluatie

Gebruikte systemen tijdens het onderzoek:

Screenshots

foutmeldingen in formulier
Figuur 1: de teksten van de foutmeldingen hebben te weinig contrast
koppenlijst homepage
Figuur 2: de hierarchie van de koppen klopt niet: 'populair' heeft hetzelfde niveau als de items die hier onder vallen
sluiten knop op mobiel
Figuur 3: de knop om de melding te sluiten heeft op mobiel te weinig contrast
popup activiteit zwemles
Figuur 4: de sluit-knop van de activiteit valt weg op mobiel of wanneer je bent ingezoomd op de desktop
activiteiten met vallen deels buiten scherm
Figuur 5: wanneer je inzoomt vallen de teksten van de activiteiten deels buiten beeld, waardoor je naast verticaal ook horizontaal moet scrollen
activiteiten vallen deels buiten de container
Figuur 6: wanneer tekstinstellingen worden aangepast, valt een deel van de tekst buiten de container van de layout en wordt daardoor onleesbaar
decoartie over tekst in popup
Figuur 7: wanneer je inzoomt op een activiteit valt een illustratie deels over de tekst heen
sluit knop mobiel menu
Figuur 8: de knop om het mobiele menu te sluiten heeft te weinig contrast