Sliders versus Hero Area

No Comments
Slider Versus Hero Area

If you have your own website or are developing client sites, chances are that you’re using the popular slider. Let’s face it, it looks pretty cool and makes your site really pop. Not only that, WordPress provides slider plugins that millions are downloading while others are buying them by the tens of thousands.

While sliders, also known as carousels, may provide a way to add dynamics or a lively element, many detractors have attacked them for a wide number of reasons. In fact, data that shows that they have a negative impact on your conversion rates. Truth be told, they’re complete conversion killers.

What The Studies Say

A number of studies have been conducted that drives home the point that sliders are bad news. The usability expert Jakob Nielsen conducted an exercise where website users were presented with a task involving a slider. They were asked the following question: “Does Siemens have any special deals on washing machines?” The answer was featured on the most prominent slide—the first one. The users’ reactions were coined “banner blindness”. As a result, Nielsen concluded that sliders are ignored.

The University of Notre Dame ( also conducted a slider study on their website that ran from mid-October 2012 to January 22, 2013. It was learned that when offering five sliders, visitors clicked on the first one 84 percent of the time. The remaining four received around four percent of visitor attention each.

In a 2013 study performed by the United Kingdom University of York’s Paul Kelly, a series of eight sliders were used. Once again, the first slider in the rotation received the highest amount of clicks.

Yet another instance drove home the point that sliders are a bad option. A recent Chicago Conversion Conference had 25 percent of speakers discussing them. Of these, 100 percent stated that they’re simply bad news, especially for B2B websites.

This drives home the point that if you give your visitors a choice of calls to action that they’ll either simply click on the first image because they just see the first one or they won’t click on any images at all.

And there are still more issues

Of those websites using sliders, companies that used them did so for thought leadership, branding, or promoting services, webinars, or white papers.

Where’s The Fold?

If you’re using sliders, can your customers see your content or is it buried by the graphic? The proverbial “Content is King” IS true. Your site content sells—not your slider. If your visitors have to scroll, this is causing a major usability issue, especially when they have to scroll below the page’s fold to find the content.

And What About SEO?

Using a slider can also present problems for your SEO. This involves using Flash images, slow page loading speeds, poor content, and multiple h1 headings. If you’ve used AJAX, HTML5, or jQuery for their development, headings are wrapped in an h1 tag. If you’re aiming for proper SEO best practices, you should only have one h1 tag per page with it appearing before any other heading tags. The problem with the h1 or other heading tags means that every time your slider changes, the h1 tag also changes. And with having multiple h1 tags, your keyword relevance will be affected.

Flashing Along

Another amazing aspect of using sliders is that incorporating Flash is essentially archaic with some designers still choosing to use it. As you probably already know, any Flash content can’t be crawled by search engines.

Beware Of The Not-so-fast Slider

When developing today’s websites, it’s important to remember that the more you add various components, the slower your page will load. Put high resolution, full-width sliders into the equation, and your page loading becomes a visitor turn-off. The user experience becomes greatly impacted any time a page takes anything past two seconds.

Slow lead times also increase bounce rates. When these increase, Google will consider your site a poor fit for its organic search results. As a result, your site is downgraded in the rankings list.

If you keep the time delay between sliders too long, visitors won’t realize that other images exist. If they speed up, reading and comprehension are difficult as each slider speeds along.

How To Improve Your Website Experience

If you want to improve your users’ experiences on your site, there are several things you can do. These include:

  • Removing your sliders
  • Delivering personalized content
  • Using compelling images with high-quality content
  • Using feature areas to help your visitors navigate to where they want to go

A Hero to the Rescue

Slider Versus Hero AreaAfter you remove your sliders, go with a single hero area. The hero shot—located at the top of the page—provides your visitors with a clean, concise message with a simple call to action. Websites like Twitter admirably use the hero area. The key is to have a static design whose overall simplicity helps improve your site’s conversions. The hero also sits above the homepage fold, so your visitors will also be able to easily view your critical content. There are no distractions, so your visitors can easily interact with the brief content and any imagery that’s developed in the hero.

If your business introduces the hero area in place of the sliders, you can expect several advantages, including:

  • a shorter loading time
  • greater consistency across multiple browsers and devices
  • no h1 tag duplication which leads Google sees as keyword spanning
  • better conversions

How should you design your hero area? Go with these tips:

  • Make very large, super sans-serif bold titles
  • Include your business’ name/logo in the upper left corner or make the logo prominent with the title
  • Feature simple website navigation in the upper right corner
  • Make a very subtle and cursive font for your subtitles to contrast with your strong and powerful sans-serif title
  • Consider uppercase letters with unusual letter spacing
  • Use big and thin fonts
  • Add a dash of color to the words in the message title
  • Place any text in the hero so that it doesn’t impede the visual flow of the image
  • Don’t cover faces or important parts of the image

Have you removed your sliders? Get started now and let the hero area be your business’ new hero.


Chris is a father of 4 and works full time as a network engineer. He loves The Office, P & R, brewing (and drinking) beer, and of course Web Design and SEO.

About us and this blog

We are a digital marketing company with a focus on helping our customers achieve great results across several key areas.

Request a free quote

We offer professional SEO services that help websites increase their organic search score drastically in order to compete for the highest rankings even when it comes to highly competitive keywords.

Subscribe to our newsletter!

Hosting Offers

More from our blog

See all posts

Leave a Comment