Usability Review #2 – Albert.nl
In deze serie bespreek ik praktijkvoorbeelden van usability op websites. Hierbij focus ik op punten die vanuit gebruikersoogpunt beter kunnen, omdat slechte usability gebruikers hindert bij het bereiken van hun doelen. Dit tweede artikel behandelt de bezorgservice Albert.nl, waar je boodschappen van Albert Heijn, Etos en Gall&Gall kunt laten bezorgen.
Homepage Albert.nl
Hoofdingangen
Op de homepage van Albert.nl is het even zoeken naar de ingangen naar de on-line shops van Albert Heijn, Etos en Gall&Gall:
Albert.nl is een portaal naar deze webshops zodat de call-to-action in mijn optiek beter zou mogen: het hoofddoel van de pagina is de gebruiker naar de relevante webshop te krijgen.
De focus wordt echter gelegd op de kolommen onderlangs op de pagina, en de prominente postcode check rechtsboven. De hoofdingangen naar de shops vallen niet erg op doordat de teksten binnen visuals zijn gezet en de kleur van het Etos-vlak weinig contrast met de achtergrond heeft. In de kop (die je wel snel kunt scannen) staat alleen ‘De bezorgservice van…’.
De tekstlinks onder de visuals zijn ook gelijk (“> Direct winkelen”) zodat je als gebruiker niet snel kunt scannen welke ingang je moet hebben.
Scannen van teksten
Het lettertype op de homepage is erg klein en de onderlinge regelafstand is klein, wat lezen en snel scannen van teksten bemoeilijkt. Er ontbreekt ook een payoff die aan nieuwe bezoekers in één oogopslag duidelijk maakt wat je op de site kunt. In de middelste kolom staat een tekst over ‘Albert zakelijk’ en een link ‘Lees meer’. Door de uitlijning staat de link echter niet bij de tekst, waardoor hier weinig samenhang in is.
Postcodecheck
Bij de postcodecheck (rechtsboven op de pagina) valt op dat de invoer van de postcode bevestigd moet worden door op ‘>’ te klikken. Dit is niet alleen een klein klikvlak, maar ziet er ook niet als een button uit. Hier ontbreekt een duidelijke call-to-action en een groter klikvlak zou wenselijk zijn (Fitt’s law). Als je de postcode check gedaan hebt en Albert.nl blijkt niet in je gebied te bezorgen dan kun je je aanmelden voor een mailinglist. Als je de aanmelding annuleert dan keer je niet terug naar de homepage van Albert.nl, maar naar de webwinkel van Albert Heijn. Omdat het design van de webwinkel niet overeenkomt met Albert.nl kun je als gebruiker in verwarring raken.
Mogelijke suggestie portalfunctie
Om de portalfunctie van Albert.nl beter te benutten zou je een aantal punten kunnen overwegen:
- Je kunt de tekstlinks ‘Direct winkelen’ wijzigen in ‘> Winkel bij Albert Heijn’, ‘> Winkel bij Etos’ en ‘> Winkel bij Gall&Gall’;
- Om de call-to-action sterker te maken zou je de tekstlinks buiten de visuals kunnen plaatsen. Het is zelfs te overwegen om geen visuals voor de ingangen te gebruiken, maar alleen tekstlinks met de logo’s van AH, Etos en Gall&Gall ernaast;
- Met een verticale in plaats van horizontale opzet (de ingangen staan dus onder elkaar ipv naast elkaar) kan de gebruiker de hoofdingangen sneller scannen;
- Door (naast de bovengenoemde punten) visueel meer de nadruk te leggen op de hoofdingangen worden deze duidelijker voor de gebruiker.
De webshop
Omdat de webwinkels van Albert Heijn, Etos en Gall&Gall dezelfde opzet en hetzelfde stramien hebben beperk ik me tot het bespreken van één webshop, die van Albert Heijn.
Er wordt weinig nadruk gelegd op het feit dat Albert maar in een deel van Nederland bezorgt. Rechtsboven staat een instructietekst “Doe boodschappen in de webwinkel en laat alles bezorgen tot in de keuken”, zonder voorbehoud. Het bezorggebied beperkt zich tot Midden- en West-Nederland, Noord-Brabant en een gedeelte van Gelderland. Hierdoor bestaat de kans dat een gebruiker pas bij het afrekenen er achter komt dat Albert niet bij hem of haar bezorgt. Overigens wordt wel een pop-up getoond na het toevoegen van vijf artikelen (wat al aan de late kant is):
Bij de pop-up valt op dat de tekst niet kort en bondig is, dat de link nietszeggend is (“Klik hier”) en dat deze qua kleur niet opvalt omdat deze bijna dezelfde kleur heeft als de bodytekst.
Kleine klikvlakken
Wat verder opvalt in de webshop zijn de kleine klikvlakken als je het aantal wilt verhogen van een artikel:
In het boodschappenmandje kan dit tot problemen leiden. Stel dat ik het aantal pakken vanillevla wil verhogen van 1 naar 2 en per ongeluk op de min ipv de plus klik dan wordt mijn artikel direct verwijderd. Ook als je het artikel in het winkelmandje wil leggen is het klikvlak niet al te groot (!). Overigens heeft dit icoon wel een leuke feature: het icoon wijzigt zodra je een artikel toevoegt aan je winkelmandje:
In het winkelmandje valt verder op dat de artikelen gesorteerd staan op categorie, wat het snel scannen om te kijken of je alle artikelen hebt bemoeilijkt.
Visuele ruis
De homepage van de webshop zelf oogt rommelig door een wisselende uitlijning en is erg druk door het gebruik van kaders binnen kaders en veel achtergrondvlakken. Hierdoor ontstaat visuele ruis en kan je als gebruiker niet snel scannen: zaken vallen weg in de drukte. Daarnaast krijgt het middenvlak van de pagina een scrollbalk, in plaats van de hele pagina. Hierdoor kan ik niet eenvoudig naar beneden scrollen door mijn muiswiel te gebruiken, maar moet ik de muisaanwijzer boven het te scrollen gebied plaatsen. De breadcrumbtrail scrollt hierbij mee uit beeld, terwijl deze nu juist inzicht aan de gebruiker geeft waar hij zich binnen de site bevindt.
Hoofdnavigatie
De categorieën van de hoofdnavigatie vallen niet op en zijn niet snel te scannen omdat de tekst over meerdere regels verdeeld is. Daarnaast is het moeilijk een logische volgorde te ontdekken in de categorieën:
Mogelijke oplossing
De webshop zou op een aantal punten verbetering kunnen gebruiken:
- Communiceer duidelijker dat Albert maar in een deel van Nederland bezorgt, om teleurstelling in een laat stadium te voorkomen;
- Maak de klikvlakken van ‘artikel toevoegen’ en ‘aantal verhogen’ groter;
- Pas de scrollbar toe over de gehele pagina in plaats van alleen het middenkader (en zorg dat de breadcrumbtrail niet meescrollt);
- Geef de hoofdcategorieën van de navigatie meer nadruk en pas de presentatie aan, bijvoorbeeld door tekst en iconen te combineren of meer ruimte te reserveren;
- Breng visueel rust in de opzet van de middenpagina aan;
- Toon de pop-up met waarschuwing dat Albert maar in een deel van Nederland bezorgt na het toevoegen van drie artikelen (en schrap in de tekst en maak de call-to-action naar postcodecheck duidelijker).
Afrekenen
Call-to-action
Als ik wil afrekenen staat er een banner tussen mijn winkelwagentje en de button ‘Naar de kassa’. Dit is één van de belangrijkste call-to-action momenten, waarbij de banner alleen maar afleidt:
Inloggen en registreren
Als je op de button ‘Naar de kassa’ klikt wordt een pop-up getoond dat je eerst moet inloggen voor je kunt bestellen:
Ik moet nu eerst de melding sluiten en zelf op zoek waar ik in kan loggen. Waarom wordt die extra handeling van mij gevraagd? Stuur me dan gelijk door naar een pagina waar ik in kan loggen… Overigens valt op dat de linktekst ook hier weinig zegt: ‘Nieuwe klant? U kunt zich dan hier inschrijven’. Beter zou zijn: ‘Bent u nieuw op onze site? Schrijf u in als nieuwe klant!’. De call-to-action hoef je dan niet af te leiden van omringende tekst.
Om de bestelling te kunnen plaatsen moet je je registreren, waarbij je wachtwoord minimaal zes karakters lang moet zijn. Helaas kom je daar als gebruiker pas achter bij de foutmelding als je een wachtwoord kiest met minder karakters…
Bevestigingspagina
Nadat ik mij aangemeld heb wordt een melding getoond dat mijn account gevalideerd moet worden, door de link te activeren in de mail die naar het opgegeven e-mailadres gestuurd wordt. Vanuit gebruikersoogpunt is het prettig dat vantevoren gemeld wordt dat je een valide e-mailadres op moet geven. In mijn geval is de mail nu naar een niet bestaand adres gegaan. Voor mij niet zo erg, maar er zijn mensen die uit privacy- of spamoverwegingen niet hun echte e-mail adres opgeven: dan is het wel handig als je dit ter plekke meldt. Anders moet je je opnieuw registreren – wat een groot afhaakmoment kan zijn.
Overigens valt ook op dat ik op de bevestigingspagina nergens op kan klikken: ik kan niet terug naar de homepage zonder zelf actief de URL opnieuw in te geven. Ook het logo linksboven (niet zichtbaar op het screenshot) is niet klikbaar, wat wel een conventie op internet is.
Minimum orderbedrag
Na de registratie afgerond te hebben kan ik het bestelproces hervatten, maar een volgende pop-up gooit roet in het eten: ik moet minimaal voor € 60 euro bestellen. Exclusief statiegeld en bezorgkosten…
Ook dit weet je als gebruiker liever vooraf, en niet pas na registratie (!!)… Stel dat ik slechts een paar boodschappen wil laten bezorgen en net het hele bestelproces doorlopen heb; grote kans dat ik alsnog afhaak (waarbij de user experience van deze ervaring af kan stralen op de fysieke winkel).
Mogelijke oplossing
- Plaats de ‘Naar de kassa’ button fysiek dichter bij de winkelwagen om ruis te elimineren;
- Stuur de gebruiker direct door naar een registratie/inlogpagina, in plaats van dit alleen in een pop-up te melden en de gebruiker zelf te laten zoeken waar hij dan moet registreren/inloggen;
- Meld vooraf bij registratie dat de gebruiker een valide e-mailadres moet opgeven om het account te kunnen activeren, en geef instructies bij specifieke velden (zoals het aantal karakters voor het wachtwoord);
- Neem een doorklikmogelijkheid op de registratiepagina op, bijvoorbeeld naar de homepage;
- Communiceer vóór het registratieproces het minimum bestelbedrag om verrassingen te voorkomen.
Conclusie
Albert.nl en de bijbehorende webshops werken functioneel best goed, maar kunnen op bepaalde punten absoluut beter. Een paar van de besproken punten lijken misschien ‘maar’ kleine punten te zijn, maar veel kleine punten bij elkaar verminderen al de user experience waardoor de gebruiker af kan haken. Nog los van enkele grovere usabilityfouten die gemaakt worden… Ik ben nieuwsgierig of er lezers zijn die ervaring met Albert.nl hebben?
Links
Albert.nl werkt efficiënter dankzij vraagsturing – http://www.twinkelmagazine.nl/nieuws.aspx?id=22054
Over de auteur
Ivo Bosma
Ivo werkt als interactie ontwerper en usability expert bij Concept7.
| Website | http://www.ivobosma.nl |
| http://nl.linkedin.com/in/ivobosma | |
| @IvoBosma |
(2 stemmen, gemiddeld: 3.00 uit 5)
Loading ...
Geplaatst op 
Tags: 
