H2 tag - proper usage?

[riospace]

I just added an h2 tag to all of my pages under the h1 tag in my pages where there is "page nav, location" text. Example:

<h2>&nbsp; <a href="/">Home</a> &gt; <a href="example.com">W-Z</a> &gt; Jane Doe Photos</h2>

Is this a proper use of the h2 tag?

[lucy24]

What you should have-- in general, on the whole, all things being equal, on average, et cetera-- is a pyramid structure. One <h1>. Two or more <h2>s. Two or more <h3>s for each <h2>. Two or more <h4>s for each <h3>. And so on outward.

Think of them like chapter and section headings in a book. The first chapter <h2> starts right after the title <h1>. The first section <h3> of each chapter may start right after the <h2> chapter head. But if you're using <h{something}> as a subheader to <h{next-higher-level}> that's not really what they are for. Either make a fancy <p> or something like a <span class = "subhead">.

Do as I say. Not as I do. I think of each directory as a package, so the directories have <h1> and all the inner pages start at <h2>. Uhm. Ahem.

[tedster]

Lucy is correct. Unfortunately the answer for your question is no, that is not a proper use of an H2 tag. It's more likely to get the entire H-tag structure of the page ignored by the algorithm than to pass on a clear relevance signal.

If you've got MS Word you can see how they embed styles for H tags in the style menu for use in the document. That can give you a clear idea of the academically proper use of H tags. And then when you generate a Table of Contents in MS Word, the software gives you a choice of how deep into the H tags you want the Table of Contents to display.

[RegDCP]

The h1 should be the primary keyword phrase and visually be situated at the beginning of the page in the header.

h2 tags should be descriptors of the h1.
h3 tags should relate to their parent h2 tag.

I do not think the amount of h2 - h3 - etc tags matters but the semantic hierarchy must be maintained.

In the visual presentation, the text inclosed in the h1 tag should be the biggest on the page, with the h2 following as 2nd largest.
h3 and regular text bold are the same size.

[BeeDeeDubbleU]

h3 and regular text bold are the same size.

Where did you learn this?

[Zivush]

Here's an example of heading hierarchy of web pages (Headings in descending order of importance)-
[h1]
Opening sentence. <line break>
introduction
[h2]
Opening sentence. <line break>
paragraphs
[h3]
Opening sentence. <line break>
paragraphs
[h3]
Opening sentence. <line break>
paragraphs
[h2]
Opening sentence. <line break>
paragraphs
[h3]
Opening sentence. <line break>
paragraphs
[h3]
Opening sentence. <line break>
paragraphs
[h2-summary]
Opening sentence. <line break>
paragraphs.

* The reason to start with introduction is to have a briefer for the reader + create a space between keywords in H1 and H2.
* Line breaks are pointers and make it easy for the reader to follow the subject.

Using the above hierarchy not only improves your search engine optimization, but also adds to the accessibility of the page by the readers.

[lucy24]

Where did you learn this?

Have you ever looked at a plain html page with no css but all layers of headers? There are demos floating around. It's actually pretty mind-boggling. Not sure if it's really h3; might be h4 that's 100% font size. All headings are bold and left-justified. h5 and h6 are definitely smaller than regular text. (This does not make sense to me either.)

fwiw, in my boilerplate, h5 is 100% and the others are bigger. h6 is obviously very rare-- I might have it in something like ALL CAPS but then smaller than regular caps so it still "reads" as a header. Er, heading. I have trouble with these words. Rarely are any of my h's either bold or left-aligned, let alone both, unless the page has a wonky semantic structure.

Edit:
I ran off and did a quick experiment. Browsers are surprisingly consistent-- even MSIE, which has to be at least ten years old-- except that some of them make h6 very small and some make it tiny. Well, maybe I've set a 9-point minimum in some browsers but not all.

<h4> is pretty close to standard bold size. Maybe a hair smaller-- hard to tell, because Palatino bold runs small anyway.

Incidentally, lynx shows <h1> in a distinctive way: Centered, with a different background color. The other five are left-aligned but marked by increasing indents, so <h2> is slap against the edge of the page, <h3> starts only a little outside the edge of the print area, and the others are progressively further in. Say two ems each time.

[Robert Charlton]

Here's an oldy but good discussion about the use of headings that I thought was kind of fun, as it got beyond the mechanical issues into what was behind them...

New Paragraph after new Heading?
http://www.webmasterworld.com/content_management/3994172.htm [webmasterworld.com]

My feeling is that you need some paragraph content following after each heading and relating to it. Otherwise, the heading isn't "heading" anything.

Incidentally, some CMSs, or designers on their own, have really weird ideas, IMO, about what deserves h1, h2, etc. I've had screaming battles with designers who insisted that the first text on the page, whatever it is, should be an h1, which is total nonsense.

Some CMS systems automatically make the site name an H1, a setup that makes a meaningful heading hierarchy hard to create. Chances are that headings have been so misused that they're generally ignored.

We are moving into a time of proper markup getting increase respect once again, so possibly a page that uses headings well will gain from that. Properly used headings are a good way to organize a page in any event, and I like using them.

Regarding size, I think some of the prescriptions I'm seeing above are really overly picky. I don't think heading size after CSS was regarded that specifically by the engines, though browsers may render text in the sizes mentioned.

Lucy's description of headings without CSS is a helpful way to regard the basic point of it all, though... that before CSS, you could consider html visual presentation to be a metaphor for heading number, order, and importance.

CSS did free up headings from the ugly old giant H1 font formatting (remember those pages in Times New Roman?). I've always felt that a heading should visually look like a heading... ie, be bold or distinctive in some way, perhaps at least a degree larger than paragraph text... but how much was up to the designer, and the exact size didn't matter that much.

[phranque]

All headings are bold and left-justified.

the left justification is the result of default styles for block elements, such as headers.


W3C's semantic data extractor may help you decide if a specific header is being used properly.
Semantic data extractor - QA @ W3C:
http://www.w3.org/2003/12/semantic-extractor.html [w3.org]

[RegDCP]

I was incorrect.
It is a h4 that is the same size as standard bold. (Assuming a 12pt font size.)
[seo-mentoring.ca...]

The h tags are markup that Google uses to determine the importance of text.
I would think that the relative text sizes must be kept in proportion with h1 being the largest, h2 the next largest and so on.

[gouri]

I have read that what is looked at by the search engines is the tags (e.g. h1, h2) that a phrase is in.

If you have keywords in an h2 tag, for example, and it is similar in size to your body text, the fact that the words are in an h2 tag will give them more importance. The text in the h2 tag doesn't have to be a lot bigger than the surrounding body text to give it additional importance.

[lucy24]

fwiw, again, Bing always complains about pages that don't have an <h1>. But it doesn't stop them from indexing the page.

I've never known if g###s fragment identifiers in searches have to be associated with a heading, or if they'll grab them anywhere. The most recent one I saw-- they're rare-- was attached to an h4. On a page that, er, uhm, ahem, doesn't have an <h1>.

[RegDCP]

If you have keywords in an h2 tag, for example, and it is similar in size to your body text, the fact that the words are in an h2 tag will give them more importance. The text in the h2 tag doesn't have to be a lot bigger than the surrounding body text to give it additional importance.

Not a lot bigger, but it HAS to be bigger.

IMO, Google judges relevance by what is presented to the readers.
EG. the visual presentation.

I have seen where h2 tags have been used to encompass the first keyword rich sentence in a paragraph while the visual copy did not show the emphasis.

If the words are not emphasized in the copy that the humans read, then why should the algo be told that they are more important?

Wouldn't that fall into a kind of cloaking where you are showing people one thing and showing the search engine another?

[ergophobe]

The first chapter <h2> starts right after the title <h1>.

you need some paragraph content following after each heading

Uh oh... Robert Charlton and I have gone round and round on this debate. I think of it like a book author and editor (which I have been for most of my life). Sometimes a section begins right after the main heading and the section has a title. Sometimes there's intro text before the first sub-section.

I would say it's situational, but it must have an internal logic that makes sense.

[seoskunk]

Can I just add that the semantic structure of a document is also dependent on the doctype. Sure in XHTML I would agree completely with Lucy on proposed structure but in HTML5 each part of the page ,ie, header, nav , content, aside and footer, can have its own H1-H6 and that would also be correct

[tedster]

Not a lot bigger, but it HAS to be bigger.

I'd say the H2 has to be more prominent in some way - but it can be the same size. I've been involved with an online magazine for about ten years. The H2 elements in the current template are the same size as the body text, but bold and a gentle blue color. That's a stylistic choice that complements the look and feel of the page. But the H2 elements ARE subheads in the article. It's that logic that matters most, IMO.

In fact, I've seen H2 tags used as a "run-on head", where even the line break at the end is eliminated via CSS. That still can be legitimate.

It really helps to understand a bit of the history of HTML. It starts with GML (Generalized Mark-up Language) which was developed by IBM in the 1960s - and GML already contained H tags! So H tags have both an academic and a functional purpose that is deeply embedded in electronic documents long before Sergay and Larry were born.

Used properly H tags can contain useful relevance signals. Abused (as they often have been online) they add no value to a document and search engines don't trust them. I remember back in 2002 hearing from a Google search engineer that they couldn't even trust H1 tags as much as they trusted body copy!

[Simsi]

I try to follow the "proper" way of doing things but surely if this has any impact on ranking these days it has to be very minimal and getting more minimal with every passing update? I know it's commonly accepted that the H1 is an important tag but beyond that, does it really matter any more? I have my doubts.

[phranque]

I've never known if g###s fragment identifiers in searches have to be associated with a heading, or if they'll grab them anywhere.

in most cases where i've noticed this the fragment identifier was referred to in some well structured navigation on the page - for example a menu item or breadcrumbs usually in a list element.

[RegDCP]

Can I just add that the semantic structure of a document is also dependent on the doctype. Sure in XHTML I would agree completely with Lucy on proposed structure but in HTML5 each part of the page ,ie, header, nav , content, aside and footer, can have its own H1-H6 and that would also be correct

Ya but this is a mark up nightmare, eh?
Since Google judges importance of copy based on text size, (And they tell us they do), having multiple h1 headings on one page would be a horror to auto semanticize.

[RegDCP]

I know it's commonly accepted that the H1 is an important tag but beyond that, does it really matter any more? I have my doubts.

Given the shift in importance to onpage relevance presentation, I would think it matters more than ever.

[lucy24]

.. and that's not even getting into headers-for-formatting. It took me ages to accept that if something is semantically an h3 but I want it to be unobtrusive, the solution is not to call it h4. It's to set a style for h3 on that page.

We will not talk about the title pages of my early e-books. Shudder.

having multiple h1 headings on one page would be a horror to auto semanticize

Last time I looked, the search engines were still complaining if a page had either more or less than exactly one <h1>.

[martinibuster]

The h1 should be the primary keyword phrase...

Yes and no. The issue of keywords had been updated. More and more Google is dealing with concepts in order to bring up a wider variety of candidates for the top ten in order to select the best answer for a query. It's not always necessary for keywords to be hammered on the page.

The header tags should be thought of as a way to provide an outline of what the entire web page is about. The analogy of a pyramid is quite appropriate. A reading of The Elements of Style [bartleby.com] by Strunk and White is recommended to obtain an understanding of the concept of ordering thoughts on a page to form a coherent document.

The W3C has a tool [validator.w3.org] that displays the "outline" of a web page. Basically it grabs your headers and creates an outline of it. A poorly created web page will be diffuse while a well thought out web page will create a scannable outline of what the page is about. This is the O part of SEO, optimization, that gets forgotten, which means making it easy for the search engines to understand what the web page is about.

[RegDCP]

Again, even using the pyramid analogy, the h1 is the top of the pyramid and this is defined by the largest text on the page.


If you read the original paper, [infolab.stanford.edu ]Anatomy of a Large-Scale Hypertextual Web Search Engine"

2.3 Other Features
Aside from PageRank and the use of anchor text, Google has several other features. First, it has location information for all hits and so it makes extensive use of proximity in search. Second, Google keeps track of some visual presentation details such as font size of words. Words in a larger or bolder font are weighted higher than other words.

[martinibuster]

That paper was from a long time ago, when Brin and Page were still in school. While it describes the foundation of PageRank and reading that document is essential to beginning to understand SEO, Google has also come a long way since then. Bill Slawski's blog [seobythesea.com] is the best source of Google patent information that details just how far Google has come.

As far as the part you quoted, that's a reference to font size, not specifically heading tags. I am quite familiar with that passage. Back in 2003 I wrote about that specific passage you quoted in a post on WebmasterWorld about Big Font SEO [webmasterworld.com].

That passage does not specifically address heading tags and much less it does not specifically address the current state of how H1's are handled. How could it?

Here is some reading on Bill Slawski's SEOBYTHESEA blog that begins to touch on the complexity of heading tags, how they're not just a ranking signal on a list of signals that has to be ticked off to rank well (title tag, h1, bold, italics, etc.). This article is a good one to start with: [seobythesea.com]

Semantic Relationships
When you use a heading element, whether <h1>, or <h2>, or so on down the line, you aren’t just impacting the look and feel of the text within that element, but you are also defining a semantic relationship between those words and the words that follow them.

...When you use a top level heading, or an <h1>, you’re setting up a semantic relationship between that heading and the remainder of the content on a page, describing what it is about.

Weight of Headings Defined by How Well They Describe a Semantic Relationship?
Heading elements can help a search engine understand the semantics of words on a page a little better. Search engines can go out on the Web and index pages and explore the relationships between terms within headings, and the content they describe within that index. They can look for similar relationships on all the documents within their body of web pages that use the same terms within headings, and see if there might tend to be some kind of co-occurrence of words and phrases and concepts within those matches of headings and content using those headings.

Bill Slawski also describes a patent issued to Microsoft [seobythesea.com] that mentions the use of heading tags as a way of identifying blocks of content for the purpose of:

•Classifying Pages
•Clustering the pages with other similar pages
•Extracting Topics from those pages
•Breaking Pages apart for display on handheld devices
•Highlighting Blocks that might be of interest to searchers
•Fragment-based caching
•Summarizing content, and
•Ranking pages

So you see, the put the main keyword phrase in the H1 element isn't the only way to look at it. The way search engines are looking at the web page, particularly in terms of concepts, has evolved.

[edited by: martinibuster at 6:14 am (utc) on Sep 18, 2012]

[lucy24]

Size is not the only way to show emphasis. That's why I detoured to Lynx while checking html-without-css handling of headers. <h1> is definitely in a class to itself, but all the others are still distinguished from each other and from regular text, even though they are the same size, color, weight and so on.

You could set
{font-size: 100%; font-weight: normal; font-style: normal; font-variant: normal; color: inherit; background-color: inherit; text-align: left; display: run-in;}
et cetera and it would still be a header semantically.

[menntarra 34]

I have my doubts about the H tags too. My best performing site has never ever used H tags, and i'm still the first for several important keywords which matter for me. I also checked the best and most competitive sites in my niche and till now, i haven't found ANY which uses H tags...

Another topic: Can't we calculate the proper usage of H tags based on Google's search result pages themselves? Check their source codes how they use them.

[menntarra 34]

I think if it is obious what a page is about, then the importance of the H tags become less and less. Of course if the page is a "mess" (By mess i don't mean if it is not properly done, for eg.: there is a ton of information) , then the H tags are a good indicator. But as i said i think it is not that important, at least not in my site's case.

[tedster]

if it it is obvious what a page is about, then the importance of the H tags become less and less.

This lines up with my experience in recent times, too. Rather than a formula that just adds various factors up, the algo seems more to look for relevance signals and then their reinforcements.

The way I think of it, the "seed" relevance signal could be one of many different things, on-site or off-site. Once the algorithm identifies that seed, it sort of learns how much the decision can be trusted by examining other areas for reinforcing or undermining signals.

[lucy24]

Can't we calculate the proper usage of H tags based on Google's search result pages themselves? Check their source codes how they use them.

Haha, I once looked at the source code of a SERP for some other reason-- can't remember what, and I really doubt it's relevant. What I do remember is, well, let's just say that "Do as we say, not as we do" about covers it :)

[menntarra 34]

@lucy24

Yeah i checked the H-tag usage by google and the least i can say is "it is strange" :)