Albert Heijn

Albert Heijn

URL voorpagina: https://www.ah.nl/
Datum van testen: 06 november 2023
Getest door: Florian Schroiff

Er kunnen boodschappen besteld worden, al is de manier waarop soms vrij onhandig of zelfs frustrerend. 

Verbeterpunten

Zoals vorig jaar: 

• Kleurcontrast. De AH huisstijl kleur blauw heeft een te laag contrast ten opzichte van een witte achtergrond, waardoor blauwe tekst moeilijker leesbaar is.
• Het menu geeft een onlogische tabvolgorde en het submenu onder de inlogknop is onbereikbaar.
• Niet alles wordt duidelijk voorgelezen voor schermlezers.
• Visuele focus voor toetsenbord gebruikers mist soms. Waar ben ik? Bij een aantal functies is het tabs tellen geblazen om een knop te kunnen vinden en bedienen.

Nieuw:

• Er zijn allerlei skiplinks bij gekomen, maar helaas werken die lang niet altijd betrouwbaar. Dit laat aan de ene kant zien dat er aan accessibility gewerkt wordt, aan de andere kant toont het een gebrek aan kennis en zorgvuldigheid.
• Op veel plekken is het gebruiken van de site moeilijker geworden ten opzichte van vorig jaar. In één geval (het ingeven van een bezorgadres) kunnen schermlezer gebruikers de functie helemaal niet meer gebruiken.
• Bij het afrekenen is er een optie om een actiecode in te voeren, die is niet te gebruiken met het toetsenbord en/of de schermlezer. Gebruikers met een motorische of visuele beperking kunnen dus nooit een kortingscode invoeren!
• Puur op het oog lijkt de verslechtering te komen door toevoeging van geheel in isolatie ontwikkelde componenten die niet in de samenhang van een volledige pagina bekeken of getest zijn. 
• Waarschijnlijk worden de componenten door verschillende teams ontwikkeld die niet allemaal op hetzelfde niveau zitten wat betreft kennis van web accessibility. 
• Training voor iedereen die frontend-facing code schrijft is van belang, het is een team effort
• Maar er moet ook iemand zijn die zich voor het geheel verantwoordelijk voelt. Aangezien er veel slordigheden in zitten lijkt dat nu niet het geval te zijn.

Ten opzichte van vorig jaar

• Het filter bij zoekresultaten is iets verbeterd en nu met moeite te gebruiken in plaats van niet 
• Cookies accepteren met toetsenbord is iets moeilijker geworden door een nauwelijks zichtbare focus-indicator en een onlogische tab-volgorde
• Het zoekveld is minder bruikbaar geworden voor screenreader gebruikers door het ontbreken van een toegankelijk label op het veld en de zoek-button
• Bezorgmoment kiezen is moeilijker geworden voor toetsenbord gebruikers door ontbrekende focus-indicators
• Betaalwijze kiezen is moeilijker geworden voor iedereen door toevoeging van een ontoegankelijk “actiecode” widget
• (Gereduceerde) prijzen worden onduidelijk voorgelezen

Kan ik de cookies accepteren en daarna de website gebruiken?

Testresultaten toetsenbord

De focus outline is moeilijk te zien bij de “Accepteer” knop, zit er te dicht op én is bijna dezelfde kleur blauw. 

De tab-volgorde is onlogisch, van rechts naar links in plaats van andersom. 

Met het toetsenbord kunnen de cookies geaccepteerd, geweigerd of aangepast worden. 

Testresultaten VoiceOver

Met VoiceOver kunnen de cookies geaccepteerd, geweigerd of aangepast worden.

Kan ik het hoofdmenu gebruiken?

Testresultaten toetsenbord

Focus stijlen lopen uiteen

Bij “Meer” in het submenu krijgt alleen de tweede link een outline, de eerste en derde niet

Als je naar het zoekveld tabt klapt die open en blijft hij opengeklapt ook al tab je verder.

Als je vervolgens esc drukt om zoekveld te sluiten is je focus weer aan het begin van de pagina

Eerste menu (“Mijn Albert Heijn premium … “) is zo lang dat items buiten beeld vallen

Submenu onder inloggen/mijn profiel is niet te openen

Submenu onder inloggen is wel te openen wanneer men ingelogd is

Testresultaten VoiceOver

Submenu onder inloggen/mijn profiel is niet te openen

Kan ik de zoekfunctie op de voorpagina gebruiken?

Ik zoek op keukenweegschaal

Testresultaten toetsenbord

Dit werkt goed.

Testresultaten VoiceOver

Zoekformulier is geen landmark

Zoekveld heeft geen accessible naam / label

Submit-knop heeft geen accessible naam

Placeholder “Waar ben je naar op zoek?” wordt voorgelezen indien het veld leeg is, dit is het enige wat duidt op een zoekveld. Op een zoekresultatenpagina is het zoekveld ingevuld en hoor je de placeholder niet meer. Zo wordt het gokken.

Opvallende notitie: Als je met een schermlezer door de zoeksuggesties leest ontstaat er na een tijdje een fout op de pagina en herlaadt de gehele pagina. 

Kan ik het filter bij de zoekresultaten gebruiken?

https://www.ah.nl/zoeken?query=erwtensoep

Testresultaten toetsenbord

Visuele focus is redelijk in de zijbalk

In- en uitklappen van subsecties kan met spatie en enter

Checkbox kan geselecteerd worden

“Toon meer” kan alleen met enter in- en uitgeklapt worden.

Checkbox is geen echte checkbox. De manier van besturing is anders dan met een normale checkbox, waardoor van tevoren niet duidelijk is hoe dit werkt. Je hoort een checkbox met de spatiebalk aan te kunnen vinken. Dit moet nu met enter. 

Knoppen om filters te wissen hebben geen zichtbare focus

Er is een blauwe “I” met aanvullende info bij sommige filter-titels, die is niet bereikbaar met het toetsenbord.

Heel fijn: de keyboard focus blijft op een logische plek, ook al veranderen de resultaten. Hierdoor hoef je niet constant naar beneden te tabben om weer bij het filter te komen.

Heel fijn: Spring naar hoofdcontent link. Helaas skipt de skiplink aan de bovenkant het zoekfilter, waardoor je meteen op de zoekresultaten terecht komt. Dan moet je dus alsnog het hele menu door, of terug tabben door het filter menu.

Testresultaten VoiceOver

De filters zijn te gebruiken, ook al is de uitwerking niet altijd duidelijk. Vorig jaar konden de filters helemaal niet gebruikt worden.

Je hoort niet het aantal dat achter de filter staat.

Je hoort niet of iets geselecteerd is of niet, omdat er geen gebruik gemaakt wordt van reguliere checkboxes.

Na elke filter-actie hoor je “50% loaded”, je hoort geen feedback of je resultaten veranderd zijn.

Kan ik een product bekijken (titel, prijs en omschrijving)?

https://www.ah.nl/producten/product/wi468205/unox-vegetarische-erwtensoep

Testresultaten toetsenbord

Ja, dit kan.

Testresultaten VoiceOver

Ja, dit kan. Alles over het product wordt goed voorgelezen, de prijs wordt echter niet als een bedrag voorgelezen. 

Wanneer een product in de aanbieding is, wordt er geen duidelijk onderscheid uitgesproken tussen de reguliere prijs en de aanbiedingsprijs. 

Kan ik de opties wijzigen/ingeven (kleur, maat, aantal)?

Testresultaten toetsenbord

Ja, dit werkt goed. 

Testresultaten VoiceOver

Er zijn duidelijke labels aan de knoppen toegevoegd. Alleen de “voeg toe” knop heeft een verwarrende accessible name “plus”.

Er is duidelijke feedback hoorbaar welk product in het winkelmandje is gestopt.

De focus wordt pas na een interval terug op de plus / min knoppen geplaatst. Als je direct begint met tabben ben je aan het begin van de pagina en moet je weer handmatig terug tabben.

Kan ik het winkelwagentje openen en uitlezen wat ik heb besteld?

Testresultaten toetsenbord

Dat kan. Prullenbak bij product heeft onduidelijke focus-staat.

Prullenbak, hart, printer iconen bovenaan de lijst hebben geen visuele focus. Het is ook niet direct duidelijk wat de functie is

Testresultaten VoiceOver

De winkelwagen knop heeft een duidelijke naam.

De winkelwagen knop in het menu geeft visueel ook de totaalprijs aan. Dit is met de screen reader niet te horen. 

De winkelwagen is goed uit te lezen.

Afbeeldingen hebben als alt-tekst “Een afbeelding van [productnaam]”. Dat is dubbelop, gebruikers van schermleessoftware weten al dat het een afbeelding is.

Kan ik een account aanmaken?

Testresultaten toetsenbord

De radio buttons hebben slechte visuele focus. Bij het doorgaan zonder invullen komt er een validatiefout en is er helemaal geen visuele focus. Ook heeft de “toon wachtwoord” knop geen visuele focus. Dit was vorig jaar ook het geval.

Niet alle “info” buttons zijn met het toetsenbord bereikbaar.

Testresultaten VoiceOver

Nieuw bij het aanmelden bij Albert Heijn is dat je een bonuskaart moet selecteren. Dit formulier is onduidelijk, omdat de keuzerondjes geen toegankelijke naam hebben. Je moet verder lezen om uit de context te begrijpen wat de twee verschillende keuzes zijn. 

Nog niet relevante stappen zijn selecteerbaar en hebben een naam “2” of “3”.

De dynamische foutmeldingen bij de velden worden niet hardop voorgelezen. Onderaan wordt de “aanmelden” knop disabled, maar doordat de foutmelding dynamisch is wordt dit niet uitgesproken. Het aanmelden kan nu dus niet, dit is erg verwarrend. Dit was vorig jaar ook het geval. 

De “info” button bij het wachtwoord veld heeft geen toegankelijke naam en wordt uitgesproken als “button”. Dit is verwarrend.

De “info” buttons bij Geboortedatum en Telefoonnummer worden voorgelezen als “image” en zijn niet te activeren.

De vinkjes worden allemaal voorgelezen als “image”, dat is irritant.

Kan ik inloggen?

https://login.ah.nl/login

Testresultaten toetsenbord

Ja!

Testresultaten VoiceOver

👍 Loginknop heeft nu een screen reader naam “Inloggen”. 

Dynamische validatie wordt niet uitgesproken door een screen reader. Dit was vorig jaar ook het geval. 

Kan ik een bezorgadres ingeven?

De skiplink in dit onderdeel werkt niet.

Testresultaten toetsenbord

Werkt goed.

Testresultaten VoiceOver

De “info” buttons bij Geboortedatum en Telefoonnummer worden voorgelezen als “image” en zijn niet te activeren

De dynamische foutmeldingen bij de velden worden niet hardop voorgelezen. Onderaan wordt de “aanmelden” knop disabled, maar doordat de foutmelding dynamisch is wordt dit niet uitgesproken. Het aanmelden kan nu dus niet, dit is erg verwarrend.

Kan ik een bezorgmoment kiezen?

De skiplink in dit onderdeel werkt niet.

Testresultaten toetsenbord

Geen focusring bij datum-keuze

Bezorgbundel upsell heeft geen focusring

Testresultaten VoiceOver

Er kan een dag en tijd gekozen worden. De knoppen om een week op te schuiven hebben geen naam, het is dus niet duidelijk dat je ook verder in de toekomst kunt bestellen. Dit was vorig jaar ook het geval. 

Vanafprijs per dag wordt voorgelezen

Maar: Ook staat er in elke tijdvak-keuze-knop visueel een prijs van dat bezorgmoment, dit wordt door de screen reader niet uitgesproken. Iemand weet dus niet wat het bezorgmoment kost op het moment van selecteren. Dit is onveranderd sinds vorig jaar. 

De bezorgbundel upsell checkbox heeft geen label. Ook staat dit tussen de tijdvak opties. Doordat de opties opgemaakt zijn als button, in plaats van keuzerondjes, weet je als schermlezer gebruiker niet hoeveel opties er zijn en dat de opties verder gaan na deze onbekende checkbox. 

Kan ik het eindbedrag en de bezorgkosten uitlezen?

Testresultaten toetsenbord

Ja, dit werkt goed.

Testresultaten VoiceOver

Je kunt het goed uitlezen tot het subtotaal. Vervolgens zit er een knop om dit element uit te klappen, zonder accessible name. Als je de knop activeert hoor je niet wat er gebeurt. De focus blijft op deze knop staan, dus bij het selecteren van het volgende element mis je de totaalprijs die boven de knop is komen te staan en weet je dus niet dat er nog een totaalprijs te lezen is (die hoger is dan de subtotaal prijs). Dit is onveranderd sinds vorig jaar. 

Kan ik de wijze van betalen kiezen?

Testresultaten toetsenbord

Niet van toepassing, omdat je geen betaalmethode kunt kiezen. Je kunt wel duidelijk lezen hoe er wel betaald kan worden.

“Vul hier je actiecode in” is niet met het toetsenbord bereikbaar. Je kunt dus nooit een code invullen. 

Voordat je bij de betalen-knop komt: bij leeftijdscontrole is er een knop “Ik ben 18 jaar of ouder” die geen focus state heeft

Testresultaten VoiceOver

Niet van toepassing, omdat je geen betaalmethode kunt kiezen. Je kunt wel duidelijk lezen hoe er wel betaald kan worden.

Je kunt geen actiecode invullen, omdat dit veld niet met het toetsenbord te openen is. Met een schermlezer hoor je “Ik be, contents selected, edit text”. Je weet niet dat je hier iets moet doen om een actiecode in te vullen. 

Kan ik om hulp vragen via de website?

https://www.ah.nl/klantenservice

Testresultaten toetsenbord

Tab je verder vanuit de knop “belangrijke informatie” word je doorgestuurd naar de pagina “belangrijke informatie”.

Er is geen visuele focus zichtbaar op de items. Rechtsonder in de pagina zit een Contact knop. Doordat de focus volgorde niet klopt op de pagina en er geen visuele focus zichtbaar is, is het niet te doen om deze knop te selecteren. Dit was vorig jaar ook al het geval en is dus onveranderd. 

Testresultaten VoiceOver

De knop “open chat” is te bereiken. Bij het selecteren van de knop klapt er een dynamisch menu uit.

Je hoort “typ je vraag of bericht”

Er staat allerlei info en keuzemogelijkheden in het chatvenster, die zijn niet per tab te bereiken.

Je tabt makkelijk uit het chatvenster, dit is verwarrend.

Bedieningselementen binnen de chat (chatsuggesties) zijn niet per tab te bereiken. 

Tab je verder vanuit de knop “belangrijke informatie” word je doorgestuurd naar de pagina “belangrijke informatie”…