h1-h6 tag

[paul]

Which tag get more weightage from h1-h6? My one of friend suggested not to use more than one h1 tag coz google will give the website hosting less priority, is that true?

[alan]

Hi Paul,

There are six levels of headings in HTML like H1 to H6 where H1 as the most important and H6 as the least. Visual browsers usually render more important headings in larger fonts than less important ones.

[Ryan]

H1 tags are the ones with highest priority so it's best to have your most important keywords which represent your page content in the H1 tag. It's usually the best to use one h1 tag per page and an h2 tag should be utilized if you want to emphasize a subtopic. However, if it is two different subjects, you should consider splitting into two different pages to use h1 tags for both.

[DPS Computing]

I only use one H1 tag on a page as its original intention was for the top page title. I have heard that search engines might start penalising over use of the H1 tag as lots of writing in H1 tags takes forever to scroll and makes the page very hard to read!

[daledavies]

Yeah I would agree that H1 is the main page heading, it makes sense that the lower priority H tags can be used more often. The document should make sense before any style information is added, if you are just using H tags for Search Engine Optimization after the page had been designed then you are using them incorrectly, this may lead to being penalised. Although Im not 100% sure how Google see it.

[DPS Computing]

I agree. H2 should then be used for all headings below the main heading of the same priority and subheadings with the subheading should have H3 used and so on.

[daledavies]

Yup, all hierarchical like.

[DPS Computing]

Originally Posted by daledavies

Yup, all hierarchical like.

Precisely. That was the intention of providing H1 to 6 in the first place to make it easy to create an understandable and standard hierarchical system .

[paul]

Well, thanks for your replies, no doubt h1 should have highest priority but I don't think it will harm if I use h2 as well as subheading as few people suggested there, I referred this w3 guideline and found they have shown both h1 & h2 decorated with style information; w3.org/TR/html401/struct/global.html#h-7.5.5

[daledavies]

Also dont forget about image replacement, you can use css to replace the text within the h1 tag with your header image or logo for example...

PHP Code:

<style type="text/css">
h1 {
   padding: 115px 0px 0px 0px;
    margin:0 0 0 0;
    overflow: hidden;
    background-image: url("../images/mastheads/masthead.jpg");
    background-repeat: no-repeat;
    height: 0px !important;
    height /**/:115px;
}
</style>

<div id="masthead"><h1>The Main Page Title</h1></div> 


[paul]

Thanks for help, I was missing that point.

[esnail]

Originally Posted by daledavies

Also dont forget about image replacement, you can use css to replace the text within the h1 tag with your header image or logo for example...

PHP Code:

<style type="text/css">
h1 {
   padding: 115px 0px 0px 0px;
    margin:0 0 0 0;
    overflow: hidden;
    background-image: url("../images/mastheads/masthead.jpg");
    background-repeat: no-repeat;
    height: 0px !important;
    height /**/:115px;
}
</style>

<div id="masthead"><h1>The Main Page Title</h1></div> 


You can make this mark-up leaner by removing the div. H-tags are block-level elements so don't need a div wrapper.

[daledavies]

Originally Posted by esnail

You can make this mark-up leaner by removing the div. H-tags are block-level elements so don't need a div wrapper.

Spot the deliberate mistake!

[DPS Computing]

Originally Posted by daledavies

Spot the deliberate mistake!

It could have been worse - at least the code was functional .

[daledavies]

True. By the way, change the padding and height properties to reflect the height of your image.

[paul]

So the bottomline is these tags has a purpose and it should be used keeping visitors in mind and not just search engine.

[daledavies]

Yeah, it seems all to easy to be more concerned with getting high rankings. Design the website hosting with accessibility in mind using H tags (and others) for the purpose of aiding accessibility. Which is I suppose what they were designed for in the first place!

I think some companies however get obsessed with top position on SERPs and forget that things like accessible content and good design can help make conversions. After all, so you got at the top of the SERPs but your website hosting is crap and inaccessible, I wont buy your product.

Not that your shouldnt take SE's into consideration when designing, I guess its finding the correct balance.

[Ryan]

The SEs do give some credit for use of Hx elements, so yes you can boost your on-page relevance by properly using a set of Hx elements.