SEO Tycoon

**SimpleLance.Com** · 04-29-2006, 11:19 AM

What is the SEO benefits of CSS layouts

**blue-dreamer** · 04-29-2006, 12:41 PM

I started of just using tables for layout like many people, but as CSS started to get popular I started to use it more and more, just learning as I went along.

I think the best method for anyone to learn is to spent time playing with it. Ask yourself "how would I do this?", then goes to a CSS resource site, look it up, and then try it out.

**ADAM Web Design** · 04-29-2006, 02:54 PM

Quote:

Originally Posted by SimpleLance.Com

What is the SEO benefits of CSS layouts

At the risk of shamelessly self-promoting, I'm going to use a page from my Search Engine Friendly Layouts site since it contains visual aids.

http://www.searchenginefriendlylayouts.com/layouts

If you look at the graphic associated with each layout, it indicates the load order of the individual layers. The content layer is always the #1 layer, and this is what each page of your site is really about. Not the menus, not the banner ads or text links down the right side of the page, not the header, not the footer. The content.

And if you look at where most SEO occurs, it's within that content area. You can't really do too much with menus or headers or footers or other layout elements no matter how you try, but you can have an impact on the content.

There's also a user benefit to this approach too: rather than waiting for headers and menus and other things that would load before the content in a conventional table-based layout, the user gets to see the content first and foremost. The other stuff can always load after.

**vangogh** · 04-29-2006, 06:10 PM

Adam have you found that having your content appear first gives the page a benefit in the SERPs? I think it can help, but haven't been convinced yet so I'd be happy to hear your thoughts.

I completely agree with it being better for visitors. Why make them wait for everything to load before they can get some benefit from your site. Give them something to read while they're waiting for your other page elements to load. It's one of the advantages over table layouts where you have to wait for the entire table to load before seeing anything inside that table.

**chrishirst** · 04-30-2006, 06:28 AM

Quote:

Originally Posted by SimpleLance.Com

What is the SEO benefits of CSS layouts

None whatsoever!!!

many reasons to use CSS, SEO isn't one of them.

**beta** · 04-30-2006, 11:13 AM

Thats not entirely true, converting complicated table layouts to structured markup can vastly reduced the amount of code to content ratio on the page, something which google for instance looks at when calculating the relevance of the pages content.

**chrishirst** · 04-30-2006, 11:29 AM

rubbish

Quote:

code to content ratio

total load of BS made up by the self proclaimed "experts"
there is no such thing

the search engines are not interested in the code.

what if I have a page with one word that is surrounded by a table structure, 5% text 95% code structures, would that word be ignored ????
Nope of course it wouldn't. test it for yourself and you'll see how many of these myths are completely stupid.

**ADAM Web Design** · 04-30-2006, 12:25 PM

Quote:

Adam have you found that having your content appear first gives the page a benefit in the SERPs? I think it can help, but haven't been convinced yet so I'd be happy to hear your thoughts.

Yup. I've seen one site in particular jump from #100 on a keyword to #9 (http://www.hibiscusflorals.com) as well as jump for every other keyword targeted just from doing that. Mind you, that's an extreme case, but I've never seen it do anything but work in a positive sense.

I've also noticed that there are a small but growing number of directories that won't even accept a site that isn't done in XHTML, which is another factor in turn. None come immediately to mind, but as soon as I can "refind" one, I'll post it.

Personally, I'd like to see more of this, and I think we will. That's nothing more than a hunch, though.

As far as the "code to content" ratio, I've never heard of that one myself, but again, there are benefits to adjusting the order of code. And to do so, let's take Chris's example...a word surrounded by table-based code.

That word, in and of itself, wouldn't be ignored.

But...let's take that same table-based code and put a menu directly above the word in terms of appearance.

Is the site about the menu or the word? It's about the word. The menu is just there for navigation purposes to take you to pages with other words. But with conventional layouts, that's what ends up becoming more prominent, not the word.

I think I see why Chris made the statement though. If divs are arranged top-to-bottom, left-to-right, and in the manner of a conventional table-based layout, then what he's saying holds completely true.

The beauty of divs, though, is that the designer no longer has to do that. A designer can pretty well arrange the divs in any order he/she wants. The menu can go first if the designer feels it's most important, the content layer can go first, even the footer could in some cases.

**chrishirst** · 04-30-2006, 12:58 PM

what you find when you get this "we changed to [insert whatever] and our rankings went up" is they omit to mention is;
and we rewrote a lot of content, updated the internal linking and went on a link building spree, but it must be the [insert whatever] that did the improvement

Take your example for instance and look at the previous site.
http://web.archive.org/web/200502052...usflorals.com/

from http://web.archive.org/web/*/http://...usflorals.com/

mixing up cause and effect is the big mistake everybody makes when talking (and writing) about SEO!
Take nothing for fact until you have tried it yourself

**vangogh** · 04-30-2006, 01:39 PM

I don't think the code to content ratio will make any difference since the search engines are going to strip all the code out anyway. I suppose a cleaner site won't trip them up, but a table or css layout can be built equally well enough not to trip up a spider.

I think keyword prominence has an effect on ranking though my thought is the effect is minor so while I think it can help to order your page elements using css I'm not convinced it will have major benefits.

Still I think using css to layout a site has so many other benefits over tables that I'm going to use it anyway. Just not convinced yet of any seo benefits.

**ADAM Web Design** · 04-30-2006, 02:12 PM

chrishirst: I've seen that behaviour too many times myself and I understand your point completely. And, to be fair, I didn't give you all of the information that I had available to me.

However, the "old layout" vs. the "new layout" wasn't what I was referring to (although the traffic was like night and day when it was relaunched.) And what you're referring to, in this instance anyway, doesn't actually apply. Everything that I was making reference to was being used on the new site.

To make this simple, let's call the old layout (from that archived cache) v.1, the new layout v.2, and the present layout v. 2.1.

The difference between v.2 (which for some reason never got cached) and v 2.1 is that I hadn't yet figured out how to get the content layer first in that layout. The output was identical (it's what you see there now), but the content layer was presented second since I couldn't figure out how to get the menu up first. For some stupid reason, The Internet Wayback Machine doesn't seem to have a cache after February (although I take most of the caching done by it with a grain of salt.)

This was something the client and I did post-Jagger3 (when for some strange reason, the site took a tumble). Without touching any of the content, generating any IBLs, or doing anything else, I figured out how to move the header in the code to the last layer of the page. Although I had been developing similar layouts for other clients since the launch of the Hibiscus site, this was where I really discovered the benefits.

December 13, 2005 (when v 2 was indexed), the keyword in question was at position #100.
December 14, 2005 (when v 2.1 was indexed), position #9.

Again, no IBLs (or increases reported by any engines), no content changes, nothing but taking the menu and moving it to the end of the code. All things remained as equal as we could reasonably get them. But in the eyes of Google (where the increase occurred), it was a whole new page.

MSN also loves the coding standard, since their algorithm takes on-the-page factors into serious consideration. Yahoo! doesn't seem to be affected greatly by it, but it certainly doesn't hurt.

Now...I'm not suggesting that it's the be-all-and-end-all as far as SEO is concerned. It's only one factor, as is everything else that can be done: SEO is the combination of a whole bunch of stuff, and I'm very well aware of that.

But...and I think this is the point you were trying to make in a roundabout way...SEO is pretty hypercompetitive, and any advantage someone can gain, no matter how slight, has to be taken into account. This provides a safe, legitimate way to do so that also happens to increase user benefit. Show me one other SEO technique of any variety that will do that.

And let's assume you're right. Let's assume the coding and the order of elements makes absolutely no difference. So I'm dead wrong. I'm a complete freakin' idiot for suggesting it. That's the premise.

So: Adam, you're retarded for suggesting a search engine benefit. But does that mean the idea is stupid?

No.

As vangogh pointed out, there are many other benefits behind CSS and XHTML as well: reduced code, enhanced user experience, easier maintenance (since debugging is a lot easier once you're used to it) and greater flexibility in layout design.

And therein lies the subtle, but greater goal of the site in general: to present legitimate reasons for people to use XHTML and CSS and help advance the cause of web design. And, to be perfectly honest, I haven't done as much on that site as I could have in that regard (I know, because I've got other stuff in the works that way...stay tuned.)

The reason I focused on the search engine benefits is because it was an area no one touched on and because it demonstrates a commercial benefit as opposed to an idealogical one. One of the weak points IMHO in the marketing of XHTML and CSS is that it's too "hippie-oriented". As the Target/NFB situation has demonstrated, corporate types just don't get why web standards should be taken into account and what they stand to gain by employing them. (I intentionally used a positive phrase here, by the way.) So there's my logic in a nutshell.

**chrishirst** · 04-30-2006, 03:04 PM

As a fellow mod on HighRankings is often pointing out in threads. The key to good rankings and conversions isn't having the correct formula for SEO, but doing more things right than the others.
So maybe the changes got around some other indexing issues that were in the way. OR maybe it simply means that more elements of the ranking algo worked in your favour.
The acid test of course would be to move the content back again to where it appeared in the source code and see if the rankings fell back. I'd strongly suspect that they would not change beyond the normal day to day fluctuations.

BUT there is a flaw in your thinking, literally overnight changes when updating code like that just don't happen, one likely explanation is that you were looking at different datacentres on different days where the changes were being synched. It just appears from the timings that the code changes made the difference. It takes around 2 - 3 days for a change in a page to show up in the index after the page has been crawled.

Everyone likes to believe they have found the magic key to Google rankings but in reality there is no secret, every page/site is different and what works on one will probably not work on another.

**SimpleLance.Com** · 04-30-2006, 03:31 PM

Well i have had alot to read over and i will consider all this and make notes for my future reference.

There seems to be a consistency with answers to all my questions that is that CSS is simply the future of web design.

I suppose another topic in relation to CSS is usability for browsers what are your views on this matter as i have been looking at alot of CSS webpages and there were a fair amount of pages with errors such as text no correctly positioned are there some errors that arise with CSS or are these just man made errors.

**ADAM Web Design** · 04-30-2006, 04:02 PM

Quote:

BUT there is a flaw in your thinking, literally overnight changes when updating code like that just don't happen, one likely explanation is that you were looking at different datacentres on different days where the changes were being synched. It just appears from the timings that the code changes made the difference. It takes around 2 - 3 days for a change in a page to show up in the index after the page has been crawled.

I will agree about the acid test. However, since this is a live site and doing such a test could prove disastrous even for a few days, I think you'll understand why I didn't go back the other way.

As far as the change goes, it was measured across multiple (5, to be precise) datacenters based on the IPs to minimize the possibility of sync issues.

The code, both before and after, was valid and there were no known indexing issues...everything was crawled and cached as expected.

Without going into much more detail, since I suspect all that's going to happen is we're going to go back and forth with you picking apart vs. me providing more information for you to do so, I will say that every measure that I could possibly think of to test the code was used.

But this is getting old and getting old fast. And it's not helping anyone with anything. But, since you're an advocate of testing (and I don't have any problem at all with that), I'll make you a proposition.

Take a page that you've done with a conventional table-based layout, and one that is done in such a way as to match one of the layouts I've created. Ideally, it should be one with a keyword or phrase that ranks around the 3rd or 4th page of the major SERPs (Google, Yahoo!, MSN).

Replace the code with one of my code templates, and let's see what happens. Don't change the content itself, don't change the writeups, don't get IBLs to the page, any of it. Just change the code from a tabled layout to a tableless layout.

If you're an advocate of testing as you claim you are, and you think it won't work, then you'll have no problem with this idea at all.

**ADAM Web Design** · 04-30-2006, 04:08 PM

Quote:

Originally Posted by SimpleLance.Com

I suppose another topic in relation to CSS is usability for browsers what are your views on this matter as i have been looking at alot of CSS webpages and there were a fair amount of pages with errors such as text no correctly positioned are there some errors that arise with CSS or are these just man made errors.

This is the problem with CSS: it's left to interpretation on the part of both web browsers and web designers. It's not perfect. Anyone who claims it is is delusional.

It's tough to say whether they're browser quirks or man-made errors. IE interprets things one way, FF has its view, Safari has its way, IE for the MAC doesn't offer proper standards support and has been discontinued, etc. and so on.

The best thing you can do is, when you see those or encounter them, ask yourself if it's a design issue and not a browser issue. And again, be prepared for disagreement on this.

**Selkirk** · 04-30-2006, 10:07 PM

Google does try to perform an analysis of different parts of a web page to determine relevance. It tries to identify the unique content areas of your page and distinguish that from the advertisements, navigation, and duplicated content. Then it gives a heavier weight to some areas and a lower weight to others. I think CSS layouts just make it easier for google to perform this analysis or gives google more confidence in the analysis that it does perform.

I do think it helps. Just one more thing to work on.

**3pointRoss** · 05-01-2006, 12:23 PM

Google themselves have said that a site with an understandable and clear hierarchy of content, and proper mark-up/syntax/symantics helps search engines better understand a page and thus appears more relevent.

I wouldn't say CSS *DIRECTLY* is benifical for SEO, but it is helpful to create a site that looks/functions as you would like and still is understandable to search engines.

For example, a table based design would usually break up the headers, paragraphcs, etc.. further search engines are looking at the design as if it is tabular data.

**vangogh** · 05-01-2006, 01:31 PM

Ross do you have a link where Google mentions they like proper code? I've seen them state the opposite (I'll have to look for that link). I'm paraphrasing, but I think they (maybe it was Matt Cutts) said that Google is mostly concerned with your information and that there are plenty of sites with good information that have poor code. Google still wants to present that information when it's the most relevant so they are fine with a certain amount of poor code.

I'd like to see them place more emphasis on good code, but I haven't seen proof they do yet.

Adam, that's interesting about your results with moving the content. I'm still not 100% convinced, but like you said if it gives any kind of benefit why not. And like we've both said there are so many other reasons to code a site with a css layout there's no reason to be using a table.

I think it's relatively easy to get a css layout to work the same (or close enough to being the same) across browsers. It's not going to be exactly the same, but there's no reason why you can't get a site to work in all browsers. The differences will be minimal and unless your comparing the site in different browsers you won't really notice the difference.

I think sites not working in multiple browsers has more to do with the developer not testing the site in multiple browsers than it does with the browsers themselves.

**3pointRoss** · 05-01-2006, 03:57 PM

It is not so much that any search engine places an emphesis on good code, it is simply that good code allows a search engine to better understand and catagorize your site and content.

http://www.google.com/support/webmas...y?answer=35770

Quote:

Make a site with a clear hierarchy and text links. Every page should be reachable from at least one static text link.

Quote:

Create a useful, information-rich site, and write pages that clearly and accurately describe your content.

They took down the section where it actually mentioned heading tags followed by paragraphs, so maybe the algorythm has changed to shy away from that. However, using proper code will help the search engines better understand the page.

Using blockquote for indents for example, the search engine reads it as a quote. How does that fit in the the rest of your site, if it isn't actually a quote?

**seohr** · 05-01-2006, 04:33 PM

I agree mostly with chrishirst , SE are not interested in code. But there is something positive about CSS , CSS is keeping content together.

Here is great source about this subject:

www.miislita.com