Making the tables to CSS switch.

June 25th, 2006 by Shawn

I’ve always thought, as have and still do many others, that regular HTML with tables easily handled any website that I needed to build. I always thought that the 100% CSS crowd was an uppity club, a club that people simply wanted to join because it was the “in” thing to do. My arguments against completely using CSS was a) why fix what isn’t broken, b) CSS is much more restrictive than tables and most importantly c) from a business perspective, there is no financial advantage between choosing CSS or tables.

Well, after hiring a CSS designer and witnessing the birth and completion of an entire website in CSS, I can say that I was completely wrong. I am now a full supporter of 100% CSS layouts. And here’s the reasoning for it:

1. My bottom line. While most CSS designers are more expensive to hire than old fashioned table designers, I save money in the long run with the bandwidth I use. Short term pain (paying more for a designer), long term gain (saving more money every month on bandwidth).

2. My parents. My parents still live in the house I grew up in — which is in the middle of the woods. They’re unable to subscribe to a fast internet connection, so they’re still browsing around the web at ISDN speeds. When they call me and ask to see the new sites I recently built, I’d like to show them sites that load instantly. CSS drastically reduces the load-time on all connections.

3. Clean, easy to update code. Seperating code and content really does save a lot of time when updating a site — more time than you can ever imagine until you actually experience it.

Those are the three (3) main reasons for me personally — others have their own. Because of these reasons, as well as those not mentioned, are why my designers and my company only design 100% CSS sites from now on.

6 Responses to “Making the tables to CSS switch.”

  1. Chromate  Says:

    Interesting. To be honest, I still use tables despite buying numerous books on CSS. I run into problems probably due to lack of experience, and then just cop out and revert back to using tables.

    I guess I don’t see the effort required to use CSS effectively is balanced by the advantages. Yeah – I’m that lazy ;)

    I agree with all of your points and agree that it is better to use CSS if you know what you’re doing. But is it really that big a deal? Taking each of your points in turn…

    1) Bandwidth is so cheap I can’t imagine it really makes much difference unless you’re getting some serious traffic.

    2) Unless you have a really complicated layout, does it really make that much difference to load times even on slow dial-up connections?

    3) Again unless you have a really complex site, I don’t see problem updating stuff in tables, especially if you’re using a good template engine.

    I’m not disagreeing with your points at all, there obviously are advantages. Just not sure if it’s really a big deal. Though I can see real advantages in terms of accessibility with screen readers etc.

  2. Peach  Says:

    Good you finally took this step ;)

    I think I remember you making all these statements in favor of table layouts on sitepoint.

    Your GUI is also 100% CSS btw, or did you mean that site?

  3. Ken Barbalace  Says:

    Well Chris I’m glad you have been made a convert. Leaving tables for me was tough, but once I made that leap, I never looked back. With stylesheets I can deliver the exact same code to all browsers/Internet devices and let them choose which stylesheet they want to use. CSS truly is write once read anywhere.

  4. Chris  Says:

    You missed who wrote this post Ken. I love having CSS designs done… I just hate to do them myself.

  5. Ken Barbalace  Says:

    D’oh! I forget sometimes that you have multiple blog writers. I’ll have to pay closer attention to who wrote each post.

  6. Jen  Says:

    I just redid my site, replacing tables with css code. It was tricky as it was all new to me, but it looks much better now. ALso so much easier to edit.

Leave a Response

(Email field must be filled in)

Top of page...