How to Use Hero Images to Drive Users into Your Site

The impression a user gets as soon as they land on your website will determine whether or not they bounce away or click further through your website to see more. This first impression is extremely important in communicating the nature of your website and baiting users to complete the website conversion, such as a newsletter sign up or PDF download. This means the image and copy on the landing page is very important. This blog looks at the best practices for using hero images to drive users further into your website.

What is a Hero Image?

Despite what this name implies (Superman image at the top of every page...), a hero image OR hero photo is the main photograph that shows at the top of a web page. The goal of these images is to draw visitors into your website and encourage them to click on further content deeper in your website. Hero images have become increasingly more popular over the course of the last few years due to their ability to keep visitors engaged. Hero images come in several dimensions from large headers to featured content and are being designed to adhere to website visual experiences.

Hero Image Best Practices

A hero image is the first impression to users visiting your website and should be compelling enough to encourage them to click beyond that first page. Here are some best practices for using hero images on your website:

High Quality

This may seem obvious but your hero image needs to be high quality. No low resolution images - as a rule of thumb, you can resize images smaller but not larger. Make sure to keep in mind pagespeed time when working with larger images and compress the image as much as possible without sacrificing quality. There are several online image compressors available such as Compressor and Optimizilla.

Be Relevant

Your hero image should well represent your brand and what it is you are trying to promote via the website. Make sure the image relates to what you are, a restaurant would show food and atmosphere whereas a clothing brand would showcase looks and style.Call To ActionYour hero image should be paired with a call to action to help encourage visitors to click further through your site. A good call to action will guide users to their next stage in the experience they receive on your website with ease, so much so the user doesn't realise that they moved forward. It should be subtle and natural.

Test

Pretty much every aspect of a hero image can be tested and should be tested to see if it resonates with your audience. There are several tools out there that can direct 50% of your traffic to one version of a page and 50% to the other. You should test the following:The imageThe CTA and any other textThe colours and contrastTesting offers an opportunity for you to see what actually works versus what you may think is working. You simply won't know what works for your audience until you test!

Tools for Finding Hero Images

There are several online photo stock images but only some of them provide quality images. Some of our favourites are Canva, Pexels, Creative Market and Unsplash. On these websites you will find natural, well-sourced images.

In need of a web design in Dubai company? Talk to our consultants on how we can help you.

Share this on Facebook, LinkedIn and Twitter.