By Unless you have been hiding under the rock for decades now, you should be familiar with hero images. If you don’t, it’s simple – obviously, it’s the image of a hero…
Gotcha!
Of course not! Well, technically it’s a hero but it’s not the one that can leap through the tallest buildings or one that’s faster than the speeding bullet. You don’t “lookup in the sky” just to see it and of course, it’s not a bird, not even a plane.
See what I did there? Lol.
They are not the heroes that we want but, in the internet marketing universe, they are heroes that we need.
What a hero image is?
Remember the stone age of the internet?
It was quite boring. When you visited websites, you only saw a bunch of words in different sizes and colors. You were not easily attracted to a sales page whatsoever. But as web designers grew enough experience, they learned to use one of the most efficient tools in marketing – images.
Here’s another discovery – people are visual animals. This means that we can easily understand something with the use of visual aid. We can easily get attracted or interested when we see images with the right color, placement, and composition. Using this powerful reality, digital marketing experts began to make a trend of using images as the first thing users see on their web pages – thus, the birth of hero images.
Basically, a hero image is a first and main photo or graphic that you see when you open a web page or an email. It’s mostly on top or center. You’ll immediately know it because it’s usually the first thing that would get your attention.
It should really get the attention because that is its main goal – to show the visitor what your site and its contents are all about. The best thing about this is that you have the freedom to choose any image or graphic that you want to show the world what you can offer.
Hero image assemble
In web design, hero images are literally heroes. They have become really popular especially in these recent years because they just look good, tacky, and really hold visitors for a long time. The longer your visitor stays, the chances of engagements also increase. Designers who are using the right hero images guide will do more than just having massive traffic. It can actually lead to sales – if that’s not saving your day, we just don’t know what is.
Hero images come in different sizes and shapes. They can also be in a form of full-screen banners or large headers. And because web design has progressed from more than just HTML (we now have JavaScript, Flash, and the likes), these tools have been maximized to make any website more visual. The landing experience has never become this popular. This is why it’s now a battle of style and feature.
Social media giants like Facebook and Twitter also used these concepts and because of their success, other retail websites moved away from displaying category pages as their main content towards a more flamboyant one. The flashier, the better! (There it goes again, lol)
Leveling up hero images
Putting on these images and graphics to your website is one thing but since this has become a trend, you’re not the only one who’s going to use this. In fact, a lot of websites are now focusing on how to step these ones a notch. You need to level up as well. With the best practices and taking note of great hero images guide, surely, you’ll find your sites more powerful and attractive.
Level up through High Quality images
This might be basic, but this should be on the top of the list. Make sure the images that you use are sharp. Remember that computer screens and mobile phones are more graphically demanding these days and you don’t want to give a low-resolution image that would give out a fuzzy look. To avoid this, one technique is to resize your images use online tools such as tinyjpg down and not up.
The size of the image that you want to use will of course depend on what you want to portray. If you want your hero image to take the whole page, make sure that the image that you have is 100% of the container tag through VW and VH.
Learn to customize your stock images as well. Make sure that the background isn’t too loud on the area where you will put your text in – add in some color contrasts as well.
Level up through Appeal
Your hero image should always accurately represent what you want to present or sell. If you are shoes, for example, it’s nice to have an image where a model wears a pair of nice shoes and not a person who holds an umbrella for no reason.
The slogan can be a good thing but make sure it’s not too long. A picture can paint a thousand words – as they say so you don’t need to make it long. Using captions that are accurate can also help as they are mostly read.
Level up through Testing
It’s also a nice thing to test and optimize your hero image. Just because you find it cute and interesting will mean that more people will like it too. Don’t be too complacent with what you have as it doesn’t always guarantee a higher conversion rate. Test and test your hero images until you find the perfect one that will deliver. Continued testing will make you learn lessons and avoiding mistakes.
Where to get hero images?
You don’t need to create your own hero image though it’s a good thing if you have the ability to do so. Nevertheless, there are a lot of websites that offer these services and can help you customize your pages and transform it into traffic-driving, top-selling, and conversion-making ones. Sites like Canva have a huge collection of stock photos that you can fully utilize to the max.
Hero images are awesome tools for your digital marketing success. Knowing all these is just the beginning. Along the way, you’ll get to learn new stuff and other best hero images guide that will further pump your website to success.
