Nothing is for sale here. Freewill tips keep the site running. Want to help? → Tip via Paypal

Headings

Headings are used for titles and sub-titles, and for smart webmasters, for search engine optimization and to add important white space to web pages.

Headings come in six different sizes. From largest to smallest, they are written as:

<h1> heading text here </h1>
<h2> heading text here </h2>
<h3> heading text here </h3>
<h4> heading text here </h4>
<h5> heading text here </h5>
<h6> heading text here </h6>

Here’s what the heading sizes might look like on a web page:

heading sizes I wrote that's what they "might" look like because the actual rendered size can vary with the font used, plus the size of any text element can changed using CSS. You can learn advanced text formatting in the font sizes tutorial in the CSS tutorials.

As you can see, there is a good deal of space in between each heading. That’s because a heading creates a empty line above and below itself, although CSS can be used to change that behavior as well.

The way headings are used is similar to the way titles and subtitles are used in a newspaper article or magazine column, with the title being written using a larger heading and subtitles using smaller headings.

Typically, the h1 through h3 size headings are displayed in a larger font than normal. An h4 heading is the same size as the default text only in a heavier font weight, and h5 and h6 are smaller than normal text. All are usually rendered in bold type, although some browsers may deviate from that common presentation.

The h1 or h2 heading is typically used for the primary page title, while the h3 and h4 headings are used for subtitles. The h5 and h6 are seldom used because they are so small, which makes them more suitable for disclaimers, copyright notices and other boilerplate messages unless the size is controlled with CSS.

Search Engine Considerations

Historically, search engines have considered the text inside heading tags as more important than the same text in unemphasized content flow. This means you should choose the words for your headings carefully because headings not only summarize the content that follows for your readers, but they also inform the search engines of the most important concepts of your content.

A cautionary note: in the early days of search engine optimization some webmasters used heading text that wasn't related to the content, but were more popular search terms, trying to bring in more visitors from the search engines. It worked for a short time, but the search engines caught on and not only prevented it from happening, they penalized the sites that did it.

You'll find more information about search engine optimization in the articles section of this site.

White Space

No one likes to run head first into a wall of text. Many people, if not most, will click their browser's back button if a page looks too tedious to read. That's why using heading tags is important. It provides a "resting space" for the eyes, so to speak. Using images, bulleted lists, and other techniques also help make a page more user friendly. You can find more info about white space usage in this white space article.

That’s the heads up on headings. Now go buy me something really cool, like a rocket ship. Seems fair. giggle emoji