{"id":7194,"date":"2013-08-13T21:06:32","date_gmt":"2013-08-13T15:36:32","guid":{"rendered":"https:\/\/vwo.com\/blog\/?p=7194"},"modified":"2025-12-12T15:05:32","modified_gmt":"2025-12-12T09:35:32","slug":"image-slider-alternatives","status":"publish","type":"post","link":"https:\/\/vwo.com\/blog\/image-slider-alternatives\/","title":{"rendered":"How To Use Image Carousels the Right Way"},"content":{"rendered":"\n

Oh, the annoying merry-go-rounds!<\/p>\n\n\n\n

I\u2019ve lost track of the number of times I\u2019ve tried to get hold of those running slides on a website. It\u2019s just so irritating to try and hastily read what has been written before another slide takes over. Now, I don\u2019t even bother to scan any further than the first slide of image carousels.<\/p>\n\n\n\n

I thought I\u2019m the only one who couldn\u2019t stand these automatic sliders. But thank god, there are others like me as well! <\/p>\n\n\n\n

Download Free: A\/B Testing Guide<\/span><\/a><\/em><\/h2>\n\n\n\n

These rotating slides either get ignored by the user or further confuse them, thereby\u00a0impacting the overall user experience<\/a>\u00a0and conversions on the website.<\/p>\n\n\n\n

\"Blog<\/a><\/figure>\n\n\n\n

A usability study<\/a> by Nielsen Norman group confirmed that auto-forwarding carousels annoy users and reduce visibility.<\/p>\n\n\n\n

The study highlights a couple of reasons why these believed-to-be \u201ccool\u201d design element are actually not good for your site\u2019s usability or conversions:<\/p>\n\n\n\n

    \n
  1. Automatic rotation makes the user lose control of their interaction with the site. This is especially annoying for users with motor skill disorder or dyspraxia.<\/li>\n\n\n\n
  2. They create banner blindness and are often easily ignored by users. The eye tracking<\/a> example below from another source also validates this. You can see how the image slider (the black area in the picture) hardly gets any attention by site visitors.<\/li>\n<\/ol>\n\n\n
    \n
    \"Eyetracking
    Image source: Instapage<\/a>
    <\/figcaption><\/figure>\n<\/div>\n\n\n

    3. Low-literacy users and international users (whose native language differs from the language on your website) often read slowly. A user clearly expresses his frustration in the study when he says, \u201cI didn\u2019t have time to read it. It keeps flashing too quickly.<\/em>“<\/p>\n\n\n\n

    Besides, sliders don\u2019t work well on mobile devices. I wonder if these sliders are so confusing and annoying for so many other users, why is it that they are almost everywhere? As it turns out, image carousels or rotating banners are often thought of as an easy solution to provide better navigation to all the important content\/offers on the site. The data suggests otherwise though.<\/p>\n\n\n\n

    Notre Dame University tested their carousel. The chart below shows the results they found. Only 1% of total visitors clicked through from the carousel, and the majority of these visitors (84%) interacted with only the first slide of the carousel.<\/p>\n\n\n

    \n
    \"Traffic
    Image source: University of Notre Dame<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

    Okay, I get it! Every department wants to have their special offer on the homepage.<\/p>\n\n\n\n

    But frankly, 1% clickthrough rate from an element which occupies major homepage real estate is a clear wasted effort. Do you still think image sliders are a good idea?<\/p>\n\n\n\n

    Apart from posing a usability challenge, carousels stuff multiple offers in one place, which is a big conversion killer<\/a>. Like the proven conversion wisdom suggests, you should ideally have only one offer or call-to-action per page<\/a>. And carousels definitely are the offenders here.<\/p>\n\n\n\n

    Too many offers together just say, \u201cWe don\u2019t know what should be our top priority, so we dump them all together here and see which one works the best.\u201d Take some responsibility, people! Decide the priority of your offers before you proceed any further.<\/strong><\/p>\n\n\n\n

    Done?<\/p>\n\n\n\n

    Okay, now if you are ready to get past this \u201cstandard practice,\u201d here are a few image carousel alternatives you can try:<\/strong><\/p>\n\n\n\n

    Too many offers together just say, \u201cWe don\u2019t know what should be our top priority, so we dump them all together here and see which one works the best.\u201d Man up and take some responsibility, people! Decide the priority of your offers before you proceed any further.<\/b><\/p>\n\n\n

    1. Focus your homepage on your primary offer<\/h2>\n\n\n

    Put your best foot forward. Let your most relevant offer catch the attention of your visitors<\/a>. And add on a few offers that consistently perform well for you throughout the year. You can see how Ben Sherman implements this on their homepage:<\/p>\n\n\n

    \n
    \"Ben
    Image source: Ben Sherman<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

    In the above image, only the blazer offer is what the visitors can see above the fold.<\/p>\n\n\n\n

    Don\u2019t make your website look like a promotion hoarding. You need not hold onto every offer that you have promoted earlier. <\/p>\n\n\n

    2. Convert each image slide into a targeted homepage for specific visitor segments<\/h2>\n\n\n

    Let\u2019s say, you have a global clothing store online. Now, countries often have different clothing trends. So, you can segment your visitors on the basis of their geographical location with the help of your A\/B testing software<\/a>.<\/p>\n\n\n\n

    Show them the homepage that promotes an offer about the most popular clothing trend in their country. This is a great replacement for a \u201cone-size-fits-all\u201d image slider solution that shows 4 slides, out of which 3 are more suitable for trends in the US (because 80% of your traffic comes from the US), and 1 slide is for the UK.<\/p>\n\n\n\n

    But guess what? Probably you are passing out on the preferences of visitors from other countries. So, even if you have made efforts to ship everything to those countries, your conversions for them will still be poor.<\/p>\n\n\n\n

    Instead of showing your visitors an ever-rotating image slider that lists maybe even one offer per slide for the 5 major countries from where you get the majority of your traffic, why not just do away with the slider and replace it with a location-specific offer? You can easily use pre-set segments in VWO to set this up in just a few clicks.<\/p>\n\n\n\n

    As Depesh Mandalia, the eCommerce & Digital Expert, has been rightly quoted in this eConsultancy article:<\/p>\n\n\n\n

    \n

    One focused banner message will drive higher CTRs<\/a> than a few unfocused banners. Serving 100% of your visitors is near-on impossible without knowing something about them yet there seems a self-persuasion with content managers that more choice is good = more clicks = more sales. It doesn’t work that way.<\/p>\n<\/blockquote>\n\n\n\n

    Download Free: A\/B Testing Guide<\/span><\/a><\/em><\/h2>\n\n\n

    3. Use manual sliders over auto-rotating<\/h2>\n\n\n

    See the image below from Sephora\u2019s homepage:<\/p>\n\n\n

    \n
    \"Awesome
    Image source: Sephora<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

    Now this is hands down, one of the best executions of image sliders I\u2019ve seen on the Internet. Some of the reason why it is so great:<\/p>\n\n\n\n