Design Elements: Headers
I’ve discussed text display in earlier posts. Headers are a special case.
Headers matter to search engine spiders. They also matter to human readers, because they break up the Web page and make it easier to scan. You can quickly see if there’s anything on this page that answers your question or meets your need.
On both counts, therefore, the important thing for a page designer is to have plenty of them. As far as sizes go, you can of course use a style sheet to set them to any size you like. I would myself stick to at most three different sizes. When I’m not defining sizes myself, I find that <h2>s, <h3>s and <h4>s often fit the bill.
Very big headers in standard Web fonts like Arial/Helvetica or Verdana are the visual equivalent of shouting. They need to be saved for unusual special effects. People don’t like being shouted at.
At the other end there are situations when it’s useful to have an <h4> at the top of every paragraph (or two). It makes for easier reading. But don’t let the browser use its default padding. Make sure the header is really close to the paragraph below, and that the only obvious gap is after the paragraph before.
Think hard about horizontal positioning, too, and the invisible vertical gridlines that our eyes often find satisfying. In far too many of my early sites, I centred headers. This can give a Web page a ragged, untidy look. I now tend to go for vertical alignment—headers are either left aligned, or indented identically (say 10px or 2% or 5em or …). It makes for a stronger line.