9rules - The best content from the independent web.

Back To Blog

Subscribe To RSS Feed

Recent Blog Entries WHOOP

Why Using Large Headers Decreases Website Usability

Written by Teresa Te on March 3, 2018

The number one rule in website development is usability. No matter how wonderful your site looks, and no matter how much you paid top copywriters to crank out your sales copy, usability is king.

When you think of usability, you probably picture a solid horizontal menu with clear labels that take the user directly to the appropriate content. Usability in this simplified context is an intentionally constructed system for the user to engage.

There’s another side to usability, and it involves the process of elimination when you first start building your site from any template.

Compared to the 1990’s, templates have lost their flair. When you use a template, you’re starting with a design that looks just like every other website on the internet, and it will come complete with integrated elements of distraction.

Usability requires eliminating shiny things, aka distractions

It’s well known that crows are attracted to shiny things, as you can see in this video. The crow in the video was probably looking for food when it happened to see a big, shiny box. It’s not going to return to thinking about food until it’s done being enamored with the shiny surface…unless it comes across more shiny things.

Humans act the same way when they surf the internet. Shiny things capture their attention at rapid intervals, taking them on a prolonged journey with tons of unexpected stops along the way.

Having social media notifications dinging and ringing in someone’s pocket is enough of a distraction when they’re trying to perform other tasks. Being actively engaged in navigating your website while those notifications are going off can take a person seriously off their path.

After being distracted by Facebook posts and YouTube videos for an hour, people can’t even remember what they were originally looking for on your website. Sometimes they can’t even remember how to get back to your website.

You can’t control the amount of distractions a person receives from the apps they’ve got running, but you can control the distractibility of your content.

Eliminating the shiny things, or distractions, is the best way to maintain visitor attention. One of the biggest shiny distractions in today’s world of templates is the use of giant images.

Gigantic headers, often referred to as “hero images,” are loved by website owners but not by visitors who must scroll just to get to the content.

The real reason most people are using giant headers

People use gigantic images for headers because their templates come with the space for them. It’s really that simple. Somewhere over the years, designs with huge headers started to sell really well, so that’s the style designers started cranking out. In fact, these headers have now gone full screen.

Although, sometimes these large headers seem effective when a website generates plenty of sales, a redesign focused on making content immediately available could increase those sales even more. In other words, just because a website is seemingly successful with a large header doesn’t mean the header is a contributing factor.

Giant images need to serve a purpose to be effective

The best way to make use of giant images is to help people navigate your website content. For instance, lawyers often use large images as a preview for the types of cases they take. Someone looking for a lawyer is likely to be a little frazzled, and large images work wonders to tell the visitor they’re in the right spot.

Large, yet simple images depicting areas of practice can help potential clients to quickly identify whether or not that particular lawyer is a match for them.

Don’t be afraid to trim the fat

Designers fill their template demos with beautiful stock images that make the design look stunning. This is done to show you the potential of the template, and it’s actually a marketing technique that helps the template designer sell more templates.

In order to design a site with high usability, you need to know what elements of your template to eliminate. In fact, when using a template, you’ll need to eliminate more elements than you may want to.

The elements that drew you to a particular template might be the elements you need to eliminate to keep distraction to a minimum. Don’t be afraid to cut what isn’t necessary. A beautiful website that doesn’t convert will end up being just another shiny object on the web.