Is it possible to use several h1 tags on one page, but their style is different?

Question

I have a webpage in which I use h1 tags several times in different DIVs, and the h1 style for each div is the corresponding size.

For example...

#content h1 { font-size:22px; } #left-nav h1 { font-size:14px; } #content .recent-news h1 { font-size:16px; } 

It's good? I am worried about SEO.

What is the best way to do this? Or am I not worried about anything?

Answer 1

In my opinion, you do not need to worry, its normal to do it like this.

H1 denotes part of your content as a first level headline. Therefore, if you have a first-level title in your navigation div (for example, <H1>Navigation Menu</H1> ), of course, this should be #nav h1 .

If you must have several H1s in your content, it depends: if you have a blog and each post has its own headline, it will be H1. However, if your blog has a title (for example, <H1>My Blog!</H1> ), the title of the blog entry should be H2.

But this is only a theory. Go for what is being read, semantic markup. You can solve this by looking at your html and asking yourself: “Is it readable? Will readability improve if I do it differently? The answer will differ from project to project.

Answer 2

Google's Matt Cutts responded to More than one H1 per page: good or bad? (March 5, 2009) using:

Well, if there is a logical reason to have several partitions, it is not so bad to have, you know several h1 s. I would like to pay attention to overdoing it. If your whole page is h1 , it looks pretty creti, right? So don’t do all h1 and then CSS so that it looks like regular text, because we see people who competitors complain that if users ever turn off CSS or CSS doesn't load, it looks really bad. So, you know, it's okay to have a little h1 here and then maybe there are two sections on the page, and maybe a little h1 here.

But you really should use it for headings or headings, which is this intention. Don't just drop h1 wherever you can on the page. Because I can tell you, if you just throw h1 everywhere on the page, people tried to abuse it, and therefore our algorithms try to take it into account, so it really is not very good for you. Therefore, I would use it where it makes sense and more economically, but you can use it several times.

Answer 3

Just remember that your h1s are used to indicate context, not layout. Thus, there is nothing inherently wrong with having multiple per page.

In this specific example, you need to decide if your left h1s navigator has the same contextual meaning as your h1s content and your latest h1s news. If there is a clear hierarchy in your mind, use its heading tags to demonstrate this.

Answer 4

In general, you should have only one h1 per page, and h1 should broadly represent the content on this page. While you're ready to style with CSS, find out what level of headers (h2, h3, h4, etc.) correctly displays the headers you want to use, and then erase them.

Answer 5

Semantically, I prefer to use one h1 per page, mainly for the page title. This is probably not too important for SEO, and with the way html goes with HTML5, a common header tag will make it a lot easier, and this argument is deprecated.

Answer 6

I do not like the idea of ​​several H1 s. H1 is the top level, the most important heading and page will mainly relate to this topic. If you have an equally important second topic, do not put it in another H1 tag, just put it on another page. He deserves it, right?

Answer 7

Trying to answer the same question, I posted this question, which may contain some useful information. My concern about using the same H1, H2, H3 in different places is that if you ALWAYS do not specify the "parent" style, as in your example *, then you may run into problems.

The dilemma in the decision to create CSS for H1, H2, H3, etc.

* that is, you never define 'h1' yourself

Answer 8

I try to have only one H1 per page and almost completely redo it from the contents of the title / H1 tag - the main idea of ​​a separate page, each thing should be an h2 tag and below ....

Answer 9

If it concerns seo, it is better to use h1 tags. And if you want to use it only for sytling purpose, use CSS style sheets.

Most importantly, if: If a webpage uses more than one h1 tag, then Google may consider this page to be spam. use header tags other than h1, for example h2 h3 h4 h5 h6, any number of times.

Answer 10

It all depends on what your doctype . With html5 you can use multiple h1 tags for each section. (don’t read, for <section></section> !) When using the XHTML 1.0 Transitional doctype in the XHTML 1.0 Transitional doctype I would avoid using multiple h1 tags on the same page.

When using the XHTML 1.0 Transitional doctype in the XHTML 1.0 Transitional doctype I often went something like this:

• h1: max. once per page
• h2: max. twice per page
• and etc.

Also, @joel, although your answer seems to be OK, please do not try to confuse anyone ... I can say that I am a Google software engineer because I just work with Google (not a company, but a product) AND I'm an engineer ... Please list your company name and any certificates when approving such things.

Answer 11

I believe its good SEO practice places an H1 tag at the top of every block element on my page, but that's just me. Of course, this H1 tag should contain information related to the keywords / topics that you are targeting.

This is a very effective SEO method that I have found, so people telling you not to do this try not to let you join our winnings.