Headings are easily one of the most important and most misunderstood features of a website. For most people, they’re just ways to break up their content. Instead of having walls of text and paragraph after paragraph of content, WordPress headings allow you to create chunks of content that give your readers easy breaks.

But that’s just the tip of the iceberg, really. There’s a lot more to using headings properly than just spacing out your content.

Headings All the Way Down

HTML headings are used with flags that range from H1 (representing the primary–and usually largest–heading of the page) all the way down to the almost-never-used H6.

When I first started to freelance as a web developer, one of my buddies gave me the skeleton CSS file he used as a base for every single site he built. At the very top were style for, you guessed it, headings 1-6.

h1, h2, h3, h4, h5, h6 {
    font-family: "PT Sans", arial, sans-serif;    
    color:  #000000;
}

h1 {
    font-size: 34px;
    font-weight: 400;
    text-transform: uppercase;
    margin: 40px 0px;
}

h2 {
    font-size: 32px;
    line-height: 35px;
}

h3 {
    font-size: 24px;
    line-height: 32px;
}

h4 {
    font-size: 24px;
    line-height: 28px;
}

h5 {
    font-size: 10px;
    font-weight: normal;
    line-height: 16px;
}

h6 {
}

I bring this up for three reasons:

  • So you can steal it and have an easy time of styling yours
  • So you can see how unimportant H5 and H6 tend to be
  • And so that you can get an idea of the general WordPress headings heirarchy

You can play around with that and make sure that each of your headings is as pretty and perfect as you need them to be. Window dressing aside, the real important thing is how you make use of the headings.

H1, the Head Honcho

Remember in the movie Highlander where they constantly emphasize that “there can be only one!”? Well, that’s kind of the thing here, too. You can only use a single instance of H1 on each particular page or post.

Generally speaking, WordPress wraps your page/post title in H1 flags, so this isn’t really something you need to worry about adding yourself. (Divi doesn’t change this functionality, but some themes might, so keep that in mind.) You just need to not add them yourself.

There has been some waffling about this, too, as you can technically use H1 when you flag something as a new section, but search engines tend not to care, and the same aesthetic effect can be had by styling your H4-H6 to look like your H1.

You can read more about the head honcho heading in our total overview.

H2, the Work Horse

My fingers type out H2 flags on a daily basis more than probably anything else. These tend to be the WordPress heading that gets used most often because of how versatile it is. It’s not limited like H1 is, you can really break apart your content to make it easily scannable, and there are enough subheadings that you can nest any number of topics underneath it without fear of breaking the flow of your content.

Most of the headings that break apart the sections in this post, for instance, are H2. You can see the difference in the post title and the headings really easily. Like I said…H2 is the work horse of the headings, and it’s likely to become your new BFF as you start to up your WordPress headings game.

H3, the Sidekick

Think about H3 as the Robin to H2’s Batman. It’s always there when you need that little extra oomph to get you out of trouble or handle a tough situation.

Generally, H3 is a totally optional heading to include. Many posts I write don’t involve them at all, but when I need to really go in-depth for a topic (or multiple topics), using the tertiary heading gives me a lot of control on how I can present my information.

See? H3 Makes Subtopics!

I tend to think of H3 in much the same way as I do an unordered list (UL in HTML), only I can supplement them with paragraphs of detail that look a lot nicer and are easier to read.

If I were to have done this with a list, it would have looked pretty wacky. And there wasn’t enough extra information to include it as a major point in the overall discussion. Fancy, right?

H4 – H6, the Forgotten Ones

Aww, poor little H4, H5, and H6. You’re such good headings that want to be used so much, but most people don’t know how or have reason to use you at all. So you get forgotten by most designers and writers.

I mean, most CSS files don’t even include you in styling. (As you can see in my example above, there’s a placeholder spot for H6, but it’s empty. Cue sad trombone noise.

From what Moz and other SEO folks tell us, the use of these minor headings are totally and completely optional. Including or not including them shouldn’t hurt your web rankings (or help them, honestly). Like I said under H1, these WordPress headings are great for styling and CSS experimentation.

WordPress Headings and SEO

First off, if you’re not using the Yoast SEO plugin, you should be. With that out of the way, the use of headings are a major player in how well you rank for organic searches.

That’s not to say you should use them for keyword stuffing, but if you want the search engine crawlers to easily parse your site, then making sure your keyword is in the most easily searchable part is a pretty smart move. You just don’t want it in every heading.

Take a look at these guidelines that Yoast gives you for headings to see some of what it’s looking for, and how much weight it puts on each element.

wordpress headings h1 to h6

The focus keyword appears only in 1 (out of 7) subheadings in your copy. Try to use it in at least one more subheading

Even though the keyword has been used once, the number of subheadings means that it’s percentage needs to be higher for it to really rank. So I would want to probably add the keyword in the concluding header to make sure I keep to best practices, despite being given the green light by the plugin.

But as you can see, it’s already green, so as long as you use it in a heading (preferably H2), you’re okay.

The SEO title is wider than the viewable limit

Basically, length plays a big part in headings, too. You want them to be seen in their entirety by not just the search engine crawlers, but by the real-life human beings doing the searches. So if your SEO title (generally your H1) is too wordy, folks may not see what your whole topic, and they’ll scoot on by.

That’s why it’s orange. It’s not bad to have this too long, but it ain’t necessarily a good thing, either.

1 subheading is followed by more than the recommended maximum of 300 words. Try to insert another subheading

Now, to be fair, this is in the Yoast readability analysis not the SEO, but it’s still mega important.

Why? Because of being scannable. There’s a reason there are memes everywhere on the internet about walls of text and why folks who talk a lot constantly include a TLDR snippet in their posts on Reddit.

People need digestible chunks of information, and 300 words is the high end of that limit. That’s not saying that those 300 words have to be dumbed down or overly simple, but it means you need to be able to break your ideas down to their constituent parts and discuss them individually…between H2 or H3 headings, preferably.

Oh, and One More Thing

See what I did there? I used H3 tags to break down those points for you so that I could discuss each of them more. Initially, I wrote out shorter, bulleted list. But I knew I needed to break down the info more, and went to using subheadings. Practicing what I preach and all that, I guess.

Additionally, the only required headings are H1 and H2. Well, even H2 is only recommended because 300 words is the minimum for being considered worthy of inclusion in Googles ranks these days. But you’re going to want to write more than that.

So you gotta use both. Remember that H1 is added automatically by WordPress.

So…How About Them WordPress Headings?

Eventually, appropriate use of headings should come naturally to you as a web content creator. You’ll find your voice, get your flow, and learn how to break down the content you’re writing into chunks. I won’t lie–it can be pretty tough to get the hang of.

But when you do, your articles will shine, both for your readers and for the machines that scan over them.

TLDR: No H1 because it’s already there, bunches of H2, some H3 to get yourself out of tight spots, and H4-H6 when you need to pretty something up.

What are some tips you’ve picked up that you can share for using WordPress headings across your site?

Article featured image by Visual Generation / shutterstock.com

The post The Ultimate Guide to Using WordPress Headings Throughout Your Website appeared first on Elegant Themes Blog.

Headings are easily one of the most important and most misunderstood features of a website. For most people, they’re just ways to break up their content. Instead of having walls of text and paragraph after paragraph of content, WordPress headings allow you to create chunks of content that give your readers easy breaks.

But that’s just the tip of the iceberg, really. There’s a lot more to using headings properly than just spacing out your content.

Headings All the Way Down

HTML headings are used with flags that range from H1 (representing the primary–and usually largest–heading of the page) all the way down to the almost-never-used H6.

When I first started to freelance as a web developer, one of my buddies gave me the skeleton CSS file he used as a base for every single site he built. At the very top were style for, you guessed it, headings 1-6.

h1, h2, h3, h4, h5, h6 {
    font-family: "PT Sans", arial, sans-serif;    
    color:  #000000;
}

h1 {
    font-size: 34px;
    font-weight: 400;
    text-transform: uppercase;
    margin: 40px 0px;
}

h2 {
    font-size: 32px;
    line-height: 35px;
}

h3 {
    font-size: 24px;
    line-height: 32px;
}

h4 {
    font-size: 24px;
    line-height: 28px;
}

h5 {
    font-size: 10px;
    font-weight: normal;
    line-height: 16px;
}

h6 {
}

I bring this up for three reasons:

  • So you can steal it and have an easy time of styling yours
  • So you can see how unimportant H5 and H6 tend to be
  • And so that you can get an idea of the general WordPress headings heirarchy

You can play around with that and make sure that each of your headings is as pretty and perfect as you need them to be. Window dressing aside, the real important thing is how you make use of the headings.

H1, the Head Honcho

Remember in the movie Highlander where they constantly emphasize that “there can be only one!”? Well, that’s kind of the thing here, too. You can only use a single instance of H1 on each particular page or post.

Generally speaking, WordPress wraps your page/post title in H1 flags, so this isn’t really something you need to worry about adding yourself. (Divi doesn’t change this functionality, but some themes might, so keep that in mind.) You just need to not add them yourself.

There has been some waffling about this, too, as you can technically use H1 when you flag something as a new section, but search engines tend not to care, and the same aesthetic effect can be had by styling your H4-H6 to look like your H1.

You can read more about the head honcho heading in our total overview.

H2, the Work Horse

My fingers type out H2 flags on a daily basis more than probably anything else. These tend to be the WordPress heading that gets used most often because of how versatile it is. It’s not limited like H1 is, you can really break apart your content to make it easily scannable, and there are enough subheadings that you can nest any number of topics underneath it without fear of breaking the flow of your content.

Most of the headings that break apart the sections in this post, for instance, are H2. You can see the difference in the post title and the headings really easily. Like I said…H2 is the work horse of the headings, and it’s likely to become your new BFF as you start to up your WordPress headings game.

H3, the Sidekick

Think about H3 as the Robin to H2’s Batman. It’s always there when you need that little extra oomph to get you out of trouble or handle a tough situation.

Generally, H3 is a totally optional heading to include. Many posts I write don’t involve them at all, but when I need to really go in-depth for a topic (or multiple topics), using the tertiary heading gives me a lot of control on how I can present my information.

See? H3 Makes Subtopics!

I tend to think of H3 in much the same way as I do an unordered list (UL in HTML), only I can supplement them with paragraphs of detail that look a lot nicer and are easier to read.

If I were to have done this with a list, it would have looked pretty wacky. And there wasn’t enough extra information to include it as a major point in the overall discussion. Fancy, right?

H4 – H6, the Forgotten Ones

Aww, poor little H4, H5, and H6. You’re such good headings that want to be used so much, but most people don’t know how or have reason to use you at all. So you get forgotten by most designers and writers.

I mean, most CSS files don’t even include you in styling. (As you can see in my example above, there’s a placeholder spot for H6, but it’s empty. Cue sad trombone noise.

From what Moz and other SEO folks tell us, the use of these minor headings are totally and completely optional. Including or not including them shouldn’t hurt your web rankings (or help them, honestly). Like I said under H1, these WordPress headings are great for styling and CSS experimentation.

WordPress Headings and SEO

First off, if you’re not using the Yoast SEO plugin, you should be. With that out of the way, the use of headings are a major player in how well you rank for organic searches.

That’s not to say you should use them for keyword stuffing, but if you want the search engine crawlers to easily parse your site, then making sure your keyword is in the most easily searchable part is a pretty smart move. You just don’t want it in every heading.

Take a look at these guidelines that Yoast gives you for headings to see some of what it’s looking for, and how much weight it puts on each element.

wordpress headings h1 to h6

The focus keyword appears only in 1 (out of 7) subheadings in your copy. Try to use it in at least one more subheading

Even though the keyword has been used once, the number of subheadings means that it’s percentage needs to be higher for it to really rank. So I would want to probably add the keyword in the concluding header to make sure I keep to best practices, despite being given the green light by the plugin.

But as you can see, it’s already green, so as long as you use it in a heading (preferably H2), you’re okay.

The SEO title is wider than the viewable limit

Basically, length plays a big part in headings, too. You want them to be seen in their entirety by not just the search engine crawlers, but by the real-life human beings doing the searches. So if your SEO title (generally your H1) is too wordy, folks may not see what your whole topic, and they’ll scoot on by.

That’s why it’s orange. It’s not bad to have this too long, but it ain’t necessarily a good thing, either.

1 subheading is followed by more than the recommended maximum of 300 words. Try to insert another subheading

Now, to be fair, this is in the Yoast readability analysis not the SEO, but it’s still mega important.

Why? Because of being scannable. There’s a reason there are memes everywhere on the internet about walls of text and why folks who talk a lot constantly include a TLDR snippet in their posts on Reddit.

People need digestible chunks of information, and 300 words is the high end of that limit. That’s not saying that those 300 words have to be dumbed down or overly simple, but it means you need to be able to break your ideas down to their constituent parts and discuss them individually…between H2 or H3 headings, preferably.

Oh, and One More Thing

See what I did there? I used H3 tags to break down those points for you so that I could discuss each of them more. Initially, I wrote out shorter, bulleted list. But I knew I needed to break down the info more, and went to using subheadings. Practicing what I preach and all that, I guess.

Additionally, the only required headings are H1 and H2. Well, even H2 is only recommended because 300 words is the minimum for being considered worthy of inclusion in Googles ranks these days. But you’re going to want to write more than that.

So you gotta use both. Remember that H1 is added automatically by WordPress.

So…How About Them WordPress Headings?

Eventually, appropriate use of headings should come naturally to you as a web content creator. You’ll find your voice, get your flow, and learn how to break down the content you’re writing into chunks. I won’t lie–it can be pretty tough to get the hang of.

But when you do, your articles will shine, both for your readers and for the machines that scan over them.

TLDR: No H1 because it’s already there, bunches of H2, some H3 to get yourself out of tight spots, and H4-H6 when you need to pretty something up.

What are some tips you’ve picked up that you can share for using WordPress headings across your site?

Article featured image by Visual Generation / shutterstock.com

The post The Ultimate Guide to Using WordPress Headings Throughout Your Website appeared first on Elegant Themes Blog.