O'Reilly logo

Before & After by John McWade

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter . Design a beautiful Web header: Create an effective header the easy way. Just think in sections.

The header of a simple Web page is its most important visual element. On many blogs, it’s the only visual element. So it has a big job to do! It must identify the site and set its visual tone. It must convey at a glance what kind of site it is and what its attitude is. The header must also provide easy navigation. All of this is easy to do by building three sections, one for each function, and unifying them with visual similarities. Here’s how to put that together.

Design a beautiful Web header: Create an effective header the easy way. Just think in sections.

Start by divvying up the space

A Web header spans the page and is extremely shallow. ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required