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

Question

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 amou

Answer 1

:: nods at palmsey and Jon Galloway ::

I agree with the maintainability factor. It does take me a bit longer to get my initial layouts done (since I'm still a jedi apprentice in the CSS arts) but doing a complete revamp of a 15 page web site just by updating 1 file is heaven.

Answer 2

Using semantic HTML design is one of those things where you don't know what you're missing unless you make a practice of it. I've worked on several sites where the site was restyled after the fact with little or no impact to the server-side code.

Restyling sites is a very common request, something that I've noticed more now that I'm able to say "yes" to instead of try to talk my way out of.

And, once you've learned to work with the page layout system, it's usually no harder than table based layout.

Answer 3

In the real world, your chances of taking one design and totally reskinning it without touching the markup are pretty remote. It's fine for blogs and concocted demos like the csszengarden, but it's a bogus benefit on any site with a moderately complex design, really. Using a CMS is far more important.

DIVs plus CSS != semantic, either. Good HTML is well worthwhile for SEO and accessibility always, whether tables or CSS are used for layout. You get really efficient, fast web designs by combining really simple tables with some good CSS.

Table layouts can be more accessible than CSS layouts, and the reverse is also true - it depends TOTALLY on the source order of the content, and just because you avoided tables does not mean users with screen readers will automatically have a good time on your site. Layout tables are irrelevant to screen reader access provided the content makes sense when linearised, exactly the same as if you do CSS layout. Data tables are different; they are really hard to mark up properly and even then the users of screen reader software generally don't know the commands they need to use to understand the data.

Rather than agonising over using a few layout tables, you should worry that heading tags and alt text are used properly, and that form labels are properly assigned. Then you'll have a pretty good stab at real world accessibility.

This from several years experience running user testing for web accessibility, specialising in accessible site design, and from consulting for Cahoot, an online bank, on this topic for a year.

So my answer to the poster is no, there is no business reason to prefer CSS over tables. It's more elegant, more satisfying and more correct, but you as the person building it and the person that has to maintain it after you are the only two people in the world who give a rat's ass whether it's CSS or tables.

Answer 4

Some additional reasons why this is good practice:

• Accessibility - the web should ideally be accessible by all
• Performance - save bandwidth and load faster on mobile devices (these lack bandwidth to some degree and cannot layout complex tables quickly). Besides loading fast is always a good thing...

Answer 5

i actually can see Tables in Stack Overflow on the user page.

It even has heaps of inline styles...

Answer 6

One other thing I just remembered, you can assign a different stylesheet to a page for printing vs. display.

In addition to your normal stylesheet definition, you can add the following tag

<link rel="stylesheet" type="text/css" media="print" href="PrintStyle.css" />

Which will render the document according to that style when you send it to the printer. This allows you to strip out the background images, additional header/footer information and just print the raw information without creating a separate module.