Popular Website Feature can be a Usability and SEO Nightmare

Paul Bullock

Published Tue 26 Aug by Paul Bullock in Perfecting Your Website's Design

Carousels, or 'rotating offers' - popular on many websites - can damage both usability and search engine optimisation if not implemented correctly

One website feature that is still popular among website owners is the carousel, or slider. Carousels showcase new offers and promotions and are designed to draw the users' attention above anything else. 

What are Carousels?

Carousels are auto-rotating panels (or sliders) that appear on a website's home page to showcase / draw browsers' attention to particular products or offers (see the example on the White Stuff website below)

  • Carousels usually hold a prime position on a company's home page (typically above the fold where users will see it as soon as they arrive)
  • They typically contain multiple images and a small amount of text on each slide
  • Only one slide is visible at any one time
  • Carousels are programmed to scroll through each slide one at a time but not to stay on one image for very long

/usercontent/redactor/images/White Stuff slider.PNG

Recently there have been many studies conducted by usability experts such as Jakob Nielsen, highlighting the shortcomings of carousels and sliders on your home page. 

Why Are Sliders and Carousels so Bad for Your Website's Users and SEO?

Numerous studies by leading usability web experts show that not only are carousels and sliders bad for user experience, they can also damage a website's page ranking in leading search engines. 

  • Only a small minority of web users tested actually clicked on sliders: a miniscule 1% (and even then they only clicked on the first slide, ignoring all of the others in the carousel)
  • Few web users interact with carousels because they think they are adverts: which is a definite turn-off for most people when browsing web pages
  • Sliders / carousels relegate important content to the dark depths of 'below the fold': making users scroll down to get to the content they really want, ie. product or service information that is more likely to get them to engage and make a purchase / submit an enquiry
  • The probability of the information users want and need being displayed on the slider at the exact optimum moment is minimal
  • Harrison Jones of Search Engine Land points out that many sliders / carousels offer 'confusing objectives' to users: most users are primed to look to the h1 heading when they land on a web page to tell them what the page is about and whether it meets their objectives / fulfills their needs. With a carousel / slider, there are numerous h1 headings all vying for attention and changing from moment to moment. Jones declares that for most users, this is 'confusing and irritating'
  • It is often difficult for users to see how much content is available on a carousel and where it ends. The user does not get a feeling that they are in control, and they are less likely to interact with and stay on a web page which makes them feel this way
  • The speed at which a carousel scrolls through slides is often fast (an average of only 5 seconds according to Jakob Nielsen). Nielsen deems this automated scroll time 'Deadly', especially in terms of accessibility: readers with low literacy levels, difficulty with motor skills that makes it difficult for them to click in a timely manner to pause a slide, or users who are international, could find this feature frustrating and excluding. If there is not enough time to read the information offered on a slide before it is gone again, user experience is going to be negative
  • Because carousels / sliders are often built in Flash and use mainly images, they may slow down page loading time considerably. According to Harrison Jones, anything beyond 2 seconds can damage user experience
  • Some of the principles of basic SEO (Search Engine Optimisation) are violated by carousel features: multiple h1 headings (Google recommends one only per web page), Flash that cannot be crawled / indexed by search engines and slow loading speed
  • 'Banner Blindness' comes into play when carousels are used on a website: In Jakob Nielsen's study, users were asked 'Does Siemens have any special deals on washing machines?'  Even though the offer seen on the screenshot below was prominent on the slider, users repeatedly did not see it. If users do not immediately see what they are looking for, they are likely to go elsewhere. As Lee Duddell says: 'Use (carousels) to put content that users will ignore on your Home Page. Or, if you prefer, don't use them. Ever.'

/usercontent/redactor/images/siemens-appliances-overlooked-promotion_.png

Are there any Plus Points for Carousels?

With so many usability studies decrying the use of carousels, why do so many websites still use them? 

  • They are an ideal space-saving solution on home pages: numerous promotions can be scrolled through in the same place on the web page so they don't take up extra premium space. Many companies see this as a great way of getting more for less
  • Carousels undoubtedly increase the amount of copy on the home page
  • Carousels look good and attract the eye: this 'eye candy' is reputed by some to draw users in: even if the actual carousel itself is not effective at making conversions, the inclusion of a carousel on a home page can imply that the website is up to date and worth spending time on 

Practical Guidance for Including a Carousel on Your Home Page

If you are going to employ a carousel on your home page, follow our practical guidance to minimise the pitfalls we have highlighted in this article and make your users' experience the best it can be. 

  1. Let Your Users Take Control: Having a clearly posted option next to the carousel allowing the user to de-activate any auto-sliders if they wish, can make them feel as though they are in control of their experience. This can result in happier users who stay on your page for longer and explore further. And happy users often equal higher conversions         
  2. Auto-slider de-activators are generally considered to be better when they take effect immediately: if users de-activate the auto-slider but the slides carry on scrolling through, they may get frustrated with it 
  3. Many users report that they like to be made aware of when the carousel has reached the end of the sequence: this prevents them unknowingly going through the same slides again and again. This is easily done by disabling the arrow on the right-hand side of the slider when the carousel reaches the last item
  4. Another potential point of frustration for users (especially those with accessibility issues) is arrows to the left and right of the slides being too small. Not only are larger arrows easier to see, they are also easier to click onto if the user wishes to go backwards or forwards: arrows that are at least a fraction larger than a typical mouse cursor are optimal
  5. Because the eye is naturally drawn to moving images, it can be distracting to users if a carousel moves through the slides in a jerky or sudden fashion. Soft transitions are generally preferred to avoid users' attention being drawn away too much, to the detriment of the other content on the home page that is potentially more informative and important to them

So, we have looked at carousels and how they can potentially damage a website's usability and SEO. We have also looked at why they are still so popular, and how to limit the potential negative effects of using a carousel on your website. 

If you have any comments to make, please use the comments section below. Got any further questions about the use of carousels / sliders on your website? Get in touch with the team by visiting our ask an expert page!

Be The First to Comment on This Item

  • No comments for this item yet

    Why not be the first?

Comments Closed

Comments for Popular Website Feature can be a Usability and SEO Nightmare are now closed


What's New With The Team?

More Recent Updates

UK: 0115 8088303

INT: +44 (0)115 8088303

29 Royal Standard House
Standard Hill
Nottingham
NG1 6FX




Nottingham Web Development