Is there a business reason for striving for pure CSS layout?

Tags: css

It seems like every time I try to create a pure CSS layout it takes me much longer than if I'd use a table or two. Getting three columns to be equal lengths with different amounts of data seems to require particular fancy hacks, especially when dealing with cross-browser issues.

My Question:

Who are these few tables going to hurt?

Tables seem to work particularly well on tabular data — why are they so reviled in this day and age? has a table in its source code, so do many other sites ( does not by the way).


If you have a public facing website, the real business case is SEO.

Accessibility is important and maintaining semantic (X)HTML is much easier than maintaining table layouts, but that #1 spot on Google will bring home the bacon.

For example: Monthly web report: 127 million page views for July

Monthly web report: 127 million page views for July

... keeps getting better at SEO (search engine optimization), which means our stories are ranking higher in Google and other search engines. We are also performing better on sites like All that adds up to more exposure and more readership than ever before.

If you look at their site, they've got a pretty decent CSS layout going.

Generally, you find relatively few table layouts performing well in the SERPs these days.

By : Dave Ward

There definitely is. If you are still striving for it, you are not getting it right.

DIV+CSS layout is actually much easier than table layout in terms of maintainability and productivity. Just keep practicing it before it's too early to say that.

Table layout is good too it's just not meant for layouts and have exceptional drawbacks when it comes to minor tuning.

In my experience, the only time this really adds business value is when there is a need for 100% support for accessibility. When you have users who are visually impaired and/or use screenreaders to view your site, you need to make sure that your site is compliant to accessibility standards.

Users that use screenreaders will tend to have their own high-contrast, large-font stylesheet (if your site doesn't supply one itself) which makes it easy for screenreaders to parse the page.

When a screenreader reads a page and sees a table, it'll tell the user it's a table. Hence, if you use a table for layout, it gets very confusing because the user doesn't know that the content of the table is actually the article instead of some other tabular data. A menu should be a list or a collection of divs, not a table with menu items, again that's confusing. You should make sure that you use blockquotes, alt-tags title attributes, etc to make it more readable.

If you make your design CSS-driven, then your entire look and feel can be stripped away and replaced with a raw view which is very readable to those users. If you have inline styles, table-based layouts, etc, then you're making it harder for those users to parse your content.

While I do feel that maintenance is made easier for some things when your site is purely laid out with CSS, I don't think it's the case for all kinds of maintenance -- especially when you're dealing with cross-browser CSS, which can obviously be a nightmare.

In short, your page should describe its make-up in a standards compliant way if you want it to be accessible to said users. If you have no need/requirement and likely won't need it in the future, then don't bother wasting too much time attempting to be a CSS purist :) Use the mixture of style and layout techniques that suits you and makes your job easier.


[EDIT - added strikethrough to wrong or misleading parts of this answer - see comments]

By : OJ.

This video can help you solving your question :)
By: admin