Wat is de eerste optimalisatie die je uitvoert op je website? Het is zonder twijfel om ervoor te zorgen dat je actieknoppen (call-to-action) gemakkelijk kunnen worden geïdentificeerd. Het klinkt misschien stevig, maar het is te vaak zo dat je vindt dat deze knoppen verbetering kunnen gebruiken.

De meeste voorkomende fouten zijn:

  • Een stijl die de klikbaarheid van de knop niet voldoende benadrukt;
  • Een contrast dat te laag is om het van andere pagina-elementen te onderscheiden;
  • Een ongepaste locatie (bijvoorbeeld onder de scroll lijn).

Een ander veel voorkomend probleem is op pagina’s waar je moet scrollen. Bijvoorbeeld, een productsheet kan meerdere schermen bevatten, omdat het raadzaam is om de rijkdom aan informatie te omvatten met: visuals, beschrijving, technische specificaties, klantenbeoordelingen, gerelateerde en/of aanbevolen producten om te cross/up-selling te bevorderen, etc. Op dergelijke pagina’s is het dit vaak het geval: hoewel de toevoegen-tot-winkelmand knop boven de scroll lijn zit, zit de meest relevante informatie eronder. Wanneer een gebruiker scrollt om die informatie te zien, verdwijnt die knop van het scherm.

Om dit probleem op te lossen, kun je onze Stick on Scroll plug-in gebruiken, die ervoor zorgt dat je call-to-actions altijd op het scherm zichtbaar zijn, ongeacht de scroll activiteit. Het principe van deze plug-in is eenvoudig: het maakt een van je pagina-elementen vast, waardoor de indruk wordt gecreëerd dat het meebeweegt als de gebruiker op de pagina scrollt.

De implementatie van deze modificatie is heel eenvoudig en vereist slechts een paar klikken. Selecteer vanuit de editor je call-to-action en kies “Plug-Ins”. Je wordt dan doorgestuurd naar de library, waar je per plug-in categorie kan filteren. Hier is de Stick on Scroll plug-in in de categorie “Content”. Activeer de plug-in door op de knop “Add to test” te klikken, rechtsboven op de pagina die de plug-in beschrijft. Je wordt automatisch doorgestuurd naar de editor, waar je een configuratiescherm krijgt voor het opgeven van de instellingen voor deze plug-in. Er zijn verschillende mogelijkheden om het gedrag van deze knop aan te passen, zodra het is opgelost.

stickonscroll-configuration-panel
Instellen van de opties voor de Stick on Scroll plug-in

Je kunt bijvoorbeeld:

  • Een achtergrondkleur opleggen op het blok dat de knop bevat;
  • De display naar de voorgrond pushen (nuttig als andere elementen op de pagina hogere z-index waarden hebben en de scrollknop verbergen); en
  • Een ruimte plaatsen tussen de bovenkant van de pagina en de knop zodat het kan “ademen”, etc.

Je kunt dan de blik en het gevoel van de knop aanpassen met de verschillende opties die beschikbaar zijn in de visuele editor. Pas dan je wijzigingen alleen toe op de productpagina’s en voer een A/B test uit om de impact van de wijzigingen te meten of om het direct aan alle gebruikers toe te passen.