Amber Weinberg: Freelance Web Developer specializing in semantic WordPress, Mobile, CSS and HTML5 Development

The Blog

15 Beautiful CSS-Based Website Heroes

Posted on 01/21/10 in blog, design about ,

A hero on a website is the large, often graphic-based, top portion of a homepage underneath the header. For example, the sliding featured portion of my own homepage, is my site’s hero.

This section of a website is called a hero, mainly because it’s one of the first things a new visitor sees upon coming to the site and is often what grabs their attention and makes them stay to look around. Thus that section is a “hero” for saving your site’s day. (dorky, I know)

What makes a hero successful? A beautiful design for sure, but a large call-to-action, tagline or some kind of purpose to the site is really what the hero is for.

Let’s take a look at 15 beautiful uses of the hero on the web today.

About the author
Amber Weinberg specializes in clean and semantic XHTML, CSS and WordPress development. She has over 10 years of coding experience and is pretty cool to work with. Amber is available for freelance work, so why not hire her for your next project?

6 Awesome Comments

  1. Mike says:

    Really cool you mentioned Digital Mash. Been a fan of his for a long time.

  2. I really like the list you came up with, there’s a nice variety in color usage. Also, they all have a clean and straight-forward interface.

  3. Sam says:

    Where did you find these? Loved them. Especially Spoon graphics and the minding monsters.
    Great work

  4. It is nice to see some super bloggers keeping their webpage up, one of my other bookmarked site about goji just stop loading the other hour for no appearant reason.

Leave a Reply