SEO Tycoon

**Learning Newbie** · 12-18-2007, 06:10 PM

http://xhtml.com/en/future/x-html-5-versus-xhtml-2/

I'm not sure I agree with all of this (except h2 is hard to set in a WYSIWYG), but it sounds like this means people will stop declaring what's more and less important in their pages? For honest webmasters that probably hurts, but I bet in the aggregate it could wind up being useful?

Quote:

A New Headings Construct

Content headings are the most important constructs when it comes to making Web pages accessible. Yet virtually no one uses headings correctly, because numbered headings constructs (h1 to h6 elements) are difficult to visualize for most people, and are almost impossible to author correctly using WYSIWYG editors. Physically, numbered headings are linear constructs (sibling elements) that are used to logically organize data into a hierarchy. So, in the following example, you have to make an effort to visualize the hierarchical structure of the content.

1. <h1>...</h1>
2. <p>...</p>
3. <h2>...</h2>
4. <p>...</p>
5. <h2>...</h2>
6. <p>...</p>
7. <h3>...</h3>
8. <p>...</p>
9. <h4>...</h4>
10. <p>...</p>
11. <h3>...</h3>
12. <p>...</p>
13. <h2>...</h2>
14. <p>...</p>

By contrast, the new heading construct, using the h element along with the grouping element section, makes the hierarchical relationship infinitely easier to grasp:

1. <h>...</h>
2. <p>...</p>
3. <section>
4. <h>...</h>
5. <p>...</p>
6. <h>...</h>
7. <p>...</p>
8. <section>
9. <h>...</h>
10. <p>...</p>
11. <section>
12. <h>...</h>
13. <p>...</p>
14. </section>
15. <h>...</h>
16. <p>...</p>
17. </section>
18. <h>...</h>
19. <p>...</p>
20. </section>

The h element is very cool!

For the record this is only the tinyest snipped out of the document, it's a comparison of new web languages, and this is the second on headings. It's usually kind of spammy to just post a bunch of copy and paste, but since we have a few experts in here, I want to know their thoughts on how this will change things in the future of SEO?

**CSS4Life** · 12-18-2007, 07:04 PM

I was trying to explain semantic meaning to my college tutor (you heard right) with HTML and when using <strong> and <em> is preferable to using <i> and <b>. I tried to explain that non-human visitors to the site would understand these better and that these add semantic meaning to a document, as opposed to <i> and <b> which simply format something - <i> and <b> have also been deprecated from XHTML I believe.

I've got to say losing the heading tags is going to be a shame - they are very useful and add a LOT of structure if used correctly. I'll acknowledge they've been abused by SEO spammers a lot, but I still feel they were on the whole beneficial.

Au revoir h1, h2, h3, h4, h5 and h6...gonna miss you!

**ADAM Web Design** · 12-18-2007, 07:52 PM

This is the first I've read of this, but on the surface...good God almighty, what a stupid idea. All this is going to do, and I want to be held accountable for this statement, is to serve to make SEO and web design an even bigger mess when it pertains to architecture than it already is.

Why?

1) The introduction of a tag (section) that is patently unnecessary. Now we need two tags (or more) for subheads where one would suffice.

2) The lack of use of said tag will create environments where ignorant webmasters (who as we know, make up the vast majority) will happily type out <h>, <p>, <h>, <p>, thus creating top-level headings for every section of a page...which is exactly what the whole thing seems to be designed to prevent in the first place.

This is not going to end in a good place, assuming it ends up being approved. The same thing goes with the whole hyperlink thing. What happens to people who use <strong href="http://www.domain.com">Some Text</strong> and forget to add text-decoration: underline?

I seriously hope that this gets revised or never sees the light of day.

**Learning Newbie** · 12-18-2007, 08:04 PM

Quote:

Originally Posted by whym

when using <strong> and <em> is preferable to using <i> and <b>.

I never understood this.

I'm a screen reader program for blind folks. Won't I just use a different voice for strong=bold and em=italic? In fact, isn't it safe to assume if I'm whatever I am with a special purpose other than being a web browser but having to do with html, that if bold and italic don't make sense to me, i can just turn <i> tags into <em> tags? I'm saying that only for the narrow cases where strong makes more sense than bold - in those cases can't the software just do a search and replace before it tries to read the file?

I'm probably missing something, but I never understood that, so maybe someone can explain it?

Quote:

This is not going to end in a good place, assuming it ends up being approved. The same thing goes with the whole hyperlink thing. What happens to people who use <strong href="http://www.domain.com">Some Text</strong> and forget to add text-decoration: underline?

My guess? For the first 2 or 3 years, hidden link detection goes back to square one? That's probably more alarmist than things really are. You can already style links to look just like regular text. Only now it's the default.

The document I linked to (and found in a question over in our very own HTML Forum) said this is cool, and it's very uncool to keep the <a> tag at all since everything's got a href now. Am I stupid, or is that just not very well thought out? I mean so now your blockquote itself is a link. How do you make it one color if you haven't clicked it yet and another if you already have?

How much you want to bet some ebook will come out saying the best kind of backlinks now are like this

<h1 href="http://www.mysuperhappylink.com">this text is relevant because I said so</h1>

And having links from just regular things like spans will hurt you?

**coolkbk585** · 12-18-2007, 08:23 PM

Well, at least something seems to be moving forward in the new versions of HTML & XHTML markup.

I see the logic in this. Why have a different tag for each style of heading? This can easily be achieved with one CSS declaration. Just set a class to it and there you go. I think that this will make it easier for Google to crawl pages as well.

Also, in different browsers, different heading tags show up differently. I hated having to set different sizes for IE and Firefox and all of the other browsers...

I happily say goodbye to h1-h6 tags

**vangogh** · 12-18-2007, 08:37 PM

Kyle I'm sure this is going to be easier. Granted this is the first I've seen this, but now if you want to style two headings differently you have to add

class="heading-1"
class="heading-2"

which doesn't strike me as any better than just styling

h1
h2

Is it really that hard to understand the different heading levels? It always seemed pretty intuitive to me.

Adam I agree with you the <section> tag seems completely unnecessary. Unless the idea is to nest sections like

HTML Code:

<section>
 <h></h>
 <p></p>
 
 <section>
  <h></h>
  <p></p>
 </section>
  
 <section>
  <h></h>
  <p></p>
 </section>

</section>

If that's the idea then I can see how the headings automatically get dropped a level. But I still don't see that as an improvement.

I don't think this will be any big deal as far as seo goes. Tags will change, search engines will adapt, and so will webmasters. It'll be the same old game with slightly different rules.

**frost** · 12-18-2007, 11:04 PM

From the semantic point of view, the <section> tag is a great improvement, in my humble opinion. At the moment, a tag <h2> doesn't really hold any meaning to a computer other than it is a 2nd level header line. It's a heading, but what section of the document does it correspond to? The computer can make an educated guess and say that the heading belongs to the section immediately following the heading. It could presume that the section starts with the heading and ends before the next heading which is greater than or equal to its heading, or ends if the parent element's closing tag is reached. This presumption could lead to, say, 70% accuracy. However, in situations like the following example, how could the computer possibly know which section the marked line falls under?

HTML Code:

<div>
  <h2></h2>
  <p></p>
  <p></p>
  <h3></h3>
  <p></p>
  <p></p><!-- Does this fall under the first h2 heading, or the h3 heading? -->
  <h2></h2>
  <p></p>
</div>

However the computer decides which section to place that line, there are two main problems with the method: 1) The method is not nearly as accurate as it could be, and 2) it's not able to exploit the advantages of XML, even though the document is valid XHTML.

From the web design point of view, it's an slight annoyance, and a few extra bytes, but no functionality is being gained or lost. I don't see designers having to use class="heading-1", because by the time this idea is widely implemented (if it happens), CSS selectors will also be widely implemented, so something like the following example could be used.

Code:

section > section > section > h{ /* corresponds to h3 */ }

And finally, from the SEO point of view, I agree with vangogh. Search engines will adapt to the new rules, and webmasters will adapt new abusing techniques.

**ADAM Web Design** · 12-19-2007, 02:55 AM

Quote:

From the semantic point of view, the <section> tag is a great improvement, in my humble opinion. At the moment, a tag <h2> doesn't really hold any meaning to a computer other than it is a 2nd level header line. It's a heading, but what section of the document does it correspond to?

The section underneath the subhead. This is a straightforward concept. The only thing that this whole <section> thing does is to create two tags where one would suffice.

Quote:

And finally, from the SEO point of view, I agree with vangogh. Search engines will adapt to the new rules, and webmasters will adapt new abusing techniques.

And other webmasters who don't fully understand the rules will create documents with no subsections, use the h tag, and therefore have level one headers for every header in their document.

Not only that, no one has considered how brutal the default CSS would be for a level 3 or beyond header (assuming no styles):

Code:

section section h {
     insert CSS here;
}
section section section h {
    insert some more CSS here.
}

Explain to me how having to manually count 3, 4, 5, 6 "section h" phrases is "readable". Yes, you could define a class, but as Steven said, the whole point is that you shouldn't have to just to make the thing more readable.

And what happens if someone doesn't indent their code (a fairly commonplace occurrence)? And imagine if you have to debug the thing and figure out what's what.

Dog's freakin' breakfast, man.

By the way, frost, in your example the text would technically fall under both headers, since the h3 denotes a subsection of h2...as it would with the new section thing.

Fortunately, the W3 moves incredibly slowly, and now with all the different browsers to try and make happy it'll be even slower, so I don't see this happening anytime soon.

**frost** · 12-19-2007, 04:52 AM

Quote:

Originally Posted by ADAM Web Design

By the way, frost, in your example the text would technically fall under both headers, since the h3 denotes a subsection of h2...as it would with the new section thing.

How do you know that? I actually had in mind that the example text would fall only under the h2 section. The h3 section actually ended just before that text, but you couldn't tell because I didn't use section tags.

And in case you were wondering, I consider that a perfectly valid example, albeit uncommon.

The whole h1...h6 thing is completely non-semantic. There is no hierarchy involved. Instead of placing a subheading in a deeper level, all headings, subheadings, and sub-subheadings are placed on the same level. This isn't how XHTML is supposed to be.

Quote:

Not only that, no one has considered how brutal the default CSS would be for a level 3 or beyond header (assuming no styles)

Quote:

Explain to me how having to manually count 3, 4, 5, 6 "section h" phrases is "readable". Yes, you could define a class, but as Steven said, the whole point is that you shouldn't have to just to make the thing more readable.

I considered it, but I passed it off as non-brutal because most people never get up to h5 or h6, plus there are CSS comments if it's hard to read, and you usually only define the styles for them one time and in a single location in the CSS.

I can see that there is little to no benefit at the moment for webmasters or users. The semantic web is all about making documents easy to read for computers, and it's what Tim Berners-Lee and the W3C has been harping on for years. Because of this, in all likelihood, we will have to deal with the section tag in a few years.

Quote:

And other webmasters who don't fully understand the rules will create documents with no subsections, use the h tag, and therefore have level one headers for every header in their document.

Ignorant programmers or webmasters is rarely a good excuse not to do anything. I'm confident that changes such as this will affect SEO very little because search engines will update their algorithms as needed. There may be a case where some users don't switch quick enough, or some switch too fast, but that's about it. I don't even really see the problem with no subheadings in a document either. Many pages are going to end up having a image for the top of the page, and the remainder of the document will contain headings all of the same level.

**full house** · 12-19-2007, 07:50 AM

for me, I still follow what I started!

**ADAM Web Design** · 12-19-2007, 03:52 PM

Quote:

Ignorant programmers or webmasters is rarely a good excuse not to do anything.

Agreed under normal circumstances. But consider that ignorant webmasters make up the majority of webmasters. Hell, you've got webmasters who will do things like <div class="h1"> and think that's a heading.

Are you willing to be one of the few webmasters who has to constantly repeat "put this in a section tag" for ignorant webmaster X, Y,and Z, over and over again? That's what will happen. Most people won't get this. And it'll be you and I having to sit there and go over it again and again and again...quite frankly, I don't want that kind of responsibility.

Quote:

How do you know that? I actually had in mind that the example text would fall only under the h2 section. The h3 section actually ended just before that text, but you couldn't tell because I didn't use section tags.

And in case you were wondering, I consider that a perfectly valid example, albeit uncommon.

Then you should have done one of two things:

1) Added another h3 tag to indicate a new section of thought.

2) Put it before the first h3 tag so that it was clear that it wasn't a part of the first h3 tag.

You may have intended something to be a certain way, but you misconveyed your message. The way I answered your question is how you would read it if it were in a textbook or a newspaper article or any form of print, and that's how you should read it if you're on the web. Don't give me the "it's the Internet" crap, either...reading is reading, and that's how a normal user would comprehend it.

Quote:

The whole h1...h6 thing is completely non-semantic. There is no hierarchy involved. Instead of placing a subheading in a deeper level, all headings, subheadings, and sub-subheadings are placed on the same level. This isn't how XHTML is supposed to be.

How is h(x) non-semantic? h1: level 1 heading. h2: level 2 heading. h3: level 3 heading. It's about as straightforward as easy to understand as a tag can get.

Quote:

I don't even really see the problem with no subheadings in a document either.

Then you haven't considered the SEO implications. Wait until Bob the lazy-assed spammer gets a hold of someone else's "properly structured" copy, strips out the section tags, ends up with a single-level document containing nothing but h and p tags, and ends up picking up the original creator's longtail SEO traffic. It wouldn't be that hard to do in this setup...one find/replace, and you're off to the races.

**Learning Newbie** · 12-19-2007, 03:55 PM

Frost's example didn't make a lick of sense until something hit me.

<html>
<head>
<title>I'm #1 in Google</title>
<meta name="PR" content="10"></meta>
</head>

<body>
<div style="line spacing: 100px">
<h1>I'm good at html</h1>
<h2>I'm semantic too</h2>
<h1>I'm a programmer</h1>
<h2>Not a dolt</h2>
<h1>You should give me all your money</h1>
</div>

<p style="top: 0; margin-top: 1 em">Yep, I'm really good at html!</p>
<p style="top: 100 px; margin-top: 1 em">It's semantic cause I said so</p>
<p style="top: 200 px; margin-top: 1em">I like C but I hate ASM</p>

So what if it's a contrived example? There are people who still think stuff at the top of a html file ranks best.

Took me a minute to realize, because I'd say some text "belongs to" the heading it lives under. But now we're talking about if heading tags are "markup" like they mean bold and fontsize=+3 or are they to infer meaning? If it's only a shortcut to the nasty evil font tag, then the crack head example I came up with might be reasonable. I had a WordPress blog theme that worked sort of like that. Only smarter, because it didn't limit every section to 100 pixels tall.

**ADAM Web Design** · 12-19-2007, 04:27 PM

John, your example just confused me...and we all know I don't confuse easily.

**Learning Newbie** · 12-19-2007, 07:25 PM

Well if my code was right - and I just typed it into this little window here so it's not actual "code" especially in the sense of it got tested or anything - but if it worked and you ran it in a browser, as a web coder, you'd see

Quote:

I'm good at html
Yep, I'm really good at html.

And you'd expect the code to logically be like

<h1>I'm good at html</h1>
<p>Yep that's right</p>

Or something like that. Heading, paragraph, paragraph, paragraph, another heading, some more paragraphs, and yada yada yada like they say in German. You said it yourself. That's how a newspaper works. That's how a magazine works. Books too. That's just how it's supposed to work, what we got used to over the past bunch of hundreds of years.

But it doesn't have to be coded like that to look like that. If you use absolute positioning, you can put all your heading tags (1-6) that go anywhere on the page at the top of the html, and then a stream of paragraphs underneath like a stream of consciousness. The crappy code I wrote was to show you could have a bunch of p tags in a row that some of them are related to each other and some have nothing to do with the next one.

Normally you'd just do it the right way and not be an idiot. Make a heading, put some stuff under that heading logically, and then move on to the next part of the page. And when you do that, you don't need section tags to figure out what belongs where or is part of what bigger thread. Everything after H(x) until the next H(x).

That's the only way that makes sense to me, but I think there are other ways you can structure your html to look the same, but strip out all of the meaning for anyone but a real person using the help of a browser to read the page. Of course, the only reason I can think of to bastardize the code so much is if you think putting all your h1 tags at the top of the page will make you rank better, so if that's your motivation it's not like you're gonna change your ways because XHTML 2.0 is here. Anyway, I guess I'm just playing devil's advocate to say what we have now really gives us the tools we need, but sometimes they get abused.

**vangogh** · 07:42 PM

frost I can see your point, however that's never how headings worked in my mind. I think of them just as I would a book.

An h1 might be the chapter title and then an h2 becomes the most major heading in the chapter and so on. In your example I see it the same way Adam does as the paragraph really falls under both.

Think of reading a book. You don't go into the lower level heading and then back out to the higher one. You go on to the next in the series of the lower level heading.

Your chapter might look like

HTML Code:

<h1>Book Chapter</h1>
<p>some text</p>
<p>some text</p>

<h2>Highest level heading inside chapter</h2>
<p>some text</p>
<p>some text</p>

<h3>A subsection of the highest level chapter heading</h3>
<p>some text</p>
<p>some text</p>


<h3>A subsection of the highest level chapter heading</h3>
<p>some text</p>
 <p>some text</p>
<h4>One more level down</h4>
<p>some text</p>
  <p>some text</p>


<h3>A subsection of the highest level chapter heading</h3>
<p>some text</p>
 <p>some text</p>

<h2>Next highest level heading inside chapter</h2>
<p>some text</p>
 <p>some text</p>

... and so on

<h1>Next chapter</h1>

A book or an article or any written text that requires heading levels doesn't move back up the chain of levels. It works it's way down and then starts the next chain.

I can see where the ability to come back up a level could be useful, but I don't think that's how multi-level text like books has ever been structured. It's not as though web pages will end up looking any different.

In your example the only way it makes a difference to a person reading is if you style the paragraphs differently. If the paragraphs look the same then the reader is still going to see your paragraph falling under the h3. If you do want to style the paragraph differently I'm not sure the new <section> tag would make things any easier for you overall.

I can see your point, but I'm not sure it adds anything practical.

John, you should only have one <h1> tag on a page anyway. Using more than one makes no sense

**ADAM Web Design** · 07:45 PM

Ahhh...I see where you're going with that. You're effectively creating code whereby the screen would display something other than what was intended in print.

I don't really see how XHTML 2 is going to address that, though. Consider this:

Code:

<h style="height:  20px;  overflow:  hidden;">Heading 1</h>
<section style="margin-top:  100px;">
<h>Heading 2</h>
<p style="position:  absolute;  top:  21px;  height:  98px;  overflow: hidden;">Text intended to go under heading 1.</p>
</section>

A screen reader, coder who wasn't paying full attention, and probably an SE spider would consider that paragraph as a section of text that was intended to go under Heading 2, since that's the way it's grouped. However, as you pointed out, absolute text breaks up document flow.

And what happens if someone does something like this?

Code:

<body>
<section>
<h>Heading</h>
<section>
<p>Text</p>
</section>
</section>

Or this?

Code:

<section>
<h>Heading</h>
</section>
<section>
<p>Text</p>
</section>

The additional tag introduces not only more errors, but a greater possibility that errors will occur and that the document will not be interpreted correctly across all browsers.

Like Steven said, it doesn't add anything practical. If anything, it's just going to make things much worse.

**vangogh** · 12-19-2007, 08:24 PM

It just seems like this adds a greater chance of getting things wrong than right. It's like we're going back to nesting tables to present the structure of the content.

Any stylistic change is easy enough to do as it is. Maybe the special case would get easier with the <section> tag, but it seems like the more common cases would only get more difficult and confusing.

Logically I can understand the advantages of being able to nest the sections and headings, but headings were meant to represent something that doesn't really get nested that way.

**Learning Newbie** · 12-19-2007, 08:39 PM

Quote:

Originally Posted by ADAM Web Design

Ahhh...I see where you're going with that. You're effectively creating code whereby the screen would display something other than what was intended in print.

I don't really see how XHTML 2 is going to address that, though.

I think they picked a problem and came up with a solution to it, and that's all that happened. Kinda like the adage of throwing out the baby with the bathwater - no one stopped to think about all the problems the fix causes.

When I use headings on a page, I use them the way pretty much everyone who replied to the thread said. Seems like almost everybody does. It's possible to create a situation where that doesn't work, and apparently it's still possible to do that in XHTML 2.0.

**ScottHughes** · 01-17-2008, 02:32 AM

XHTML 2 still supports numbered headings. You can use the new headings or numbered headings in XHTML 2.

Thanks,
Scott