Iedereen kent het, klanten adoreren het en wij benaderen het met de nodige voorzichtigheid: de (homepage) carrousel. Maar vanwaar onze bedachtzaamheid?
De homepage slider, ook carrousel genoemd, is een zone, bovenaan een webpagina en boven de paginavouw waar verschillende delen inhoud gegroepeerd worden in één enkele toegewijde ruimte. Deze zone kan per type inhoud ook call-to-actions bevatten; dit is meteen de grote troef: veel inhoud weergeven in een beperkte ruimte. Een ruimte die bovendien bovenaan de pagina te vinden is, een plaats waar iedere gebruiker moet passeren. Maar, een troef mag je niet meteen uitspelen, ook hier niet. Zeker hier niet!
Animatie
Ons brein reageert op beweging en het zit in onze genen om rap afgeleid te zijn. Heel concreet wil dit zeggen dat 'fancy' animaties -hoe mooi en toepasselijk ook- de aandacht wegnemen van alle andere zaken, en dat kan niet de bedoeling zijn. Dus, omdat we reageren op beweging missen we de belangrijke zaken zoals de inhoud, producten en, heel belangrijk, de 'value proposition' van een website; deze bepaalt of een gebruiker op de pagina (lees: site) blijft of niet.
Overdaad schaadt
Een bezoeker die op de homepage terecht komt ziet al rap het bos door de bomen niet meer door de overvloed aan informatie. Carrousels hebben doorgaans een slechte UX, animeren te snel, hebben veelal geen animatie indicators en veranderen doorgaans automatisch. Deze zijn dus niet aangepast aan de leessnelheid van de bezoeker.
De gebruiker heeft sporadisch het heft in eigen handen en laat dat nu net een key feature van gebruiksvriendelijkheid zijn. De focus raakt zoek door het aanhoudend wisselen van beelden, tekst en call-to-actions waarbij -in veel gevallen- de gebruiker de pagina zal verlaten, de conversie zal verlagen en bounce-rate verhogen.
Performantie
Carrousels gebruiken naast beelden ook JavaScript/jQuery, 'services' die op hun beurt een zekere laadtijd met zich meebrengen. Los daarvan bevatten deze sliders meestal uitnodigende beelden die, wanneer ze niet geoptimaliseerd zijn, ook voor overtollige laadtijd zorgen.
Deze zaken kan men omzeilen door de beelden te optimaliseren, afbeeldingen in te laden voor de gewenste drager (smartphone/tablet/desktop), zorgen voor consistent gedrag doorheen alle platformen, enzovoort. Meer over de praktische kant van front-end optimalisatie kan U lezen in "Het Probleem met afbeeldingen op het web en hoe deze op te lossen" en in "Burn some fat of the web".
SEO
Carrousels kunnen een invloed hebben op het Search Engine Optimalization proces en (de gewenste) conversie. Een reeds aangehaalde reden is een (te) lange laadtijd, en sinds enige tijd bepaald diezelfde laadtijd op mobiele apparaten ook de ranking in zoeklijsten. Verder willen mobiele gebruikers hun bandbreedte niet opofferen aan overtollige bestandsgroottes. De ophoping van h1-tags en afbeeldingen met voorgerenderde tekst nemen zoekrobots ook niet in dank af.
Onder de pagefold
Anno 2016 weten we naderhand al hoe we moeten scrollen, niettegenstaande de agressieve manier waarop een carrousel zichzelf op de eerste plaats zet en de content onder de 'pagefold' laat verdwijnen. En, in een content-first maatschappij waar UX en responsive design dure buzzwords geworden zijn, is dit een niet onbelangrijk argument.
Banner Blindness
Bijna 20 jaar na de introductie tot de term 'banner blindness' (Jan Panero Benway & David M. Lane, Rice University Houston, Texas. "Banner Blindness: 'Web Searchers Often Miss "Obvious" Links') en de bijhorende studie die erop wees dat klanten/bezoekers gewoon geraakt zijn aan een overdosis banners dat men deze gevoelsmatig zal overslaan of zelf negeren. 86% van webgebruikers heeft banner blindness en meer dan 50% van de banner clicks op mobile zijn per abuis, de zogenaamde 'fat-finger clicks'. Meer statistieken kan u hier raadplegen.
Meten is weten
Smiley Cat (Christian Watson's webstek) voerde recent onderzoek uit en kwam tot de conclusie dat het leeuwendeel van de kliks naar de eerste banner in de carousel gaat, goed voor zo'n slordige 66%. Daarna dalen de kliks zienderogen van 14% naar 11% om uiteindelijk te eindigen met een triestige 9% voor de rode lantaarn in de lijst.
Soortgelijke cijfers duiken op in het onderzoek naar carrousel-items door Erik Runyon op de Notre Dame website. Daar zien we dat het gemiddelde op het eerste beeld rond 60% ligt en erna rap zakt naar (on)gekende dieptes.
We hebben hier de proef op de som gedaan met onze Winsol website. We zien dat 59,45% van de clicks naar het eerste beeld in de rij gaan, 40,55% werd verspreid onder de daarop volgende slides. Heel vergelijkbare cijfers die concluderen dat de click-through data van een carrousel heel rap daalt na het eerste beeld in de rij.
Dit is geen pleidooi tegen carrousels, integendeel. Wij willen enkel onderstrepen dat carrousels een zorgvuldig overwogen optie moeten zijn; geoptimaliseerd en toegankelijk, waarbij deze de performantie van een site niet compromitteren. Zelfs dan bestaat de kans dat de homepage slider niet werkt.
Wil je met 100% zekerheid weten of die slider op je homepage werkt? Dan kan je dit enkel en alleen te weten komen door de resultaten te meten en op te volgen. Gebruik maken van tools die heatmaps van het klik- en bewegingsgedrag genereren vormen hier zeker en vast een belangrijke bron van informatie. Ook A-B testing zorgt hier voor een inzicht, want meten is immers weten.
Onze overweging wordt steeds gestaafd door een diepgaande analyse door onze marketing-afdeling en afgewerkt met de UX-expertise van het designteam.
Should I use a carousel schetst op een beknopte en verstaanbare manier de hele problematiek en vormt bij deze de ideale aflsuiter van dit artikel.