Are tables as bad as they say?

[cashblogs]

Hello to all members

I've been into web designing for almost a year, as you all know I stil have quite a bunch of things to learn but what is it with the whole table vs css thing.?

What exactly makes one better then the other. I've seen lots of websites using tables and they look great and seem to display fine.

Thanks for the support

[Pasquale]

TABLES suck. If you want to change things, you have to work internally, and if you want to move crap around everything just breaks. Css is soo much cleaner, and you can swap them around to change the look on the fly.

Tables are only going to make your life miserable.

[chrisclick]

^ agreed. tables SUCK

[senocular]

Tables are fine ;P They've just been abused in the past, especially by products like ImageReady and Fireworks and tools that generate layouts through algorithms using tables. They tend to create complicated nesting schemes and use workarounds that make editing their content by hand very difficult. This in turn made developers inheriting projects which used this technology very upset because it created a lot of extra work for them.

You shouldn't avoid tables. Use them where you need them. However, you generally have more flexibility when *laying out* your overall design without tables, instead using CSS to position DIVs and other block elements as necessary. This makes your site a little easier to edit when you (or someone else) comes back to it at a later time (and generally leads to smaller source pages which can also help with bandwidth).

People tend to take these ideas to the extreme and tables get an overly bad rap for it when they're not really as bad as everyone makes them out to be.

[fasterthanlight™]

^ Agreed,

Tables are awesome when used for their intended purpose: Presenting data, but even then for tables to be effective, all styling needs to be stripped away and done with CSS.

[Abus]

I employ 2 workers;

Table Based Design and Tableless Design

Table Based does the job for 50$/hour at 15 hours and it gives me poor future support.

Tableless Design does the very same job for 5$/hour at 3 hours and it gives me great future support.

I hope this example makes the power of tableless design clear.

If you ask why it is powerful check this presentation at

http://www.stopdesign.com/present/2004/ddw-seattle/tables/?no=1

[REEF·]

I believe tables are actually cool if you dont hard-code it by hand, so you can go back to it later and use something like dreamweaver to edit it for you and you wont run into trouble. Hear me out though: I think tables are just fine so long as you dont overwhelm the nesting and keep them to minimal use.

I use css from now though, I dont know how it works but it's just damn awesome :h:.

[DDD]

I use tables when the client doesnt have enough $$$ for a CSS layout...

[chriskalani]

I use tables when the client doesnt have enough $$$ for a CSS layout...

Personally I am much quicker at CSS than anything else, so I don't know if that is valid. Tables are trouble and cause more work and heartache.

[senocular]

Personally I am much quicker at CSS than anything else, so I don't know if that is valid. Tables are trouble and cause more work and heartache.

I (personally) have never found that to be true and have found myself in situations similar to that explained by DDD.

[Jeff Wheeler]

This is my favorite presentation on the subject, and it sums up my views quite well: http://www.hotdesign.com/seybold/

Doug Bowman's (linked above by Abus) is also quite good, and essentially says the same thing.

[fasterthanlight™]

Well I don't know about the whole "Not enough money = table layout for you!!" thing, I mean, I have standards (however low they might be :P ) for my work, and I don't view producing a layout made with tables as a finished, presentable piece... Maybe for a quick composition for the client to have a gander at... but even still, thatd be doing a whole bunch of unneeded work!

[senocular]

then be thankful you haven't been in situations where that has been necessary for you ;) At the last company I worked at, I was the only developer so I had to have priorities and spend my time wisely. The company often had obligations to partners and things of the such where work needed to be done at little or no price when I had little or no time to do it. Then, assuming the client wasn't one of high importance (which was often) they'd end up with a simple Fireworks-outputed table-based web page. Most of the time I didn't even have to touch Dreamweaver (depending on the content).

[fasterthanlight™]

^^ True enough......

I work at a web dev company that provides online job certification courses partnered with uni's in the states, and the dude who had my job before me didn't know jack about css + tableless development, and so, my job is to recreate allllllllllllll their sites (which is a fark load btw) with proper CSS and divs.

Long story short: I hate tables!!! Sometimes I don't have to remake the site, I just have to add a chunk here, remove a chunk there, and tables really really makes that painful. (He was also a fan of hard core nesting too... :S )

[DDD]

then be thankful you haven't been in situations where that has been necessary for you ;) At the last company I worked at, I was the only developer so I had to have priorities and spend my time wisely. The company often had obligations to partners and things of the such where work needed to be done at little or no price when I had little or no time to do it. Then, assuming the client wasn't one of high importance (which was often) they'd end up with a simple Fireworks-outputed table-based web page. Most of the time I didn't even have to touch Dreamweaver (depending on the content).
this is so true and a side effect of knowing what tool to use for what job. I have been involved with really complex layout schemes and it just was not feasible considering time and money to use css to work out alignment issues. And for some reason I can still make a table based layout cross-browser easier than a css one. But I guess that is my old school roots. Not saying CSS is evil or over-rated. You really just have to learn to gauge your time and priorities. Is it more important for the client to have what they need on time? Or for you to get you Junior Woodchuck Badge for CSS?

I end by saying tables in the right hands can be a good thing.

[thats all folks]

DDD & Sen,

Nicely said!!!!!!!!!!!!!!

[simplistik]

I'm confused. First... CSS relates to "table" design and "tableless" (DIV) designs. Just cause you use tables doesn't mean it's any harder to modify than a tableless one assuming you first KNOW your code, and then secondly code properly. I definately don't agree with the, doing a "table" design based on time and/or money. It's quite as easy to do a "tableless" design as it is a "table" based one, it's all based on what you're more comfortable with.

But the quick answer to the first question on the advantage is the code reduction. In the time it takes you to create ONE area in a "table" based design I will have made about 10 from a DIV based one. Reducing load times by millionths of a second. For a table you have...


<table>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>

to get that same result using DIVs all you need is


<div>
</div>

Also... in a table you put your content in that <td> right... well the only way to move that <td> is to move the table too... so if you have say... 5 <td>s in one table you'll have go out of your way to structure a whole nother table JUST for that one <td> as far as the CSS is concerened... that should never be a factor in deciding whether or not to use tables or not.

Tables should be used for tabular data.

[seth.aldridge]

I would say there about the same as far as time goes for me. I prefer tableless, however I have worked in quite a few places where they didn't know how to do tableless designs and after I left they accused me of "screwing up" all the work I did because they didn't understand it.

However tables can be used and should be used if your are presenting tubular data.

http://www.duoh.com/csstutorials/csstables/

That is a great example of properly using tables.

Here is the way I look at the whole thing. If you're not worried about standards or accessibility then it's not really an issue. There are a ton of elitists that will tell you table based designs are "wrong" but I would say as long as your client is happy and the site works cross browser then they you've done an okay job. I personally like the challenge of working in pure css and like how a site looks with no style when its been set up right...but that is the nerd in me.

[Abus]

I just want to add another example like Simplistik did above.



<table>
<tr>
<td>
Sample 1
</td>
</tr>
<tr>
<td>
Sample 2
</td>
</tr>
<tr>
<td>
Sample 3
</td>
</tr>
<tr>
<td>
Sample 4
</td>
</tr>
</table>


but there are tags called <ul> and <li>



<ul>
<li>Sample 1</li>
<li>Sample 2</li>
<li>Sample 3</li>
<li>Sample 4</li>
</ul>


:dog:

[Jeff Wheeler]

Personally, I couldn't code a table-based layout if I wanted to. I use tables so rarely that I don't know anything beyond the table, tr, td, and th elements. :P

I just look up the syntax for others as necessary...

[DDD]

Abus that is the most rediculous sample. No one would use a table instead of a list in either case...lol.

[senocular]

Yeah, really - that example screams AJAX

[Jeff Wheeler]

Screams AJAX? How? :huh:

[DDD]

Screams AJAX? How? :huh:
Because it needs cleaning

[Jeff Wheeler]

How does the fact that it needs cleaning (like all table-based layouts) mean it screams AJAX? :huh:

Most AJAX is super-clean, and most AJAX developers follow web standards with tableless layouts. :-/

[senocular]

Come on guys! it was a joke :crazy:

[fasterthanlight™]

http://images.google.ca/images?q=AJAX%20cleaning&ie=UTF-8&oe=UTF-8&rls=org.mozilla:en-US:official&client=firefox-a&sa=N&tab=wi

sheesh

[DDD]

:lol: @ NoKrev

we officially need a NoKrev smilie now for this one

[senocular]

Obviously I can't skim and get meaning at the same time - touche :)

[Peter71]

I think it just depends on what content you have. One thing I do like about tableless designs is that if I have to make a template page or switch from two column to three column layout, it is pretty easy.

For me, the difference is:

TABLES: Lots more image cutting, lots more HTML but easier control in certain situations. Especially if you are sloppy like me and use colspans. I worked for a company that used to get on my case all the time for colspans (they said if I knew what I was doing, I would never need them. Hence the term "used" to work for them...).

CSS: Less image cutting, less time updating or redesigning the site, way more (for me) upfront time. I try to make everything work on all current browsers and IE6, and sometimes that is hard. Especially with Safari (lucifer) and IE6 (Bealzabub). I also don't know all the short cuts and fixes, so that makes things a bit harder from time to time.

HYBRID: I do this a bunch, if the data or content makes it easiest. I do all styling with CSS (as someone said before) and then I use tables when I need to arrange data or images and my pea brain cannot think of a better way too quickly.

Of course, if I have all the time in the world, I try and just use CSS. I like it better and whenever I go back to that site to repair things, it is 10x easier!

Anyway, those are my thoughts. The one thing I can say for certain, is that most of this debate is just opinion. There are advantages to both, but ultimately it is up to you to design and/or code the site, so you have to do it the way that works best for you. I would say always try and learn different ways to accomplish a goal. It will make you more well rounded and if you are ever handed off a site that has messy or obscure code, you have a better chance of figuring it out. Trust me, the first time I was sent a tableless design, I about pooped my pants. It was like reading hyrpglyphics. Now it is my primary dev/design tool...

[bwh2]

i'm as much for css layouts over table based layouts as anyone. but with one note: way too many people rant and rave about how CSS layouts are lighter, but then have severe cases of divitis. man, that gets on my nerves.

[simplistik]

i'm as much for css layouts over table based layouts as anyone. but with one note: way too many people rant and rave about how CSS layouts are lighter, but then have severe cases of divitis. man, that gets on my nerves.
Well more code does = more load time. but yea... millionths of a second is absolutely nothing.

And on another note... table based layouts are css layouts too... just an FYI ;)

[bwh2]

And on another note... table based layouts are css layouts too... just an FYI ;)well, i think you can differentiate the two. but i've ranted about that before and it's just semantics anyhow.

my point was that people rant about the benefits of non-table based layouts and then proceed by throwing a thousand divs on a page. that's just reckless.

[Esherido]

My view of it is, whichever works the best for what you're doing is what you should use. If you just want to display tons of data and info in an orderly fashion, then definitely use tables. But if you're trying to create a flexible layout then you want to you div's. But never go overboard with them, either it be tables or div's the minimum is the best, it's better to use 10 div's with some complex margin and display attributes than 100 div with varying height and width attributes because the less elements you have, the easier it is to manage them and the more flexible your layout becomes.

[Tudor.b]

Use CSS and semantic markup for the layout of the page, and use tables when you must display some tabular data. Read more about this here (http://www.it-base.ro/blog/posts/css-and-xhtml/in-defence-of-xhtml-tables.html).

[Esherido]

"tabular" data? :lol:

[fasterthanlight™]

I don't get whats so funny. Tabular data is what its called, its a real word......

[thebloodpoolkid]

When I first began web development I used tables as basis for my layout. I knew nothing about CSS and what it was. Years later I discovered CSS through many different mediums and now I would never consider going back to a table based layout. In my opinion tables should be used for tabular data only.

I recently read an article where the person responsible for introducing table-based layouts, David Siegel, regrets he ever did so.
Here is a link to the article titled “The Web is Ruined and I Ruined it”
http://www.xml.com/pub/a/w3j/s1.people.html

[fasterthanlight™]

^^Fun read, my eyes burn now though, apparently he hasn't heard about

line-height: 13pt;

[Esherido]

And apparently he also hasn't heard of "font-family: Arial;". ;P

[fasterthanlight™]

well, he IS a terrorist...

[thebloodpoolkid]

I am sure he has but the site xml.com has not. That is not the author of the article's web site. The authors web site is found here http://www.dsiegel.com/