Rapport in PDF

Onderzoek toegankelijkheid Alfie intranet gemeente Almere iOS app

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, wordt hiervan minimaal één voorbeeld gegeven. Deze bevindingen kunnen op meer plekken voorkomen en moeten daarom 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
5 juni 2024

Managementsamenvatting

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

Positief is bijvoorbeeld er geen zintuiglijke eigenschappen worden gebruikt om betekenis over te brengen, dat er geen afbeeldingen van tekst worden gebruikt.

Verbeteringen zijn echter nog mogelijk op diverse punten, zoals:

  • Onjuiste of missende alt-teksten bij afbeeldingen
  • Onjuist opgemaakte koppen
  • Tekst is niet schaalbaar (te vergroten)
  • Niet alle functionaliteit werkt met het toetsenbord

Naast de verplichte WCAG 2.1 criteria zijn ook de in WCAG 2.2 toegevoegde criteria op niveau A en AA onderzocht. Hierbij waren er geen bevindingen.

De screenshots zijn gedeeld met de opdrachtgever, maar omdat het een intranetomgeving betreft, niet opgenomen in dit rapport.

Scope van de evaluatie

Website naam
Alfie intranet gemeente Almere iOS app
Scope van de website
Alle schermen in de iOS app. Embrace Social Intranet versie 1.42
WCAG Versie
2.2
Conformiteitsdoel
AA
Basisniveau van toegankelijkheid-ondersteuning
Gangbare webbrowsers en hulpapparatuur.
Verdere onderzoeksvereisten

Uitgebreide toetsresultaten

Samenvatting

Gerapporteerd over 53 van 55 WCAG 2.2 AA Success Criteria.

Alle resultaten

1 Waarneembaar

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

Uitkomst: Onvoldoende

Groepen

Uitkomst: Onvoldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Opmerking: de afbeeldingen in de knoppen in de bovenbalk hebben een alternatieve tekst, maar ook een knopnaam. Deze alternatieve tekst is daardoor overbodig. Bijvoorbeeld ‘Icon search2 knop Zoek’. ‘Knop zoek’ zou hier voldoende zijn.

Groepen

Achter sommige groepen staat een afbeelding van een slotje om aan te geven dat dit een besloten groep is. Dit icoon heeft geen alternatieve tekst, waardoor deze informatie mist voor screenreaders.

Opmerking: Per groep is er een icoon die als alternatieve tekst dezelfde tekst heeft als de naam/titel van de groep. Dit voegt niks toe. Zorg dat het icoon geen alternatieve tekst heeft (decoratief is).

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Niet alle afbeeldingen bij berichten hebben een correcte alt-tekst, bijvoorbeeld ‘artificial-intelligence-3382507_1280.jpg”. Deze afbeeldingen dienen als link, dus moeten in ieder geval het onderwerp van de link duidelijk beschrijven.
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: Niet van toepassing
1.2.3: Audiodescriptie of media-alternatief (vooraf opgenomen)
Hele sample

Uitkomst: Niet van toepassing
1.2.4: Ondertitels voor doven en slechthorenden (live)
Hele sample

Uitkomst: Niet van toepassing
1.2.5: Audiodescriptie (vooraf opgenomen)
Hele sample

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

Uitkomst: Onvoldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Uitkomst: Onvoldoende

Eigen overzicht

Uitkomst: Onvoldoende

Weten & regelen item Kantoorartikelen

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De titel bovenaan zoals Tijdlijn is niet als kop opgemaakt.

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

In de tabs bovenaan is de actieve tab een andere kleur (wit). Deze actieve status (geslecteerde tab) wordt niet doorgegeven aan de screenreader.

Eigen overzicht

Het invoerveld om te zoeken bovenaan heeft geen label.

Weten & regelen item Kantoorartikelen

De koppenstructuur is niet logisch opgemaakt. De kopjes in de uitgeklapte teksten hebben h2-niveau, maar zouden op een lager niveau moeten staan omdat ze binnen een uitklapsectie staan.
1.3.2: Betekenisvolle volgorde
Hele sample

Uitkomst: Voldoende
1.3.3: Zintuiglijke eigenschappen
Hele sample

Uitkomst: Voldoende
1.3.4: Weergavestand
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

De app kan niet gebruikt worden in landschapsmodus. Mensen die motorisch beperkt zijn kunnen niet altijd het device draaien. Zorg daarom dat alles altijd bereikbaar is op portret- en op landschapsmodus.
1.3.5: Identificeer het doel van de input
Hele sample

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Profiel bewerken

De invoervelden voor persoonlijke informatie zoals geboortedatum en telefoonnummer hebben geen mechanisme waarmee de invoer automatisch kan worden aangevuld. Dit maakt het invullen van formulieren voor veel gebruikers gemakkelijker, bijvoorbeeld voor mensen voor wie het invoeren van tekst veel tijd kost omdat dit via speciale hulpmiddelen gaat, of voor mensen met cognitieve beperkingen. 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: Onvoldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Uitkomst: Onvoldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

In veel bijdragen staan links alleen aangeven met een verschil in kleur (donkerblauw i.p.v. grijs). Dit is mogelijk niet voor iedereen duidelijk. Voeg bijvoorbeeld onderstreping toe of maak deze tekst vetgedrukt. Dit komt op meerdere schermen voor waar bijdragen staan, zoals op de Tijdlijn.
1.4.2: Geluidsbediening
Hele sample

Uitkomst: Niet van toepassing
1.4.3: Contrast (minimum)
Hele sample

Uitkomst: Onvoldoende

Nieuws

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Tekst moet een contrast hebben van minimaal 4,5:1 voor slechtzienden en kleurenblinden. Dat geldt ook voor actieve elementen zoals op hover en focus. Onderstaande elementen op de website zitten qua contrast onder deze waarden.

De hoofdmenuitems onderaan zoals Groepen en Collega’s (3.2:1).

Nieuws

Bij de bovenste 2 items staat de tekst (datum en titel) boven een foto. Het contrast tussen de witte tekst (inclusief schaduw) en de achtergrond is niet overal voldoende.

Dit issue komt ook voor bovenaan binnen een nieuwsbericht en een kalenderitem.

Profiel bewerken

De datum bij het toevoegen van een ervaring (4.3:1). Zie screenshot nummer 143-1.
1.4.4: Herschalen van tekst
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

De layout is niet schaalbaar. Wanneer onder toegankelijkheidsinstellingen een groter lettertype wordt geselecteerd, blijven de letters in de app even groot. Hierdoor is het lastig voor slechtzienden om de app te gebruiken. Zorg dat de tekst minimaal 200% groter kan worden zonder verlies van content.
1.4.5: Afbeeldingen van tekst
Hele sample

Uitkomst: Voldoende
1.4.10: Reflow
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

Doordat de layout niet schaalbaar is, is het onmogelijk om grotere tekst te lezen zonder in 2 richtingen te scrollen. Zorg dat de ingestelde tekstgrootte aangepast wordt in de app tot minimaal 400% en dat de content daarna in 1 kolom te lezen is.
1.4.11: Contrast van niet-tekstuele content
Hele sample

Uitkomst: Onvoldoende

Weten & Regelen

Uitkomst: Onvoldoende

Zoekresultaten vergoedingen

Uitkomst: Voldoende

Hele sample

Bevindingen:

Grafische elementen moeten een contrast hebben van minimaal 3:1. Dit geldt ook voor de randen of achtergrondkleur van invoervelden. Onderstaande elementen in de app zitten qua contrast onder deze waarden.

Weten & Regelen

De zoek button (wit/lichtblauw, 1.1:1).

Zoekresultaten vergoedingen

Opmerking: het zoeken invoerveld bovenaan heeft een donkerblauwe achtergrond in een blauwe omgeving. Er is een dunne witte knipperende cursor, maar het kan lastig zijn voor slechtziende gebruikers om het invoerveld goed te onderscheiden. Het zou duidelijker zijn als het invoerveld een lichtere kleur heeft.
1.4.12: Tekstafstand
Hele sample

Uitkomst: Voldoende
1.4.13: Content bij hover of focus
Hele sample

Uitkomst: Niet van toepassing

2 Bedienbaar

2.1 Toetsenbordtoegankelijk
Success Criterium Uitkomst Bevindingen
2.1.1: Toetsenbord
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

De app is lastig te bedienen met het (externe) toetsenbord. De tab en pijltjestoetsen werken vaak niet en ook het switchen tussen de webview en de hoofdnavigatie is erg onvoorspelbaar. Een aantal taken was in het geheel niet uit te voeren, zoals het reageren op berichten, het aanpassen van de afbeeldingen in het profiel en het bewerken van de datum bij het toevoegen van ervaring. Hierbij wordt al opgeslagen terwijl er alleen nog maar een datum geslecteerd is in de datepicker (en nog niet gekozen).
2.1.2: Geen toetsenbordval
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

Op veel schermen kom je vast te zitten in de webview (middelste content) en kun je niet meer verder/terug naar de hoofdnavigatie. Zorg dat je kunt navigeren via Tab en Shift Tab tussen interactieve onderdelen zoals knoppen en links, en daarnaast met pijltjestoetsen en de Escape toets om bijvoorbeeld uit een popup te komen.
2.1.4: Enkel teken sneltoetsen
Hele sample

Uitkomst: Niet van toepassing
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: Niet van toepassing
2.4.2: Paginatitel
Hele sample

Uitkomst: Niet van toepassing
2.4.3: Focus volgorde
Hele sample

Uitkomst: Onvoldoende
Hele sample

Bevindingen:

De focusvolgorde in de app is erg onvoorspelbaar en onlogisch. Bijvoorbeeld op de tijdlijn (eerste scherm na openen van de app) gaat de focus eerst naar de +-knop, dan naar de Collega’s tab in het menu onderaan en daarna in de webview. Na het doorlopen van alle bijdragen in de tijdlijn verwacht je weer in het menu onderaan te komen, maar dat is niet het geval. Je kunt dan niet meer verder navigeren. Het is onduidelijk hoe je hier weer verder kunt gaan en je loopt dus vast. Dit komt op veel schermen voor.
2.4.4: Linkdoel (in context)
Hele sample

Uitkomst: Voldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Uitkomst: Voldoende

Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages)

Opmerking: Onder de berichten met gedeelde links staat een link achter de foto en achter de titel. Beide kunnen focus krijgen en worden voorgelezen door hulpsoftware. Dit zorgt voor veel dubbele informatie en kliks. Haal bijvoorbeeld de link achter foto weg en maak het gehele blok in een keer aanklikbaar.

2.4.5: Meerdere manieren
Hele sample

Uitkomst: Niet van toepassing
2.4.6: Koppen en labels
Hele sample

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Profiel bewerken

Naast de kop ‘Profiel’ staat een knop met een pen. Deze heeft als naam ‘baseline edit white 24pt knop nieuw’. Dit is nogal onduidelijk. Maak hier bijvoorbeeld ‘bewerken’ van.
2.4.7: Focus zichtbaar
Hele sample

Uitkomst: Niet getoetst
Hele sample

Bevindingen:

Doordat veel onderdelen niet werken met het toetsenbord is dit niet goed te testen.
2.4.11: Focus Not Obscured (Minimum)
Hele sample

Uitkomst: Niet getoetst
Hele sample

Bevindingen:

Doordat veel onderdelen niet werken met het toetsenbord is dit niet goed te testen.
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: Voldoende
2.5.4: Bewegingsactivering
Hele sample

Uitkomst: Niet van toepassing
2.5.7: Dragging Movements
Hele sample

Uitkomst: Niet van toepassing
2.5.8: Target Size (Minimum)
Hele sample

Uitkomst: Voldoende
Hele sample

Bevindingen:

Opmerking: De links bovenaan in bijdragen (naam, datum, bewerkt etc) staan dicht op elkaar, waardoor het lastig kan zijn om de juiste link te activeren. Het wordt aangeraden het aanwijsgebied van de links wat groter te maken (minimaal 24px) en/of de ruimte tussen de links te vergroten. Omdat het hier om inline onderdelen gaat (lopende tekst, afhankelijk van line-height) wordt het niet afgekeurd. Dit geldt ook voor links binnen paragrafen zoals 'lees meer'.

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: Niet van toepassing
3.2 Voorspelbaar
Success Criterium Uitkomst Bevindingen
3.2.1: Bij focus
Hele sample

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Profiel bewerken

Er worden acties uitgevoerd bij focus op onderdelen, zoals het navigeren door de datumprikker met een extern toetsenbord. Zorg dat acties zoals opslaan pas worden uitgevoerd nadat de optie is geslecteerd (en bevestigd via de Opslaan knop).
3.2.2: Bij input
Hele sample

Uitkomst: Voldoende
3.2.3: Consistente navigatie
Hele sample

Uitkomst: Niet van toepassing
3.2.4: Consistente identificatie
Hele sample

Uitkomst: Niet van toepassing
3.2.6: Consistent Help
Hele sample

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

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Profiel bewerken

Wanneer er foutmeldingen zijn gevonden bij het verzenden van het formulier (bijvoorbeeld bij het toevoegen van een opleiding of ervaring) wordt er niet duidelijk aangegeven wat er fout is gegaan. ‘Het veld X is verplicht’ is een algemene instructie (die er ook al kon staan voor het verzenden). Een goede foutmelding is wanneer er bijvoorbeeld wordt aangegeven dat een veld niet is ingevuld, of niet correct is ingevuld. Een alternatief kan zijn: het plaatsen van een algemene melding bovenaan het formulier dat er fouten zijn gevonden. Dan mag wel worden volstaan met de melding ‘Veld X is verplicht’.
3.3.2: Labels of instructies
Hele sample

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Profiel bewerken

Er wordt niet aangegeven welke velden verplicht zijn. Dit wordt pas duidelijk na het opslaan, wanneer deze gecorrigeerd moeten worden. Geef van tevoren aan welke velden verplicht of optioneel zijn.
3.3.3: Foutsuggestie
Hele sample

Uitkomst: Niet van toepassing
3.3.4: Foutpreventie (wettelijk, financieel, gegevens
Hele sample

Uitkomst: Niet van toepassing
3.3.7: Redundant Entry
Hele sample

Uitkomst: Niet van toepassing
3.3.8: Accessible Authentication (Minimum)
Hele sample

Uitkomst: Voldoende

4 Robuust

4.1 Compatibel
Success Criterium Uitkomst Bevindingen
4.1.2: Naam, rol, waarde
Hele sample

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De reageren knop of link onder berichten heeft geen duidelijke rol (is het een knop of link?). Na het activeren hiervan komt de focus niet in de popup. De elementen hiervan zijn niet beschikbaar voor hulpsoftware. Zie ook 2.1.1.

Profiel bewerken

Bovenaan de pagina staan 2 knoppen om te bewerken (pen icoontjes). Deze knoppen hebben geen rol en naam voor hulpsoftware. Bij activeren opent een menu. Dit wordt niet aangegeven aan hulpsoftware. De opties in dit menu hebben ook geen duidelijke rol.

Bij Kennis en Competenties kun je kernwoorden verwijderen via een kruisje. Deze knop heeft geen rol en naam en is niet beschikbaar voor de screenreader. De knop om een competentie toe te voegen heeft geen naam en rol. De knop om deze invoer weer te sluiten heeft ook geen naam en rol.
4.1.3: Statusberichten
Hele sample

Uitkomst: Onvoldoende

Instellingen

Uitkomst: Onvoldoende

Instellingen

Na het opslaan van de wijzigingen volgt een bevestingsbericht. Deze wordt niet doorgelezen door VoiceOver. Dit komt ook voor bij wijzigingen in het profiel.

Sample met getoetste schermen

  1. Tijdlijn - Startscherm
  2. Groepen - Startscherm > Groepen
  3. Groep Communicatie & KCC (incl tabs pages, leden, profiel) - Startscherm > Groepen > Communicatie & KCC (AM)
  4. Collega's - Startscherm > Collega's
  5. Profiel medewerker (incl tabs berichten, connecties, gedeelde documenten, pages) - Startscherm > Zoeken (naam) > Profiel (naam)
  6. Notificaties - Startscherm > Notificaties
  7. Eigen overzicht - Startscherm >Meer > Janita Top
  8. Nieuws - Startscherm >Meer > Janita Top > Nieuws
  9. Nieuwsbericht bevolkingszorg (incl. reacties) - Startscherm >Meer > Janita Top > Nieuws > Bevolkingszorg is op zoek naar jou
  10. Kalender - Startscherm >Meer > Janita Top > Kalender
  11. Kalender item ambtenarentoertocht (incl comment) - Startscherm >Meer > Janita Top > Kalender > Ambtenarentoertocht voor fietsers en mountainbikers
  12. Weten & Regelen - Startscherm >Meer > Janita Top > Weten & regelen
  13. Weten & regelen item Kantoorartikelen - Startscherm >Meer > Janita Top > Weten & regelen > Kantoorartikelen
  14. Instellingen - Startscherm >Meer > Janita Top > Instellingen
  15. Zoekresultaten vergoedingen - Startscherm >Meer > Janita Top > Zoekresultaten
  16. Profiel bewerken - Startscherm >Meer > Janita Top > Profiel > Profiel bewerken
  17. Random pagina 1 - Startscherm >Meer > Janita Top > Nieuws > Ondertekening contract vervanging afvalsysteem Stadsreiniging
  18. Random pagina 2 - Startscherm >Meer > Janita Top > Invisible ICT > E-mail handtekening instellen

Webtechnologie

HTML,CSS,WAI-ARIA,JavaScript,SVG

Onderbouwing van de evaluatie

Gebruikte systemen tijdens het onderzoek:

Embrace Social Intranet versie 1.42 (geïnstalleerd vanuit de Apple Store).
Downloadlink: https://apps.apple.com/nl/app/embrace-social-intranet/id1230443392
Er is getest op de live omgeving met een eigen account.