CSS or Table Layouts more SEO Friendly?

This is such a common question (from other web developers) that Google’s Matt Cutts weighed in.  Although we don’t usually disagree with Matt, in this case we ABSOLUTELY do!

For those of you who don’t know the difference, CSS-based layouts use a Style Sheet to set widths, heights, alignment and more for a series of <span> and <div>.  Table-based layouts are when developers use HTML tables (lots of <td><tr>) to set their layout options.

So besides the very angular and customizable nature of tables (from a design point of view), tables are not  SEO-friendly.  Here’s why.

Very Low Content-to-Markup Ratios

Search engine spiders REALLY do not want to sift through 1000 lines of useless HTML to get at your 1 paragraph of actual content.

Unlike CSS layouts, tables require a tremendous amount of extra code to achieve modest styling.  Nesting tables (or putting tables, inside of tables, inside of tables) increases that already off-balance ratio exponentially.

Loading Speed Matters

According to Matt himself, site loading speed matters.

The faster loading site is rewarded while the slower loading site will not.  Websites with table-based layouts require the user’s browser to parse the entire page on each and every load.  A CSS-based website allows the user to cache the style sheet on the first visit and never load it again (depending on the expire headers, of course).

Still not convinced that CSS-based layouts are better (in more ways than one) than Table-based?  Comment your table-love below.