CSS vs. Tables, advantages of CSS layouts

Why CSS is better than Tables?

CSS vs. Tables

There have been many articles written regarding CSS based design versus Table based design. Here are a few advantages of CSS layouts:

1. You don’t need to worry about nested table tags when you use CSS (Cascading Style Sheets).

2. CSS is very flexible in positioning elements in website pages.

3. CSS based pages load faster than Table based pages. It may take similar time to load CSS based page at first. But once included CSS file is cached to the browser, subsequent pages load faster than regular Table based pages.

4. Using external CSS files makes web pages lighter. This is beneficial to search engines in two ways. Using external CSS files means using less Table tags in web pages. Lower HTML/text ratios attracts search engines. Also, lean pages are certainly a big advantage because major search engines like lean pages. (Yet remember, content is more important than the back end coding style, but if we can improve it even a little, it’s worth to try.)

5. It allows main content to display first than images.

6. It’s easier to change the look of the whole web site. You just need to change CSS files to change colors, background images, positioning or fonts. With table based layout, you have to modify individual pages.

1. CSS could be challenging to learn. It might take time to grab concepts of priority, grouping and inheritance between ID and class selectors. But it could be lots of fun to learn it.

2. Although it’s getting better, there is still an issue with browser comparability. Table based layout also have this problem. But this problem occurs more often with CSS than with Table tags.

As many designers and SEO experts agree, it’s highly recommend to use CSS based layout, rather than Table based layout.

1 Comment

  • By diseño web peru, February 4, 2010 @ 10:58 pm

    The one that continues using tables is because it does not dominate or does not know CSS. To design in CSS is far better, by the subject of order, maintenance, accessibility, navigability and thousand reasons more.

Leave a comment