Oct 28, 2015
Subscribe now and get the latest podcast releases delivered straight to your inbox.
7 Tips for Choosing a Hero Image That Will Slay the Design Game
Oct 28, 2015
We all know the importance of a first impression. Some people even say that an initial judgment is made in seven seconds or less. Unfortunately, for all of us digital marketers and creatives, studies show that, with a website, you only have about 50 milliseconds (or 0.05 seconds) to captivate your audience.
One of the very first things people see when landing on your website is your hero image.
Take full advantage of yours and use it as a tool grab your user’s attention and keep them on your site.
Below, I’ve compiled a list of seven tips for choosing a hero image that will help you do just that -- and make an awesome first impression.
1. Use directional cues.
Guide your audience to your value proposition using your hero image. Studies show that humans will naturally follow the gaze of other humans. Use a photo of someone looking in the direction of your value prop or CTA to lead your audience there.
Pro Who Got it Right: Virool
Virool, a video marketing platform provider, nailed it. Even though the subject’s eyes are not in the picture, it shows just enough to create a clear gaze right for their headline and call-to-action button.
2. Visually support what your value prop is saying.
You’ve put the time in to create a really powerful H1. Don’t go and ruin it by picking a lackluster hero image. Pick a photograph that is just as strong and moving as your statement is and more importantly, make sure your statement and visual are saying the same thing.
Pro Who Got it Right: Acme
Acme, an industrial solutions provider, makes a striking impression with their hero image-H1 combo. The foggy cityscape seen from above the clouds offers a futuristic, industrial feel, which perfectly supports their line, “We Pioneer the Future.”
3. Create an emotional reaction.
One critical way to get your audience engaged right off the ball is to create a guttural, emotional reaction with your hero image. When they first land on your page, Leave them with a feeling they can’t ignore.
Pro Who Got it Right: AMY, Forever
The website for AMY, Forever, the documentary about Singer/Songwriter Amy Winehouse, is a heartbreaking example. The hero image here focuses on a cropped photo of Amy staring straight out at the camera with an indecipherable expression. Knowing the singer’s tragic end, the photograph stirs up emotions of all kinds and leaves you wondering what is behind the gaze.
4. Play with color.
Create allure with the color in your hero image. Up the contrast and play with something slightly off-brand. Create something unexpected (yet still pleasing to the eye) to get your audience interested at first sight.
Pro Who Got it Right: Spotify Found Them First
Spotify Found Them First does a killer job with this. In their hero image, they’ve manipulated a series of photographs of artists to fit into their vibrant color scheme that’s contrasts perfectly with their headline.
5. Use an illustration.
A hero image doesn’t necessarily have to be a photograph, sometimes a well thought-out illustration can have just as strong a presence.
In the sea of beautiful, artistic hero images, illustrations are surprisingly rare so using one could be just the thing your brand needs to set you apart from your competition.
If the idea of creating an illustration of your own is terrifying, however, don’t worry; there’s a wealth of illustrations for sale on sites like Shutterstock and Creative Market.
Pro Who Got it Right: Keep Portland Weird
Keep Portland Weird has an awesome illustration highlighting their earthquake preparedness initiative with a cityscape of Portland that captures the character of the city, but also shows the impact an earthquake could have on it.
6. Idolize your product.
If you’re focused on pushing a product or a series of products, make that the focus! Show it off, and make it look larger than life.
Pro Who Got it Right: B & O Play
B & O Play, makers of music systems and speakers, did just that for their H6 Rapha Edition Headphones. The page loads on a floating image of the black and pink headphones that brings the drama and allure to draw the focus to their product.
7. Be relatable.
Speak to your audience; set a scene that will resonate with your buyer persona. You don’t want to turn someone off of your site and brand because they can’t relate with you at all. Choose a picture that is reflective of your audience.
Pro Who Got it Right: Woodbuds
Woodbuds, makers of eco-conscious high-quality wood earbuds, does just that. Their hero depicts a stylish man in a wooded setting listening to music, suggesting both a love of nature and music.
This paints a realistic and relatable picture of how their ideal persona would most likely interact with their product. This not only resonates with their persona, but it helps them envision themselves actually using Woodbuds.
Free: Assessment