Aug
24
2015

Homepage carousels – it’s enough to make your head spin

We’ve had a few enquiries about the homepage carousel feature in EdWeb which we’ve strongly advised website managers not to use at present. In this post I want to explain the current situation, what our plans are, and why you’re probably better off without a carousel feature anyway.

What’s a carousel?

First off, what are we talking about here? A carousel feature is a panel – usually presenting a succession of ‘rotating’ images – that automatically changes regardless of whether the website visitor interacts with it. They’re common on many sites (or at least have been common, arguably their presence is on the decline) and you can see them on many University unit homepages.

Screengrabs of carousels from other websites

Carousels take many forms. These examples are from Amazon, Yahoo and Siemens websites.

 

The Polopoly-driven website homepage carousel

Polopoly CMS users will know about the feature which is available on one particular homepage template.

It was added to the system because:

  • Back in 2011 every site had them, the University homepage had just introduced one and there was a growing demand across the University
  • The homepage template was a fixed size, so having a space that could contain extra content in a high profile position made it easier for site managers to balance demands on home page ‘real estate’
  • We came up with an interface that represented best practice in usability and accessibility, and performed well in tests with users
Screengrab of carousel on a Polopoly driven website.

The carousel features on the School of Economics website today. This website is published using the Polopoly CMS.

So they’re reasonably popular with somewhere over a third of sites using them. As these sites move into EdWeb, we’vehad a few enquiries as to why carousels haven’t been set up on the new homepages as the functionality appears to be there…

The current EdWeb CMS situation

Although there is a carousel feature on the EdWeb homepage options, it’s likely that using it may break your page, so our guidance is not to use the feature. If it does go wrong, our advice would be just to remove the feature. Come along to a support clinic if you want to discuss alternative options.

This feature was initially implemented (as ‘out of the box’ functionality) as a means for the team to investigate as the graphic design was in development, and unfortunately didn’t get backed out of the live system before the end of the current round of development. We took the decision to prioritise introducing and enhancing other features, rather than spend developer time on fixing or removing this element. Instead we’re dealing with this in the interim as a user support matter.

So why do we advocate not using the carousel feature in EdWeb?

Basically, it needs work in a number of areas to make it fit for purpose:

  • Acessibility: It doesn’t meet basic requirements in that it can’t be navigated fully by keyboard only
  • Usability: The controls are very subtle and contain no indicator to the user of what they will get by interacting with it. Compare the dots used to progress through the carousel items to the fully labelled tabs in the Polopoly version.
  • Design presentation: Regardless of the size it’s presented at in the homepage, the images always distort. The call to action (i.e. the link you want the visitor to click) is also very weakly presented.
  • CMS bug: While the CMS user can choose any piece of content anywhere in the University website to include, the output will only permit the feature of pages that exist within that particular sub-site.
Screengrab of a homepage carousel from a webpage published using EdWeb

The EdWeb homepage carousel requires additional work to address accessibility, usability and design issues.

So what are we doing about it?

We’re just beginning the process of reviewing and reprioritising EdWeb development for the coming academic year. We will be working initially with our developers to identify just how much work will be involved in addressing the issues we have. From there, we’ll need to make a call on whether we put this work ahead of other areas of development, or we just remove the feature from the system for the time being.

We’ll be involving all business units using or thinking about using EdWeb in this prioritisation process. More news on this in the next month or so.

So what can you do about it?

(You being an EdWeb CMS user, of course)

The simple answer is to make full use of the space and flexibility on offer with the EdWeb homepage template.

  • Two and three panel columns, plus a one-third/two-third split
  • Great flexibility within the content of each panel
  • With or without images to increase emphasis
  • Multiple panels in each space to further vary presentation

Check EdWeb homepage guidance to learn more

EdWeb demo site – about homepages

And remember that the absence of a carousel really isn’t a big deal. Why?

  • The new EdWeb homepage layout is super flexible. In the old days of the fixed Polopoly CMS homepage layouts, the carousel provided valuable extra space when website managers were trying to squeeze a lot of content in, and keep all stakeholders happy. EdWeb’s homepage layout has more than enough space and a range of options to accommodate pretty much anything you need. (If you find yourself running out of space with the EdWeb homepage, you’ve got some serious IA and content strategy problems you need to sort out first. Get in touch and let us help.)
  • Carousels look rubbish on small screen devices, and can be incredibly difficult to use at this scale. Remember mobile use is growing year on year. It still has a way to go to overtake desktop for our website, but on average the balance of power has already shifted.
  • Very few people interact with the content in carousels anyway. We know this first hand from click analysis studies on the old University homepage (the carousel was ditched in favour of a tiling pattern of features in 2013). Our studies showed that on the University homepage – even when the carousel contained big news features like new arrival information – less than 10% of visitors interacted with the carousel. And based on the time to click, the vast majority of visitors had left the homepage before it had the chance to progress to the second or third features automatically. Practically no one was seeing the fourth.
Screengrab of a click heatmap of the University homepage

Click analysis research on the University homepage in 2010 showed the carousel was not attracting a lot of attention from visitors.

Expert views on carousels

You may be thinking that I’m just poo-pooing carousels because we haven’t got them working properly. Not so!

Here’s a selection of further reading on the topic:

Auto-Forwarding Carousels and Accordions Annoy Users and Reduce Visibility – Usability expert Jakob Nielsen’s findings (January 2013)

Erik Runyon’s click analysis of visitor interaction with carousels on American university Notre Dame’s website (January 2013) revealed behaviour similar to what we observed on the University of Edinburgh homepage.

Brad Frost’s guide to making carousels less awful, if you really must use them (January 2013)

Carousel Usage Exploration On Mobile E-Commerce Websites – Kyle Peatt counters Erik Runyon’s data and provides some very positive usage data, but concludes that homepages aren’t the place for them and the use case in commerce is pretty different to that of higher education (February 2015)

Add comment: