Heal Your Church WebSite

Teaching, rebuking, correcting & training in righteous web design.

Tableless is the way to go …

… at least that’s what Kevin over at the Random Trout says.

The day before yesterday I threw out as a resource, a site that offers several “tableless” designs for your (church) web site — forgetting my own rules about church-speak, or in this case, geek-speak. A plank in my own eye, pointed out by Joey over at the Calvary Baptist Church of Smyrna when he commented:

What are reason for going with tableless design? I’m not familiar with the topic.

Good question. Fortunately, while I was busy with the day job, Kevin replied with a very simple, and in my opinion, a very sound technical basis for not using <table> tags to layout your web page, where he commented:

Tableless is the way to go. Some reasons for doing tableless are:

  • You seperate content from layout. Your content is in the HTML. Your layout is all in the CSS.
  • Re-designing only involves re-doing the CSS, you don’t have to touch the HTML, because the HTML is just content, not layout.
  • Using CSS for layout helps clean up the HTML. A lot of HMTL layout involves putting tables inside of tables inside of tables inside of tables . . . You get the picture. Very messy.

In other words, using Cascading Style Sheets (CSS), you can present your compelling content on your (church) web site without polluting your data a mess of <table>, <tr> and <td> tags.

Of course, like any new-fangled improvement browser technology, there is the risk of shooting your foot clean off. A sentiment reflected in this email I received some time ago from a reader when discussing the tableless CSS templates offered over at Glish.com:

Yes, but…I don’t want to spend my life trying to make sure it works. E.g., I used to have a tableless CSS version of my site — looks just like the current one and it worked great in NS 4 — until you resized the window (same problem, I believe, in Mozilla — and it couldn’t be fixed with the usual [Javascript] hack).

That said, I still insist you click on over to the Random Trout and check out what Kevin has to say on this topic!


  1. So, isn’t CSS just a way of creating a page template?

    Isn’t that what DreamWeaver is doing for me on my site already, in a way? Neither CSS or tables are perfect, but for the average web-servant, isn’t it better to use the tools you have than try to learn more technical stuff? The more technical the site is made, the more at risk it is, IMHO.

  2. I’ve been trying table-less designs for a while, and generally I agree with all the good reasons above. There is nothing more pleasing to the eyes than the clean HTML code with contents wrapped in meaningful tags! However, with complicated layouts, it is still necessary to put in a lot of CSS hacks to make it working on all different brands of browsers. And sometimes you *do* need to change the HTML in order to achieve the layout/visual effect you desire, for example wrapping an extra DIV, etc. At the end it really defeats the purpose – something can be easily done with table will require lots of hacks with DHTML and CSS.

    However, at the same time you can argue the other way – sites that require so much complicated layout should instead concentrate on their *content* – because that’s what the web is for :)

  3. My new site will be entirely tabless when I finish, however it’s taking me about 5x the time a normal redesign would take sinmply because of IE 5 NN4 and countless other out of date browsers!
    Php redirects are the way forward I fear

  4. What about XML? With XSLT, could you design a web site that separates content and layout completely by storing all the content as XML?

  5. I tried going the tableless route. I now have a design that requires a 400 line CSS file and looks great only in the latest browsers.

    I’m on a tight schedule. I don’t have the time to create additional style sheets for older browsers. I don’t have all the browser/os combinations handy that I have to test on.

    And no, I can’t just forget about the the 10% of Netscape 4 traffic, being a church site I have to be more accomodating than that.

    And the kicker – I’m using pMachine to drive the site. pMachine is a database driven (php/mySQL) blog tool – meaning that my content and presentation will be seperated no matter what.

    So phooey on it – I’m going to eat the .CSS design costs and go with tables! 99% of the people I’m building the site for won’t know the difference.