I was reading a blog over at seomoz, and one one of the recent posts in a tutorial they say when building a site build it with only CSS and no tables.

I know these days more and more sites are built with no tables, however what I would like to know is does it have any SEO benefit, or is it just better practice these days to build a site without tables and have everything controlled via the stylesheet using div's?

I guess this is a half web design half seo question, but this interests me and would like to get ppl's opinion.

It does has several benefits.
Less code
This is good as thier is less bloat to the page, and this helps with indexing.

Faster download times
Due to the fact that, if done right and, you have seperation of content the css is in a seperate file, meaning that the html file is lighter, and as long as you don't have divitius - lots of divs - your bloat should be down as well. This should give you slightly faster download times which helps if you have adwords.

Bare in mind a lot of mistakes beggniners to CSS make is they to try to replicate a table layout using div's and inline style rules. Code bloat benefit can then be reduced.

If however you use minimal div's, and style other elements such as P, span, strong, b, u, q, button, blockquote......
You then see a benefit.

There is also a higher text to code ratio as well which is benefitial.

You could mention layout. Positioning text closer to the top which again helps slightly with indexing. That to be honest is a bit of a push.

None of this is going to effect rankings in any big way though 99% of the time. But every little bit helps.
Jaza

Don't forget that you can also order the elements on the page in any way, thus making sure that your most important content is near the top. The spiders don't see presentation, and having related content placed semi-randomly in the markup (as is often the case with tables) isn't a winner. Rather, the most important stuff should be placed at the top. Google reflect a weighting that prefers this arrangement in their original "Anatomy of a hypertext search engine" paper. It's also a complete accessibility win.

Google reflect a weighting that prefers this arrangement in their original "Anatomy of a hypertext search engine" paper.However, there have been papers published since that time that indicate that they can identify "boilerplate" or templated portions of pages, which does have an effect when portions of text are repeated across an entire site (as in near-duplicate detection), so it seems logical they'd be able to also identify the significant unique content on pages.

There are those who feel that CSS-P helps the engines identify the important content, while others believe that the engines have gotten sophisticated enough to be able to get around the issue. Just look at the papers that refer to spotting "footprints"; and all the engines have patents filed related to visual page segmentation.

A major problem is that CSS hasn't yet reached the point of providing a reliable way to use columns without hacks, and there can be cross-browser disasters using divs. I've actually seen the problems on sites of "pros" who write popular tutorials on CSS.

The question might be whether it "for certain" makes enough difference to warrant using multiple CSS hacks to avoid using the one hack in HTML. Tables are an HTML hack, nothing more.

Sure. My point is, the order in which content appears on a page's markup is important, and that CSS gives you more control over this than tables do.

ok very interesting. I have built many websites, all of which I use extensive styles but also use html tables which works very well for me. I will look into building full css sites, however I have never seen my sites which use html tables impact on search engine rankings. I have many sites that use tables that do more the outstanding in rankings.

I agree, tables are a hack, and if you are willing to write conditional comments ie:

1. <!--[if !IE]>-->
<link type="text/css" rel="stylesheet" media="screen" href="css/1.00.css" />
<!--[endif]-->
2. <!--[if IE 7]>
<link type="text/css" rel="stylesheet" media="screen" href="css/2.00.css" />
<![endif]-->
3. <!--[if IE ite 6]>
<link type="text/css" rel="stylesheet" media="screen" href="css/2.00.css" />
<link type="text/css" rel="stylesheet" media="screen" href="css/IE6Fix.00.css" />
<![endif]-->
Now conditional comments are a hack that said IE is a broken browser that needs to be fixed by Microsoft and not me.

The first one gives that CSS sheet to all the browsers but IE
the second to IE7 and
the third to IE6.

Granted you have to change 3 css sheets but it means I can use good standards based CSS for the 3 that support standards. CSS table layouts, perfermorce boost, advanced selectors - :before, :after but more importantly the use of DATA:, IE8 should support this but by which time the others should support nth-child(). So I'll probably just write a separate sheet for IE8, and a total re-work for the others.

Also I find this to be quicker than trying to re-work/design for the lowest dominator IE6 with in file hacks when there are a lot better techquies out their which I currently use.


I have many sites that use tables that do more the outstanding in rankings.
The main thing Google is concerned about is relevance. Do sites that have table layouts have less relevant data? No. Do Sites that have CSS layouts have more relevant data? No.

So TBH it doesn't matter in the grand scheme of things. But it does help with the things already said which helps your site a bit.

....and that CSS gives you more control over this than tables do.
That's not entirely true if you know the table trick, but overall it does.

I personally write my code the way it appears and use table-cell for positioning so again that is not possible when that is used due to it's on page positioning.

Jaza