Rapport in PDF

Onderzoek toegankelijkheid Alfie intranet gemeente Almere Android 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 40 van de 55 criteria voor toegankelijkheid (34 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
  • Niet alle content is bereikbaar bij inzoomen
  • 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 Android app
Scope van de website
Alle schermen in de Android app.
Embrace Social Intranet versie 1.63
WCAG Versie
2.2
Conformiteitsdoel
AA
Basisniveau van toegankelijkheid-ondersteuning
Gangbare webbrowsers en hulpapparatuur.
Verdere onderzoeksvereisten

Uitgebreide toetsresultaten

Samenvatting

Gerapporteerd over 55 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

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.

In het hoofdmenu onderaan is heeft de actieve knop een andere kleur (blauw). Deze actieve status 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

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 (2.57: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.

1.4.4: Herschalen van tekst
Hele sample

Uitkomst: Onvoldoende

Groep Communicatie & KCC (incl tabs pages, leden, profiel)

Uitkomst: Onvoldoende

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

Uitkomst: Onvoldoende

Nieuws

Uitkomst: Onvoldoende

Weten & Regelen

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Maak de layout zodanig responsive dat alle content bij inzoomen tot minimaal 200% beschikbaar blijft. Op onderstaande plekken in de app is dit niet het geval. Dit is getest met het vergroten van het lettertype onder de toegankelijkheidsinstellingen.

Groep Communicatie & KCC (incl tabs pages, leden, profiel)

Bij een bijdrage met documenten staat bij kleinere tekstgrootte de tekst ‘Geen voorbeeldweergave beschikbaar’. Bij grotere tekst valt deze weg achter het icoon van het document. Alleen de eerste G is nog zichtbaar. Zie screenshot nummer 144-1.

Wanneer je het bericht wil delen, zijn de teksten maar deels leesbaar. Ook zijn niet alle opties meer te gebruiken (Bericht of Vraag). Zie screenshot nummer 144-2.

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

De link ‘Niet meer volgen’ wordt afgesneden aan de onderkant en is daardoor slecht leesbaar. Dit geldt voor meer links die met deze layout zijn opgemaakt, zoals contact links binnen Weten en Regelen items.

Nieuws

Bij de bovenste 2 items is de datum niet meer zichtbaar. Bij selectie van een nieuwsbericht valt de datum bovenaan half buiten beeld.

Weten & Regelen

De letters in het alfabet vallen deels buiten de blauwe blokken en zijn daardoor moeilijk te herkennen. Zie screenshot nummer 144-3.

Profiel bewerken

In het menu vallen woorden weg, zoals ‘informatie’ achter ‘persoonlijke’. Zie screenshot nummer 144-4. Ook vallen delen van teksten weg bij het bewerken van details, zoals bij het toevoegen van een opleiding.

1.4.5: Afbeeldingen van tekst
Hele sample

Uitkomst: Voldoende

1.4.10: Reflow
Hele sample

Uitkomst: Voldoende

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 groene 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

Tijdlijn

Uitkomst: Onvoldoende

Tijdlijn

De functie om een pagina/bericht te delen werkt niet met het toetsenbord. De knop er naar toe is niet te bedienen met het toetsenbord en de focus komt niet in de popup terecht. Dit geldt voor de +-button bovenaan het scherm en voor de Reageer knop onder berichten. Zie ook 4.1.2.

2.1.2: Geen toetsenbordval
Hele sample

Uitkomst: Voldoende

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

Tijdlijn

Uitkomst: Onvoldoende

Tijdlijn

Voor downloadlinks staan Acrobat icoontjes. Deze hebben geen alternatieve tekst, maar kunnen wel focus ontvangen. Haal de focus op deze iconen weg. Dit komt ook voor bij andere icoontjes zoals links en comments.

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: Voldoende

2.4.7: Focus zichtbaar
Hele sample

Uitkomst: Onvoldoende

Tijdlijn

Uitkomst: Onvoldoende

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

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

Opmerking: de focus op de terug pijl is slecht zichtbaar, er is erg weinig verschil tussen de blauwe (geen focus) en donkerblauwe achtergrond (focus). Dit geldt ook voor de zoekknop. Zorg dat dit verschil minimaal een contrastverhouding heeft van 3:1.

Op veel links/knoppen is het verschil tussen wit en lichtgrijs ook erg weinig (1.3:1). Zie het contextmenu en menu onderaan op screenshot nummer 247-1.

Tijdlijn

De toetsenbordfocus op de knop van het contextmenu is niet zichtbaar.

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

De focus op de link ‘Niet meer volgen’ is niet zichtbaar. Dit komt op meerdere links met deze layout voor.

2.4.11: Focus Not Obscured (Minimum)
Hele sample

Uitkomst: Voldoende

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: Voldoende

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

Groep Communicatie & KCC (incl tabs pages, leden, profiel)

Uitkomst: Onvoldoende

Profiel bewerken

Uitkomst: Onvoldoende

Hele sample

Bevindingen:

De Delen en Zoeken knop rechts bovenaan in de blauwe balk heeft geen goede naam (‘primary knop’).

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.

Groep Communicatie & KCC (incl tabs pages, leden, profiel)

In het menu onderaan wordt niet aangegeven wat de huidige geactiveerde knop is.

In de tabs bovenaan wordt niet aangegeven wat de huidige geactiveerde tab is.

Profiel bewerken

Bovenaan de pagina staan 2 knoppen om te bewerken (pen icoontjes). Deze knoppen hebben geen rol en naam voor hulpsoftware. TalkBack laat alleen een vreemd (Chinees/Koreaans?) karakter zien, maar leest niks voor.

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 woorden toe te voegen heeft enkel een vreemd teken en ook geen goede rol en naam.

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 TalkBack. 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.63 (geïnstalleerd vanuit de Google Play Store). Downloadlink: https://play.google.com/store/apps/details?id=com.embracesbs.embrace
Er is getest op de live omgeving met een eigen account.