Header tags like <h1> are important HTML structural items. They define the semantic layout of a page. The highest weight header tag, <h1>, defines the main subject of a section. Search engines value header tags when examining a web page/ The correct use of <h1> can add value, but incorrect use can see a page penalised by the likes of Google. WordPress makes it easy to use the <h1> correctly.
Using <h1> Tags Badly
<h1> tags are commonly used as the logo of a website. They use CSS image replacement to wrap the logo graphic inside the tags. The <h1> is always the site name, whichever page you’re on. Other page headings are tagged with <h2>. The <h1> tag is not intended to define the name of a site, but the topic of a page or section. Sites that use this practice are only using <h1> correctly on their home page (on that page the site name is the main topic), but incorrectly on subsequent pages.
<h1> tags should define the primary topic of each page. Each page should have a single <h1> tag (except in very rare situations where a single page has two equally important and clearly seperate topics).
Ways To Correctly Use <h1> Tags
WordPress
This site is powered with WordPress. On the front page the title of the site is the <h1>. On sub-pages it’s the page topic that’s the <h1>. WordPress makes it easy to achieve this automatically.
My template’s header.php has the following code:
<h1><?php bloginfo ( ‘name’ ) ?> | <?php bloginfo ( ‘description’ ) ?></h1>
<?php } elseif ( has_excerpt() ) { ?>
<h1>Blog Index | <?php bloginfo (‘name’ ) ?></h1>
<?php } else { ?>
<p><?php bloginfo ( ‘name’ ) ?> | <?php bloginfo ( ‘description’ ) ?></p>
<?php } ?>
WordPress automatically identifies if someone is on the frontpage of my site. If they are, it wraps the blog name and description in an <h1> tag. If not, that information is wrapped in a <p> tag. <h1> and <p> tags in the “blog-title” div are styled to look identical using CSS.
I also need to define the “post” title as an <h1> in my index.php, page.php and other template files. I use a custom template for my home page. If I was using the blog index as my home page then I’d set blog entry titles to be <h2> in the index.php and <h1> in other template files.
I can ensure that the <h1> tag accurately describes the subject of a particular page in my template. I don’t devalue the search engine benefits of the <h1> tag’s weight by always using it to define the logo
15 Comments
Hi – Thanks for the explanation. Do you offer this tweak as a service? I’m still not sure I can do it correctly.
Hi Laura. Sure, no problem. Just drop me a note at info@fogofeternity.com with some details and we can discuss it in more depth. It’s a pretty quick process, so even if you’re struggling to implement it the first time any service will see me heavily comment the code so that it’ll be as easy as possible for you to repeat in future.
Great post!
I just set up wordpress, started blogging and this was the first thing I wanted to change when I saw the markup of my single post page : )
I’m glad that you’ve shown an elegant way to fix the H1 problem.
Thanks.
Thank you for explaining this. I’ve always been wondering how exactly header tags are used. Thought it was good SEO to add h1 to subpages as well… Good I didn’t do that before researching :)
Thanks
Thank God I found your site… I’ve been trying to fix my header for hours now. Finally got the h1 header down correctly after reading your post. Thank you.
Thank s a lot Robin! This week I will make this trick to my website too…if it will be complicated I will definitely ask you some questions.
BR,
Sarah from how to get rid of toenail fungus
Really thanks!I search for many tutorial but this is awesome :)!Will use for my site!
Hi, thanks for posting this up. I was just doing some on-page seo to my site and realised I did not have keyword in the header tag. I better add that now.
Thanks
Thanks for the nice and easy to understand write up on H1 tags. I will go through by blog posts and pages to make sure the H1 tag is noted properly. Thx, Ken
big thanks mate well explained!
i used to be simply searching alongside and also discovered your website. just wantd to express great website and also this post really reduced the problem.
Thanks Robin. Your tricks helped my website to improve. You are genius. Glen from stop stuttering
Thanks for making me understood about H1 tags clearly :) now my confusion is gone !!!
Thanks for sharing this article. It’s an intense picture of a guy getting hit in the head with a ball but I’m not really sure what it has to do with H1 headers lol
Thanks, you just saved me a bunch of time. My default titles are coded which is of no help. I am going to modify my template and see how it works!