52 replies to this topic

[LesSmith]

For some time I have been meaning to research the use of CSS rather than tables for page layouts. In the past there were back level browser implications but I reckon now that most visitors have browsers with good CSS support, so have finally go round to doing some active research.

For a quick introduction to the use of CSS to replace tables see Exploring the Limits of CSS Layout (You need to scroll down to find this article).

However I haven't seen any mention anywhere of potential benefits / drawbacks from a SEO point of view.

So has anyone here done this and then looked at their web stats to see what effect, if any it had on the search engine perfomance.

For a living example of this technique see CSS Zen Garden where the whole look and feel of the site can be changed by a click on links to alternate vistor uploaded CSS schemes.

One possible benefit is that the important text can be placed at the front of the Body text regardless of where it is to appear on the page, as I have always suspected that Google tends to give more weight to the first paragraph.

[Mel]

There can be lots of benefits SEO-wise to the use of CSS, perhaps chief among them the reduction of lots of unnecessary code in declaring fonts and thier attributes, positioning, background colors. Another SEO benefit is the use of CSS to make headers format in a style that looks good on your page, thus encouraging more webmasters to use them.
Not quite sure what you mean about CSS replacing tables. Are you referring to Layers perhaps?

[dimok]

One possible benefit is that the important text can be placed at the front of the Body text regardless of where it is to appear on the page, as I have always suspected that Google tends to give more weight to the first paragraph.

LesSmith, by the way, you can use a trick I mentioned in some topic: http://www.highranki...st=0

Mel,

Are you referring to Layers perhaps?

surely layers. There is no another way to layout pages with CSS.

I do think that SEs will like you more with CSS touch on everyting on your pages.

[leftbrain]

In the past there were back level browser implications but I reckon now that most visitors have browsers with good CSS support, so have finally go round to doing some active research.

LesSmith, I thought the same thing and got into some trouble over it. See my previous post at http://www.highranki...=135 for my tale of woe.

I'm not telling you for forgett CSS, just be careful to understand the compatibility issues you face. It all boils down to knowing your audience. If your site is intended for those who always keep up with the latest technology, you should be fine. If, on the other hand, your audience could be composed of major defense contractor employees stuck in the world of Netscape 4, you could be causing more problems than you will solve.

Just a friendly word of caution.

[LesSmith]

It was the SEO aspects I am interested.

I am aware that using CSS to reduce the size of pages is a benefit as well as making maintenance easier. Having been in IT for nearly 30 years I didn't need to be sold on the advantages of separating presentation out from content when I first came across CSS, as it was common practice on mainframes in the late 70's.

To see what I mean by using CSS instead of tables see
this example

It works great in IE and the page HTML is so simple.

I though this was a no-brainer until I had a look at it in Netscape 4.5

I used to be a great Netscape fan until it became really apparent I was against an overwhelming tide.

As to the table trick of having a dummy entry in the leftmost column for row 1 and putting the navigation menu in row 2 , I have used that on a number of sites, and it does seem to help.

For my own software I have some test pages I which sell posters,CDs etc through affiliate schemes and I use the growing sales from them as the ultimate benchmark , so I guess I just ought to try out a few pages and see it they not only get traffic but also achieve some sales to see how it works out in practice.

[Mel]

Hi Les: Yep as I thought you are really talking about layers not CSS. While CSS can be a great help in handling layers, they do not need CSS to function.

Yes layers can be a great benefit to SEO in that the code for the page content can appear first, with the code for the other layers in any order.

Also works well to build dynamic menus systems that spider well.

[Ron Carnell]

I'd like to throw out what I suspect are going to be a few rather unpopular ideas.

I've seen a lot of speculation suggesting that light HTML code will get better rankings than heavy HTML code. Seems to me, if that were true, we'd see a lot of the SERPs being dominated by files that end in .txt? While I agree that the position of text within the content can be important, I really question whether position within the overall document really matters. I can strip all of the HTML tags from a file with one line of code. If I want to be more selective, it might take four or five lines of program code. Is there any reason to think Google's programmers are less efficient? Is there any reason to think they determine relevance before stripping the HTML they consider unimportant?

As long as you write good HTML and the whole page falls within Google's maximum limits, I just don't see any real evidence that it matters.

Additionally, when you start using CSS positioning, those old browsers like Netscape 4.x and webTV are not your only problems. Internet Explorer holds a pretty dominant market share these days, and is NOT entirely CSS2 compliant. You're going to have to learn what works and doesn't work, either avoiding the latter or using the many work-arounds available to accomplish your purposes. Taken to the extreme, which a lot seem to reach pretty quickly, you'll be right back in 1998, with different code sprinkled all over the place for all the different browsers.

Someday, I think CSS2 will liberate content from presentation, which is really the ONLY reason to use it. I just don't think we're there yet.

[qwerty]

Someday, I think CSS2 will liberate content from presentation, which is really the ONLY reason to use it. I just don't think we're there yet.

First of all, I don't think it's necessary for this to be an either/or issue. One can take advantage of CSS without using it and it alone for layout. You can still use tables if you want to, and I often do.

Beyond that, the advantages of CSS are very clear:

• You end up with smaller pages that load faster
• The CSS gets cached, so you have even faster page loads
• You can make changes that propagate through the entire site just by changing the one file

If you want to use it to completely separate content from formatting, you certainly can, but that's not the only reason to use it.

My point is that it's not just about the search engines. If the spiders find it easier to crawl pages that have been cleaned up through the use of CSS, that's great, but even if they don't, it's a good idea to do it anyway.

[leftbrain]

Well said, Ron! To me, CSS is a convenient way to control heading attributes, fonts, table properties, and the like. I can accomplish most of these without running into compatiblity issues, and it makes site changes much easier to implement. As long as all existing browsers are not in full compliance, CSS2 is, IMHO, not ready for prime time.

[Mel]

IMO CSS and layers are two seperate items, either of which can stand alone or can be used togther.

I find no real problem using layers and getting good results in most browsers, and I find no areas where CSS is not incompatible any more than html is.

[Ron Carnell]

Bob, I agree with every single point you make. Anyone who doesn't use CSS1 to make their pages a more enjoyable experience for the visitor is missing the boat. Your closing point and mine are really much the same: Ignore the search engines and use what works.

And, yes, you can mix CSS2 and tables if you want. Fact is, unless you want to limit your design options or completely ignore IE, you really don't have much choice.

Mel, can you define for me what you mean when you use the word layer? If you're talking about the Netscape <layer> tag, then, yes, CSS and layers are two separate items. If you're not talking about Netscape (which I suspect is the case), then there is NO SUCH THING as a layer.

CSS1 was designed to give us better control of formatting, but it offered virtually no support for positioning of elements. So, Scott Furman of Netscape and Scott Isaacs of Microsoft wrote a separate specification for positioning, which was released as part of the CSS2 recommendation in 1998. CSS1 is for formatting and there are only a few compatibility problems (mostly with inheritance), none of which will make a page unusable. CSS2 is for positioning and the incompatibilities can very easily destroy the functionality of a page.

Layers are really little more than a metaphor for the positioning allowed by CSS2. Some applications use the metaphor loosely, like Dreamweaver does, and that confuses things a bit. Others, like Internet Explorer, just plain get it wrong and insist that a layer is a DIV and can only be a DIV. Metaphorically, a layer is any HTML element that can be positioned, but technically (and aside from Netscape), there is no such thing as a layer element in HTML. What you think of as a layer, I suspect, is just a very handy way of thinking about positioning and is very much a part of the CSS specifications.

When you use layers and get "good results in most browsers," what you are really doing is dumbing down your CSS2 code to accommodate Internet Explorer. Absolutely nothing wrong with that. But dumbed down CSS2 will NOT easily replace tables without sorely limiting your design options. When you try to get around those limitations, you end up in work-around hell. And, in my opinion, I really question whether entering that hell will in any help way improve your search engine results.

In short, I agree we should absolutely use CSS1. I also agree we should use CSS2 when we feel it's appropriate to the task, but think the limitations are greater and the benefits less obvious. It ain't no silver bullet.

See? I knew these ideas weren't going to win any popularity contests.

[qwerty]

I think when Mel says "layer" he's referring to the <div> tag. I use the same term myself.

[Mel]

Right on Bob

When I speak of layers I am talking about the wonderful <div> tag which is an HTML tag and not a part of the CSS2 spec. Its true that the positioning options provided in CSS2 allow you to do some very nice things with layers but as I said they can stand on thier own.

Now Ron you may not think that such a thing as layers exists, but a search on css layers in Google reveals 85,900 pages who think they do.

As for "Dumbed down" code, I use code that works on the browsers that real people use, and in my book thats not dumb. There may be all sorts of wonderful things you can do with Smart Code but if no one can see them properly whats the purpose?

As to whether or not the "dumbed down" code I use is helping me in my rankings is open to question I guess, but I can see no indication that it is hurting my rankings, and I'm not about to destroy high ranking pages to see what portion of the rankings may be attributable to the contrbutions of layers.

I too lament the lack of interoperabilty between the various codes and specifications written with good intent and the differing implementations we find in various browsers, but these limitations are not confined only to positioning.

I use and will continue to use layers with and without CSS2 positioning elements and am of the opinion that they can be a valuable tool in your design box. But then I am not going to try to support every version of every browser used in the past ten years.

YMMV

[Ron Carnell]

We could argue semantics all day, Mel. A <div> tag is a <div> tag. Everything you currently use them for could probably be done with a <p> tag, instead, at least in a standards-compliant browser. You telling me every <p> tag is now a layer, too? And I never suggested that dumbed down code wasn't appropriate to use, nor am I clear why you would imply I did. I occasionally misspeak myself, using the wrong word or construction, as I think Jill recently pointed out to me in another thread. If I'm wrong, I'll correct myself and select a better word. If I'm unclear, as was the case with Jill, I'll try to clarify. And if I'm convinced my choice of word, phrase or construct was accurate, I'm perfectly willing to defend my choice. But, is that really how you want to spend our time together in here?

You call it tomato, I call it tomahto, and at the end of the day it still tastes the same on a BLT.

The questions was, would replacing tables with CSS positioning elements have an effect, either positive or negative, on SEO results. In my opinion, and for the reasons I stated, I think the answer is no. I have absolutely no evidence, beyond logic and my own programming experience with parsing pages, to lend weight to that opinion. Nor will I spend any time in pursuit of that evidence because, and this was my second point, I'm convinced the elimination of tables right now isn't a viable goal.

[Mel]

HI Ron
Where ever did you get the idea that I was replacing <p> with <div>?

I am replacing <table> with <div>

I believe that the ability to put your page content high in the code and to construct dhtml menus that spider well are likely to have good effects on rankings, but if you think not I'm not going to try to convince you.

Works for me is all I am saying.