Hero Image: Defining and Implementing

What is a hero image? Well, this depends on context, to a graphic designer it is an oversized banner image at the top of a website. To a marketing photographer it is the image that will sell the product. To a wedding photographer it is the one shot that brings back the emotion of the couple’s special day. Whatever the context, it is the most important image.  The term “money shot” tends to be a little harsh and materialistic, which to artists, can be offensive. This is why the phrase “hero image” is softer and less aggressive and more appropriate in many cases.

On the web, you only have between 10 – 20 seconds to make an impression on your viewer, so having that initial hero image is imperative. Make sure you have an image that lets your viewer know precisely what service or product you are offering. One may be tempted to use quirky or unusual images in an attempt to stand out, however if your viewer is unsure what message you are trying to convey, they will quickly move on.

Having the right colors to represent your product and mood is also essential. Does the color represent what you are selling? Red will seem passionate and urgent, and it also represents sales and good value. A customer looking for a value priced item will be drawn to a hero image that has red incorporated into it. Red is impulsive, making a sports car image in red the perfect combination.

Credit: Nitin Patil

A hero image is that first impression that can gain trust and credibility with the viewer. Always use a high-resolution image that creates a positive impact. But make sure the image is not too big. Optimizely.com states in a recent article that based on Google research, “it’s been shown that increasing page load speeds from 0.4 to 0.9 seconds can reduce traffic by 20%.”

Use an original image that embodies the core value of the company. You can even use a video as a hero image rather than a static one–or better yet, use a combination. Whether you use an image or video make sure that it tells the story of the product or service you’re providing. There not only is a small amount of time to reach your viewer, there’s a small amount of space (real estate) on that banner.

There are three things that a hero image should have…

1. It should grab the viewers’ attention
2. The copy should be captivating
3. Combine the “hero image” with an action button

Let’s look at some stand-outs! These veteran designers are icons when it comes to lasting impressions and successful marketing campaigns.

Ralph Lauren

Dolce and Gabanna

Roche Bobois