In viewing a website, the first thing that we notice is, of course, the header. It is actually the portion that catches the viewer’s notice first before the content most especially for random searches or viewing. In one of our previous post, we have showcased several cool and interesting footers for websites. As a follow-up to this post, we have come up with a collection of the footer’s counterpart in web layout.

Here is A Showcase of Effective Headers in Web Design that you can look into for new ideas on successful headers. Check out these items and be inspired in creating your own outstanding header!!!

You may want to take a look at the following related articles:

40+ Examples of Horizontal Scrolling Websites

30 Beautiful and Illustrative Website Footers

35 Inspiring Watercolor Effect in Web Design

45+ Excellent Examples of Flash Websites Design

The Alamo Basement

the alamo basement

Gary Nock

gary nock

Nition Design

nition design
View Site

Raskulls

raskulls

Visit Site

Dale Harris

dale harris

Aya Kaito

aya kaito
View Site

Fran Fernandez

fran fernandez

Visit Site

Carbon Sugar

carbon sugar

Visit Site

Mike Poss

mike poss

Visit Site

ICFF

icff
View Site

By Land Sea or Air

by land sea or air
View Site

Brown Blog Films

brown blog films

Visit Site

The Pixel

the pixel

Visit Site

Allananova

allananova

Visit Site

Vunky Blog

vunky blog

Visit Site

Sob Controllers

sob controllers

Visit Site

The Rox

the rox
View Site

Black Moon Dev

black moon dev

Web Designer Depot

web designer depot

Visit Site

Muchasmaracas

muchasmaracas

Visit Site

Work Awesome

work awesome

Visit Site

Cult F

cult f

Visit Site

Ready Pphoto Site

ready photo site

Visit Site

Hey Josh

hey josh

Visit Site

Smooth Piece

smooth piece
View Site

JR Velasco

jr velasco

Visit Site

Bei

bei

Visit Site

Ug Smag

ug smag

Visit Site

Tru Speaks

tru speaks

Visit Site

Source Bits

source bits

Mark Forrester

mark forrester

Visit Site

Hey Indy

hey indy

Visit Site

Acko

acko

Visit Site

Split Dadiz

split dadiz

Ronald Bien

About the author: A Graphic Designer and the founder of Naldz Graphics. He launched Naldz Graphics to help the Design Community in providing quality design resources and tutorials.

27 comments

  1. Another inspiring post. keep up the good work naldz

  2. I’m going to have to disagree on this one. Most of these headers are pretty, certainly image heavy, but not especially effective. Most of them you have to hunt around for navigation. Amd, some are so large that the content is completely dwarfed.

  3. Great compilation of some elaborately designed headers & the websites they are home to . I know several of them , and there are a few I have not seen yet – which I will do so now 🙂
    Thank you for your effort in putting this together for the community’s inspiration ! 🙂

    M.?

  4. I really like the style of Gary Nock and Acko. All of these show great ingenuity.

    Acko almost has a Trom feel to it. Great designs all!

  5. Good collection, but what makes an effective header? I came expecting ideas and tips and examples. This is more ‘sexy headers’ or ‘stylish super designed headers’!

  6. Some really great looking websites here. Every time I think I’m happy with ours site I see something else that makes me want to tweak ours some more! Gotta love it!

  7. I like these hugely but they all seem to be blogs or similar. How about a collection of effective e-commerce headers or manufacturing company headers for balance and contrast.

    Keep up the good work!

  8. These headers are very inspiring. I love the illustrations in many of these.

    Nice post!

  9. I’m going to agree with barbara. While stylish and image intensive graphics can be effective for capturing attention or displaying your work, some of these take up excessive room without displaying much useful content. Not effectively balancing their use of screen real estate.

    However, many of these _are_ very effective headers by displaying things like navigation, logos, and artwork that establish or are consistent with the look and feel of the website.

    Overall still a great post!

  10. wow, that kind of Graphics Design I am going to use to my website.
    nice work keep up..

  11. Some really inspirational header designs, but in a stride of showing up the creativity the importance of content has been compromised and this is something serious for profession website designs.

  12. What do you mean by “effective headers”? For me those headers are overloaded. Ok I admit they all look pretty cool. But my eyes want to look at the header all the time. So the content don’t get the attention it deserves…

    Hope you understand what I mean (I really hope my english will get better some day…)

  13. Great list – love the inspiration of these. Thanks~

  14. Can you do the same thing with real company website examples ?! I don’t think so.

  15. amazing concepts you sharing in this article. thanks

  16. After viewing these examples
    I started thinking about the meaning of the term effective…

  17. @Marc

    I was just about to say the same thing. Flashy and creative headers. No so much on effective. Nice collection still. Thanks.

  18. Thank you so much for such true inspirational examples! I am definitely a fan! keep up the good work!

  19. Nice headers need to improve my creativity to match this type of work.

Comments are closed.