De Bijenkorf
Onze bevindingen over de webwinkel van de Bijenkorf
De laatste versie van het webwinkel toegankelijkheidsonderzoek is nu beschikbaar.
Elk jaar voeren we een onderzoek uit naar de toegankelijkheid van de grootste webwinkels van Nederland. Je leest nu een onderzoek uit ons archief uit voorgaande jaren. Leer meer over de toegankelijkheid van webshops in ons meest recente onderzoek.
De Bijenkorf
De Bijenkorf heeft in 2022 een eindscore van 62%. Vorig jaar was de score 51%.
URL voorpagina: https://www.debijenkorf.nl/
Datum van testen: 6 december 2022
De website van de Bijenkorf heeft nog veel werk te doen om toegankelijk te worden. Het is momenteel niet mogelijk om met het toetsenbord een bestelling te plaatsen.
De grootste problemen die wij tegenkwamen:
- Er lijkt een soort bug te zijn, waardoor de website volledig blokkeert als het in Safari wordt geopend met VoiceOver aan. De gehele site kon hierdoor niet getest worden, in plaats daarvan is Chrome gebruikt, echter is dit niet wenselijk in combinatie met VoiceOver;
- het hoofdmenu en alle uitklap modals aan de zijkant zijn slecht te bereiken met een toetsenbord of onvindbaar voor een schermlezer;
- De opties van een product kunnen niet gewijzigd worde met het toetsenbord;
- Er kan geen bezorgmoment gekozen worden met het toestenbord.
Problemen per stap bij de Bijenkorf
Stap 1: kan ik cookies accepteren, en daarna de website gebruiken:
De cookie banner staat helemaal onderaan de pagina in de code en heeft geen kopje. De toestenbord gebruikers moeten de gehele pagina doortabben. De schermlezer gebruiker zal de cookiebanner moeilijk kunnen ontdekken.
Stap 2. kan ik het hoofdmenu gebruiken:
Toetsenbord: De eerste paar menu-items krijgen focus en hebben een duidelijke focus stijl.
Als daarna de focus naar het zoekveld gaat, opent een zoek-modal dat de gehele pagina overlapt. Bij verder navigeren blijft deze grijze overlay openstaan en het is met moeite te zien dat de opties ‘mijn account’, ‘favorieten’ en ‘winkelmandje’ focus krijgen. Het is mogelijk met de ‘pijltje naar rechts’ knop de zoekoptie te sluiten, maar het opent weer vanzelf als je verder wilt tabben. Het modal sluit wel met de escape toets.
De opties mijn account, verlanglijstje en winkelmandje openen allemaal een modal dat geen focus krijgt. Ze zijn alleen te bereiken door helemaal door de pagina heen te navigeren.
Stap 4. kan ik het filter bij de zoekresultaten gebruiken:
Voor schermlezer gebruikers is dit lastig, omdat de knoppen geen toegankelijke naam hebben. Alle knoppen worden ook als volgt uitgesproken “Maat arrow dash small underscore down”, vanwege het icoontje wat in de knop zit.
Stap 6. Kan ik een product bekijken:
De prijs is met een schermlezer onduidelijk aangeduid. Je hoort “57 22,80 60%”. Dit is dus een shirt van 57 euro wat met 60% afgeprijsd is naar 22,80.
Stap 7. kan ik opties wijzigen/ingeven: kleur, maat, aantal:
De knoppen krijgen geen visuele focus en de maat kan helemaal niet aangepast worden. Ook hebben de velden geen labels, waardoor je met een schermlezer niet hoort wat je aan het kiezen bent.
Stap 9. kan ik het winkelwagentje openen en uitlezen wat ik heb besteld:
Toetsenbord: De handeling op zich, het openen van de winkelwagen, gaat goed. Echter de modal om verder te bestellen is slecht bereikbaar, want deze bevindt zich onderaan de pagina in de code en wordt ook niet aangekondigd. Het modal is niet weg te halen met de escape key.
Stap 10. kan ik naar bestellen:
Toetsenbord: Met moeite, het modal staat onderaan de tabvolgorde.
Op de checkout pagina krijgt de optie voor ‘verwijderen’ geen visuele toetsenbord focus. De winkelwagen knop heeft ook geen toegankelijke naam voor schermlezers. Je weet dus niet welke knop de winkelwagen knop is.
Stap 11. kan ik een account aanmaken:
VoiceOver: Er wordt niet aangegeven wat verplichte velden zijn en er wordt geen feedback uitgesproken voor foutmeldingen.
Stap 13. kan ik een bezorgadres ingeven:
VoiceOver: Er wordt niet aangegeven wat verplichte velden zijn en er wordt geen feedback uitgesproken voor foutmeldingen
Stap 14. kan ik een bezorgmoment kiezen:
De knoppen krijgen geen visuele focus, als je telt om naar de bezorgopties knop te gaan opent het model aan de zijkant weer en moet de gebruiker weer de hele pagina doortabben. Nu krijgt het modal helemaal geen toetsenbordfocus. Je kunt dus geen bezorgmoment kiezen.
Vergelijking met vorig jaar
De Bijenkorf lijkt nog enige aandacht geschonken te hebben aan de toegankelijkheid, maar de grootste blokkerende factoren zijn nog steeds aanwezig en ook dit jaar is het niet mogelijk om een bestelling te plaatsen, omdat er geen bezorgmoment gekozen kan worden.
Dit jaar is er ook een bug bij gekomen, waardoor besturing met Safari, in combinatie met VoicOver onmogelijk is.
Een aantal zaken zijn verbeterd:
- Het filter bij de zoekresultaten is beter toegankelijk met het toetsenbord.
- De betaalmethode kan gekozen worden met het toetsenbord.
Codekwaliteit de Bijenkorf
Totaal 69 van de 100 punten.
- knoppen zonder toegankelijke naam;
- formuliervelden zonder gekoppelde labels;
- onvoldoende kleurcontrast voor sommige teksten;
- afbeeldingen zonder alternatieve tekst;
- SVG elementen zonder alternatieve tekst.
