Projects
Dotter Store: bewijs dat toegankelijk design niet saai moet zijn
Dotter is een nieuwe online winkel die Scandinavische skin care producten aanbiedt. De website is gebouwd in Shopify en vertoonde kritische problemen inzake toegankelijkheid:
Onvoldoende kleurcontrast, ook op de belangrijkste knoppen
Navigatieproblemen, met dubbele navigatie op desktop
Carrousels die niet bediend konden worden via toetsenbord
Afbeeldingen zonder alt text, of juist met repetitieve alt text
Ontbreken van labels op formulieren
Hidden links
Case: Dotter
URL: https://www.dotterstore.be
Research: accessibility audit
Doel: website toegankelijk maken, zonder in te boeten aan gebruiksvriendelijkheid en conversie
Redesign resultaat
Het grootste probleem, het gebrek aan contrasten en het monotone kleurgebruik, werd opgelost door een nieuw kleurenpalet te ontwikkelen, dat naast lichte ook contrastkleuren bevat. Deze contrastkleuren worden ingezet om de belangrijkste knoppen en acties extra in de verf te zetten, alsook om secties duidelijker van elkaar te onderscheiden. Hierdoor oogt de website ook overzichtelijker en gestructureerder.
De carrousel op de homepage van de bestselling items werd vervangen door een 2x2 grid. Het voordeel hiervan is dat de vier meest verkochte producten in één oogopslag zichtbaar zijn, zonder aan gebruiksvriendelijkheid in te boeten.
Problemen met de navigatie en het ontbreken van labels en alt text werden opgelost binnen Shopify zelf.
