To Hero or Not to Hero…

Marketing, Responsive Web Design | posted on July 5, 2017

Over time we’ve had websites go from content fitting within an 800px wide box, to 1284px or 1400px, to responsive programming that allows a website to be viewed fluidly across all platforms, no matter the screensize. One of the largest trends in 2017 is the usage of extra-large images, known as hero images. Bold graphics that draw attention from a customer right away and informs them of your website’s mission.

How do you get the most out of your hero image?

Your hero image is the first thing users will see when browsing your website. It is important the image is relevant to your services or brand. If your image does not communicate this easily, visitors will be left confused.

In our Phoenix Pool Services design, we chose to go with a hero-sized video showing someone jumping into a shimmering pool. This allows the customer to visualize their own pool with sparkling water and jumping right in.

Another client of ours, Bella’s Lawn Care, has a hero image of grass, dirt and a small plant with roots. Communicating your business with a hero image is easily accomplished by choosing the right photos.

When browsing our client’s websites, you can easily tell Phoenix Pool Services provides pool cleaning and maintenance services to customers, while Bella’s Lawn Care offers landscaping, lawn care and landscape design.

Adding a touch of your brand’s colors on the images is beneficial as well.

Break Hero Images Down

Does your hero image serve a purpose?

If you’re trying to sell a product, show your product in a real setting with the hero image. Display how a customer would use your product.

Does your hero image support your overall design?

Your hero image shouldn’t stand out like a sore thumb. It should fit seamlessly into your overall website’s design. It is okay to invoke emotion or action – after all, that’s how business’ gain new customers.

Is your hero image relevant to your business?

As mentioned previously, communicating your brand’s service or mission is a key element of choosing your hero image. Be selective. Use resources such as Pexel or Dreamstime for stunning stock photos.

Does it fit within a responsive design?

Resizing your image to mobile devices is important. Whether you’re creating breaking points with cropped images or simply resizing to fit a specific screen size, there are multiple ways to make sure your images are clear on any platform.

With hero images, you are able to create stunning websites that communicate your brand, services or mission with ease. Contact us to begin your website design journey.

Leave a Reply