SEARCH
  Web Design Basics Design Principles 15 Templates With Awesome Hero Headers

15 Templates With Awesome Hero Headers

AliceL Design Principles Oct 14, 2015

One of the biggest trends in web design right now is hero header - the huge image at the top of the home page. Initially, hero headers were oversized photos directly related to the content, usually it was a photo of the website owner or their work (especially on the portfolio websites and blogs).

Nowadays hero header is much more than a simple high resolution photo. Designers love to play with this thing, so you can come across hero headers in the form of illustrations, vector backgrounds, images with animated elements, image sliders and even video. There are hero headers with text, navigation elements, there are really no limits here.

Being the first thing to be seen on a website hero header has to be of the utmost quality, it has to be relevant and exciting, or at least visually appealing. Here are a few other things to be considered when using a hero header on a website:

  • If you want to include branding make sure the logo or brand mark does not deflect attention away from the image, if possible - opt for monochrome color scheme logo, and place it at the top left corner.
  • Use bold typography. But make sure only the most important text over the image is really big, the rest should be subtle and unobtrusive, including the navigation elements.
  • So, one big picture and one big piece of text is the way to go.
  • While we are talking about text and typography - opt for large and thin typefaces. These are more trendy currently and easier on the eyes.
  • It goes without saying - all the text has to be readable.
  • Pick simple color schemes.
  • Include visual cues to help your visitor understand what is to be done next (click or scroll, or maybe you invented a new way to navigate).

To illustrate hero headers done well, here are 15 templates with hero headers from our collection of premium templates. I hand-picked the most unusual, exciting examples for you.

Taste WordPress Theme

Food and Drink WordPress Theme

Fashion Magento Theme

Fashion Magento Theme

Perfect Gifts WooCommerce Theme

Gifts WooCommerce Theme

Motorhome Website Template

Gifts WooCommerce Theme

Sport WooCommerce Theme

Sport WooCommerce Theme

Cars Magento Theme

Cars Magento Theme

Soccer Shop OpenCart Template

Sport OpenCart Template

Nightclub Joomla Template

Nightclub Joomla Template

Maintenance Services WordPress Theme

Maintenance Services WordPress Theme

Real Estate OpenCart Template

Real Estate OpenCart Template

Event Planner Drupal Template

Event Planner Drupal Template

Rodeo Arena WordPress Theme

Rodeo WordPress Theme

European Restaurant Joomla Template

Restaurant Joomla Template

Industrial PrestaShop Theme

Industrial PrestaShop Theme

Exterior Design Joomla Template

Industrial PrestaShop Theme

ABOUT THE AUTHOR

Alice Lagno

Hey all! I’m Alice, I’m a copywriter who is passionate about all things related to web design. Check out my G+ page

subscribe to newsletter