7 design standaarden voor e-commerce websites – De online shopper verwacht van een webshop bepaalde standaarden als het gaat om design. Voor herkenbaarheid en om de bezoekers een vertrouwd gevoel te geven raden wij aan deze standaarden te volgen. Door dit te doen wordt aan de verwachtingen van je klant voldaan en zal de bezoeker hopelijk als klant je webshop verlaten.

Natuurlijk kun je creatief zijn wanneer je je webshop ontwerpt, maar houd zeker deze standaarden in je achterhoofd. Wees creatief, maar overdrijf niet in je creativiteit. Zorg zeker dat de herkenbaarheid ook een belangrijk deel van je design vormt.

Om mijn 7 design standaarden te controleren bekeek ik steeds 5 webshops, te weten Coolblue, Wehkamp, bol.com, Hema en Fonq. Bij elk punt heb ik dan ook vermeld hoe dit is opgelost in genoemde webshops.

Plek van het logo

Je logo kun je het beste links boven in je webshop plaatsen. Bovendien is het belangrijk dat je logo een link naar je homepage bevat zodat de bezoeker via een klik op het logo altijd terug kan keren naar de homepage. Steeds vaker zie je trouwens ook het logo bovenaan gecentreerd en dit is inmiddels ook wel geaccepteerd.

Bij de webshops die ik bekeek, o.a. Coolblue, Wehkamp, bol.com, Hema en Fonq stond het logo steeds links boven.

Productnavigatie

De productnavigatie of het menu met productcategorieën dient of links of bovenin de site geplaatst te worden. Hema, Wehkamp en Fonq hebben de productnavigatie bovenin en Coolblue en bol.com hebben hun productnavigatie links. Vaak zie je bij sites met een groot assortiment met veel categorieën dat de navigatie zich aan de linkerkant bevindt.

Zoeken in de header

De doorsnee bezoeker van je webshop heeft geen tijd om uitgebreid op zoek te gaan naar een artikel en de zoekfunctie is dan ook een veel gebruikte functie van je webshop. Door deze een prominente plek in de header van je site te geven zorg je dat deze opvalt en dat mensen de zoekfunctie eenvoudig kunnen gebruiken.

Alle bovengenoemde webshops beschikken over de zoekbalk in de header.

Link of icoontje naar winkelwagen

Meestal kom je de link naar de winkelwagen rechts boven in de webshop tegen en dit is dan ook de plek waar de bezoeker deze als eerste verwacht. De link naar de winkelwagen kan een tekstlink of een icoontje zijn, maar moet goed herkenbaar en bij voorkeur rechtsboven geplaatst worden.

Ook hier geldt dat alle bovengenoemde webshops deze link rechtsboven hebben staan.

Herkenbare symbolen en icoontjes

Je wilt niet dat je bezoeker de zoekfunctie niet vindt omdat hij het icoontje dat je daarvoor gebruikt niet herkent. Of dat iemand de link naar de winkelwagen niet terug kan vinden door een creatieve, maar onherkenbare weergave daarvan. Er bestaan icoontjes en symbolen die inmiddels algemeen geaccepteerd zijn en ook hier weer zorgen voor de herkenbaarheid. Natuurlijk heb je daarin ruimte voor eigen inbreng, maar wees niet té creatief.

In mijn voorbeelden is Wehkamp het meest creatief met een tasje met een W erin. Echter door de locatie van het icoon is dit wel herkenbaar als winkelwagen. De overige webshops gebruiken redelijk standaard icoontjes.

Lay-out productpagina’s

Ook voor de lay-out van je productpagina’s is een algemeen design ontstaan dat meestal wel in grote lijnen wordt aangehouden. In deze lay-out die je als uitgangspunt voor jouw productpagina’s goed kunt gebruiken, vind je de productafbeeldingen aan de linkerkant van je scherm. De titel, prijs, productopties en andere productinformatie wordt dan of rechts van de afbeelding of eronder geplaatst.

Ook op dit punt zien we een gelijk beeld bij de 5 bezochte webshops. Overal vind je de productafbeelding links en alle overige informatie daarnaast en eronder.

Mobiel hamburgermenu

Het hamburgermenu dat je op je mobiel vaak aantreft is ook geheel ingeburgerd bij de websitebezoeker. Het hamburgermenu bestaat uit 2 of 3 liggende streepjes en al je hierop klikt, opent het menu. Op 4 van de 5 webshops vond ik dit hamburgermenu dan ook terug, in 3 gevallen links op de mobiel en bij Hema stond het hamburgermenu rechts. Alleen Fonq opent de mobiele webshop met een overzicht van de categorieën en wijkt dus af van deze standaard.

Conclusie design standaarden voor webshops

Voor dit artikel bekeek ik 5 grote Nederlandse webshops, maar ook als je gaat kijken op webshops als Amazon.com kom je bovenstaande design standaarden tegen.

Kun jij wel wat hulp gebruiken bij het ontwerp van je WooCommerce webshop? Neem dan contact met ons op!

Ken jij of heb jij een webshop die volledig afwijkt van de genoemde design standaarden, maar toch heel succesvol is? Laat het mij dan graag weten via een reactie!

Geef een reactie