Structuring Posts: Use of Headings

Any post is going to have some structure, even if it's a single headline followed by the body of the text. Longer articles might have subheadlines and sections of text that help structure the post for readability.

On the web, these structures are important for making the article understandable to visually-impaired people using screen readers. Well-structured articles also help search engines more accurately index and make sense of the content. This helps optimize your website for search.

Headings

A newspaper story or a web post always has one main headline. On the web this would be your main "heading," and it's what you enter in the title field of a post. In HTML there are six heading levels: Heading 1 through Heading 6 (in HTML these are h1 through h6). The title of your post is always a Heading 1. For every post, there should always and only be a single Heading 1.

If your post has several sections, each of the sections should have a subheading. Think of the subheading as nested within the main heading. So each section of the post would have a Heading 2, and if that section has a subsection it should have a Heading 3.

To carry this to an extreme, which is rare but possible, your post structure could look like this:

Heading 1

Right after the h1 comes the lead paragraph(s) - Reminder: Don't use a Heading 1 inside a post. The post title is already an h1.

Heading 2

Section text

Heading 3

Subsection text

Heading 4

Subsubsection text (rare)

Heading 5

Subsubsubsection text (very rare)

Heading 6

Subsubsubsubsection text (exceedingly rare!)

Note that the heading fonts usually appear smaller from Heading 1 to Heading 6, although some websites have styles that don't display smaller fonts for sub-headings. The most important thing about headings is the structural hierarchy they provide, not the visual hierarchy. Based on that structure, blind users can navigate the page, and search engines can better index the content.

Most posts don't need more than two or three levels of headings and subsections. Just remember that if you nest a subsection within a section, you should use the heading level that follows the nesting structure.

As an example, a post with subsections could be structured like this:

What I Like to Eat (Heading 1)

This is an article about food I like. It contains several sections about this. First, we'll talk about Fruit, then Vegetables, Snacks, and finally Bread.

Fruit (Heading 2)

Fruit tends to be pretty good, depending on things like ripeness etc. Some fruits tend to be juicy and other fruits are actually crunchy. Let's examine these two kinds of fruit.

Juicy Fruits (Heading 3)

Oranges and watermelon are examples of juicy fruit. If you drop a watermelon from a tall building, for example, you will see just how juicy it is. Be careful if you do this not to hurt people.

Crunchy Fruits (Heading 3)

Apple and pears tend to be crunchy in general. Sure they have juice too, but mostly they go "crunch" when you eat them so I'm calling them crunchy fruits.

Vegetables (Heading 2)

As we always tell kids, you should "eat your vegetables." You can grow your own vegetables, or buy them somewhere but that costs money. Here are some types of vegetables I like.

Green Vegetables (Heading 3)

Peas, green beans, cabbage, lettuce, brussel sprouts, are all characterized by the color green. It's a good color for vegetables.

Red Vegetables (Heading 3)

Radishes are mostly red, as are tomatoes. You can also find red squash and probably other red vegetables. Wait, are tomatoes vegetables or fruit? I always forget.

Snacks (Heading 2)

So aside from vegetables and fruit, I like just about anything that comes in a snack package of some kind. We could explore different snack types at some length but we'll leave that for another time.

Bread (Heading 2)

Bread is so useful for sandwiches, french toast, and other things made with bread.

So that about covers what I like to eat.

How to Add Headings in a Post

Just select the text you want as a header, and click the text formatting drop-down menu to select the header level you need: