An Unseen Pitfall of SEO?

[TheMadScientist]

A couple of recent threads have made me give a bit of thought to this, and I think an unseen pitfall of SEO that's larger than many think is: the source code not "saying" what's intended to be understood algorithmically.

In thinking back over the years I've read about design changes and updates to sites causing drops in rankings more times than I can remember, and when I wonder why I think it's often because people who run sites only see and understand the surface, meaning what's presented on the screen when the site is viewed in a browser, but don't understand the implications simply changing something from an <h1> to an <h2> can make semantically to an algorithm.

In a recent thread I used an Apples and Oranges example to show why a <h2> should not be thought of as a subheading due to the possible semantic impact.

Here it is:

---

<h1>Apples and Oranges</h1>
<h2>We love fruit.</h2>
<p>Info about apples here.</p>

<h3>All About Oranges</h3>
<p>Info about oranges here.</p>

The preceding semantically says:

The page is about "Apples and Oranges".
There's a subsection to "Apples and Oranges" called "We Love Fruit".
The main section about "We Love Fruit" contains content only about apples.
There's a subsection to "We Love Fruit," which has content only about apples, called "All About Oranges".

The preceding outline makes oranges a subsection of the info about apples, rather than a topic about another fruit on the same level as the info about apples.

---

The corrected version is:

---

<h1>Apples and Oranges</h1>
<p>We love fruit.</p>

<h2>All About Apples</h2>
<p>Info about apples here.</p>

<h2>All About Oranges</h2>
<p>Info about oranges here.</p>

The preceding semantically says:

The page is about "Apples and Oranges".
"We love fruit" is part of the section about apples and oranges.
"All About Apples" is a subsection to the main topic of "Apples and Oranges".
"All About Oranges" is a subsection to the main topic of "Apples and Oranges" on the same level as "All About Apples".

---

Why is it important and what does it have to do with site upgrades and template changes?

Let's imagine for a second a site is correctly coded using the second example above, but it's design is 5 years old and out-of-date, so the owner decides to update it and finds a really cool new template that looks great, but doesn't understand when they convert the "look" even though all same words are in all the same places the new template "says something different" to Search Engines, because it uses the first example above and now Oranges are a sub-section of Apples, which is incorrect.

The better search engines get at "understanding", the higher the likelihood of the semantically incorrect change being a negative in the rankings becomes, because even though people may know when talking about fruit, apples and oranges are two separate entries what the neat new design is telling search engines is: Oranges are a subsection of Apples, which is completely inaccurate.

Something I'm not sure I've shared before is I've been a hand-coder for years. I won't use a WYSISYG editor, I don't use WP or any other system that has mass-produced themes, because the ones I've reviewed are usually so poorly coded they can completely change the semantic meaning of a page.

I've also reviewed the HTML source code of major sites for hours and hours and hours over the years, and one thing they all seem to have in common is it's semantically correct and coded in-house as far as I can tell, so what's the big deal and why can they change designs without a blip?

If I had to guess it's because the HTML says the same thing semantically before and after the "look and feel" a user sees are changed, but in many cases for smaller sites the template(s) they've looked at and wanted to install or insisted on installing completely changed what is said semantically to search engines, to the point of Apples and Oranges both being "on the same level" of importance as individual fruits to Oranges being a subtopic of Apples, which could [should] confuse an algo as much as it would a person if someone tried to tell them Oranges were a sub-type of an apple rather than an individual fruit.

---

Bottom Line: I think one often made and under-identified SEO mistake is not understanding the semantics of a page are important for rankings and changing those semantics to have a super-modern design a visitor sees can have some very unexpected ramifications in search rankings, and can actually cause a site to tank due to the confusion created by a poorly coded template, even if it looks great.

[aristotle]

I agree that mis-use of <h> tags and other html elements could confuse search engine algorithms, especially with regard to what parts of a page are the most significant. It could indicate that the original coder was sloppy, or just didn't have a good understanding of either the content or the proper usage of the tags. But you're talking about a hidden "pitfall" of switching to a new template. But in it still comes down to the person not having enough knowledge of how web pages are constructed.

[martinibuster]

This is an important consideration of switching templates. The W3C validator [validator.w3.org] has an option to "show outline" which means to show you what it looks like with all the heading elements arranged in order.

[Clay_More]

I've just been going through a lot of pages making these types of decisions. Lots of things need more attention to detail than they once did.

[toidi]

Thank you! I have been taking the lazy approach and using the h tags for asthetic purposes without any regard to how they affect the site.

I am making the changes on some struggling long tail pages and as i am doing it, the code looks more natural.

I will let you know if it looks like it is working.

[aristotle]

For anyone who is revising old code, I recommend that you check out some of the tags that were introduced in html5, if you haven't already done so.
See [w3schools.com ]

There are several of these tags that can help search engine algorithms better understand the structure of a page. For example:

<main> (main content)
<nav> (navigation)
<footer> (supplementary or boilerplate info)
<address> (contact informatio)
<article> (informational article)
<section> (similar to <div> tag)

In some cases there might be some uncertainty as to whether to use <article> or <main> or both, but either one is probably better than nothing.

[TheMadScientist]

I have been taking the lazy approach and using the h tags for asthetic purposes without any regard to how they affect the site.

I think most people do, or just plain don't understand what the use of different headings means semantically, but really should, because while SEs may be able to "get it right", or even think they do and/or have us convinced they do, if someone tried to tell me [or my algo for that matter] Oranges were a subtopic of Apples rather than an independent fruit on same level as Apples I'd be inclined to question their knowledge level [have difficulty trusting them] and that, IMO, could definitely cause a tough to detect ranking issue.

Changing to the "right way" may or may not help, but as has been said here a number of times over the years: Why leave it in the hands of a SE guessing correctly when we don't have to?

Thank you!

Welcome, BTW -- I can't guarantee it will help, but it doesn't, IME, hurt to have things coded correctly.

[Broadway]

Is there a difference (I guess I mean to Google) between the "importance" of the h3 tag below vs the h4 tag?

<h1>Apples and Oranges</h1>
....<h2>All About Apples</h2>
........<h3>Info about apples.</p>
....<h2>All About Oranges</h2>
............<h4>Info about oranges.</p>

The above form is how the W3C validator would outline these headings.

But I've also used the outliner chrome extension, and then via a website that offers this service. They both show an outline form like the one below where the h3 and h4 tags are equated (because the h4 has no h3 above it).

1) Apples and Oranges
...2) All About Apples
......3) Info about apples.
...2) All About Oranges
......3) Info about oranges.

Can you de-emphasize the importance of "Info about oranges" by using a h4 tag, or since there is no h3 tag above it will search engines just equated it to an h3 anyway and therefore put it on par with the "info about apples" tag?

[TheMadScientist]

They both show an outline form like the one below where the h3 and h4 tags are equated (because the h4 has no h3 above it).

In the case you presented, it's not because the <h3> came above the <h4>, it's because the <h3> is a subsection of the <h2>, the same as the <h4> is.

Can you de-emphasize the importance of "Info about oranges" by using a h4 tag, or since there is no h3 tag above it will search engines just equated it to an h3 anyway and therefore put it on par with the "info about apples" tag?

They don't equate it to an HN, necessarily, they equate it [the <h4>] as a subsection of the preceding <h2> if they're outlining correctly, since any HN greater than <h2> indicates a subsection of the preceding lower HN, which is <h2> in this case.

[edited by: TheMadScientist at 7:52 pm (utc) on Dec 23, 2014]

[EditorialGuy]

Can you de-emphasize the importance of "Info about oranges" by using a h4 tag, or since there is no h3 tag above it will search engines just equated it to an h3 anyway and therefore put it on par with the "info about apples" tag?

Nobody can say for certain (except for the search engines), but in my experience, it doesn't matter if a subhead is h3 or h4.

The search engines are interested in the relevance and quality of your content, not in whether you've built your pages around a tiered outline.

[TheMadScientist]

...it doesn't matter if a subhead is h3 or h4.

They aren't subheadings; they're sections or subsections -- There's a difference.

The search engines are interested in the relevance and quality of your content, not in whether you've built your pages around a tiered outline.

I'd argue there are many more people affected by Panda who think they have quality relevant content yet can't figure out why they "got hit" even though they don't have a properly structured document so it's "read" by search engines the way they intended than there are those who "survived" and indicate via structure Oranges are a section/subsection of Apples -- If you have evidence to the contrary, please feel free to present it.

[edited by: TheMadScientist at 8:49 pm (utc) on Dec 23, 2014]

[aristotle]

<h1>Apples and Oranges</h1>
....<h2>All About Apples</h2>
........<h3>Info about apples.</p>
....<h2>All About Oranges</h2>
............<h4>Info about oranges.</p>

I think it would be prudent to avoid an asymmetric structure like this one. Even if it isn't confusing to search algorithms as it stands (which it might be), it could still cause problems during future template changes or other upgrades, which was one of the pitfalls that led TMS to start this thread.

[EditorialGuy]

If you have evidence to the contrary, please feel free to present it.

Neither of us has evidence one way or the other, because the search engines aren't telling us whether or how the use of heading tags influence their algorithms. For what it's worth, Google has fairly detailed Webmaster guidelines (including technical guidelines), and those guidelines don't say anything about how to structure pages.

There's no reason to think that using heading tags correctly is a bad thing, but it isn't likely to be a panacea if you aren't happy with your search rankings.

[lucy24]

They both show an outline form like the one below where the h3 and h4 tags are equated (because the h4 has no h3 above it).

In the case you presented, it's not because the <h3> came above the <h4>, it's because the <h3> is a subsection of the <h2>, the same as the <h4> is.

It's around this time that everyone figures out that nobody has the same definition of "above". Especially when each outline-level has a different associated CSS layered background, haha. I also suspect that your fingers typed h3 when your brain meant h4, and vice versa, but that's secondary.

How 'bout: "because there is no <h3> between the <h2> and <h4>"

If a search engine meets a lot of unrelated heading levels, like an h2 immediately followed by an h5, they must eventually start suspecting that the page is using <hx> for format rather than to show a relationship. And that's the search engine's cue to start making up its own model of how the page is structured. A process that involves "the search engine makes something up" is generally not a good thing.

[TheMadScientist]

It's around this time that everyone figures out that nobody has the same definition of "above".

LOL, smarta** -- So true though. I should have said preceding rather than above.

I also suspect that your fingers typed h3 when your brain meant h4, and vice versa, but that's secondary.

Well, they're actually interchangeable when they indicate the same thing -- I could have said, "It's not because the <h3> preceded the <h4>, it's because the <h4> is a section/subsection of the preceding <h2> the same as the <h3> is." and it would have the same meaning as, "It's not because the <h3> preceded the <h4>, it's because the <h3> is a section/subsection of the preceding <h2> the same as the <h4> is." -- Basically, both the <h3> and <h4> are sections/subsections of the preceding <h2>, which puts them "on the same level" in a document outline.

A process that involves "the search engine makes something up" is generally not a good thing.

Exactly! because when we force SEs to "guess" or "make up rules" for algorithmic interpretation of what we're trying to say things can be "read" or "understood" by the algo in a very different way than we intended to communicate them, so better to structure things correctly and keep the "SE guessing game" to a minimum, IMO.

[EditorialGuy]

when we force SEs to "guess" or "make up rules" for algorithmic interpretation of what we're trying to say things can be "read" or "understood" by the algo in a very different way than we intended to communicate them, so better to structure things correctly and keep the "SE guessing game" to a minimum, IMO.

Why stop at proper use of heading tags? Structured data markup (such as Schema markup) will make things even clearer to Google and other search engines, and Google actively encourages its use.

[seoskunk]

I spent a long time semantically structuring web pages with headers in correct order etc. and whilst the source code looked very nice the ranking effect on google was non existent. So whilst its nice code and good practice I think its important to note that HTML5 seriously considered removing H tags altogether.

As a ranking factor I would say H tags are on par with bold text. I don't think its an SEO signal more than bold text is and is more of a web standards thing.

[TheMadScientist]

Why stop at proper use of heading tags?

Has anyone said to? If so, please, provide a quote, because I can't find anywhere anyone in this thread has said that or even anything close -- Maybe I missed something, but I started this thread, so I've followed it pretty closely.

I spent a long time semantically structuring web pages with headers in correct order etc. and whilst the source code looked very nice the ranking effect on google was non existent.

Then at least you've removed "SE interpretation" from the equation and, IMO/IME, that's a good thing, because it's one less thing to worry about -- Will "getting it right" make a site rank higher? Not necessarily, but "getting it wrong" and "confusing an algo" could certainly cause a site to rank lower.