Sliders have been a super popular feature on website home pages since they started going mainstream on websites some 20 odd years ago. What’s changed?
They were different times, simpler times, better times… just kidding I’ll avoid the temptation of listing nostalgic pop-culture throwbacks from the early 2000s, it’ll just make me feel my age – so will stay on topic :).
Back then having something simply move on a website was a pretty fancy trick and it became really popular. Like many things that are on-trend, it becomes almost mandatory because everyone else is doing it. It seemed like it must be best practice. (Any fellow nerds remember sites built completely in adobe flash?)
Logically there is of course the attraction of using a slider to share hero real-estate by diplomatically promoting different business verticals “equally” or listing every promotion, special or other featured thing. This seems like a no-brainer at first glance, but as you’ll see below it doesn’t actually work out that way.
These days we’re firmly in the camp that believes that the heyday of homepage sliders are well and truly behind us, and here at icreate agency we actively recommend clients against using them.
Let’s start at the beginning. What is the objective of the hero in the first place?
The hero section is what we call the top ‘above the fold’ part of the page here at icreate.
The job of the hero is simply to get the prospective customer to read more of your website!
To achieve this, we need to choose headline messaging and imagery that passes the “scan test”.
By this we mean, can a visitor determine within a 2-second scan what you offer and how they get it? Are they at the right place or should they keep looking or should they shift their attention to the next tab in their browser?
Because of the scan test clarity nearly always trumps cleverness when it comes to headline copy. *This might be a topic for a future blog article.
With this objective in mind let’s revisit the belief that sliders are a good idea because you can get more messaging or promotions ‘above the fold’.
It turns out that the data from studies of user behaviour show sliders are counter-productive, achieving the exact opposite of our objective. We’ll delve into this in just a second, but to shortcut to the takeaway: at icreate, we always recommend going with the most important headline and hero image for your business and finding other more appropriate places to put the secondary slider content on the website instead.
1) Studies show people generally don’t look past the first slide anyway.
Heatmapping statistics show that most people move on, either scrolling down or clicking navigation before slides change. So the content on the secondary slides is rarely ever seen, and extremely rarely is it clicked on or interacted with. I’ll link to some articles with studies at the bottom of the article.
So if the content on secondary slides is actually important, then we believe it should be included within the regular flow of the webpage’s content, so it can be picked up in a vertical scan of the page. Where it appears specifically in the structure will vary from site to site.
*For instance with ‘specials or promotions,’ we would suggest creating a space below the hero that a promo banner can be inserted when it is running. In addition, we’d add the functionality so that the promo banner can feed into any applicable page on the site, not just on the home page. pages.
2) The performance (and SEO) issue
Slider images are generally large full-screen images and are normally the biggest files that contribute to the page’s overall size.
In addition to these images simply being big, because they appear at the top of the page you can’t sneakily load them after the top portion of the page has been presented to the user (a technique called lazy loading).
Adding additional slides have the definite negative effect of slowing down page load speeds. The faster your page loads the less drop off you have in the initial seconds, plus page performance is a factor that is becoming an increasingly important metric for how your site ranks against competitors.
For more info check this article: https://metrictheory.com/blog/how-website-carousels-are-hurting-your-mobile-site/ We’ve also seen performance testing sites advising against sliders because they can be detected as a ‘layout shift’: https://gtmetrix.com/avoid-large-layout-shifts.htmlare
3) Most importantly we just don’t think this is the best use of your website’s most premium section of real estate.
For both aesthetic design reasons and from a marketing/positioning perspective we highly recommend going with the very best headline and hero imagery for your business, and not hedging your bets with sliders in this space.
Want to see the stats and research?
If you want more information, here are a few links to articles where others have done more thorough studies about the topic of sliders: