Why are tables bad?

[WebNinja]

Why are some people so negitive about tables? What makes them bad? What's up with the <div> tag?

[moojoo]

Tables are used for tabular data, or should be. The goal/idea is to separate design from content. Using tables you are mixing your markup in with layout elements i.e. using tables to control the page display. This leads to more difficult to manage code, heavier pages and can affect accessibility.

The preferred method is to use CSS to control your design and layout while keeping your HTML/xHTML lean and clean instead of using tables you would do something like:

<div id="container">
<p>This is body text...</p>
</div>

vs

<table>
<tr>
<td>This is body text...</td>
</tr>
</table>

id="container" will call an ID from your external CSS style sheet and tell that div how to behave. Makes for much more effective presentation and such. Based off of the two examples you can immediately see the difference in the amount of markup required. Using external CSS also allows for instant site wide changes to any element just by modifying a single file. Also using divs/css you can have full control over screen and print output. Tables not so much.

[WebNinja]

Are there any advantges to using tables for design? I can think of a few but <div> may be able to do it better. I don't know <div> yet.

BTW, I like how you used the word tabular (arranged or displayed systematically in table form).

[snow]

pages can become very convoluted and difficult to edit & develop once you have layers upon layers of tables...

Here is the most entertaining site I've found to explain it:
http://www.hotdesign.com/seybold/

[Ryan Fait]

Tables are easier and more browser friendly to design with, to be honest. But then again, it would be easier to put up a tent than to build a house. Which one would you rather live in? Separating content from presentation is good for accessibility, SEO and management. Down with tables (for design)!

[WebNinja]

Okay, that makes sense to me. What about tables for design is bad for SEO?

Thanks

[Ryan Fait]

Content to keyword ratio is quite important. Tables require much more inline code than CSS driven sites do.

[karinne]

A better way to build your website
Why tables for layout is stupid: problems defined, solutions offered
Ten ways to speed up the download time of your web pages
Nested Tables: About the (ab)use of tables as layout tools in webpages.
Why Tables Are Bad (For Layout) Compared to Semantic HTML + CSS
Why go table free?
Why avoiding tables (for layout) is important


All those links were taken from the stickied thread Resources for learning how to use CSS for layout in the beginners resources section. In thread thread ... have a look at the links in the "why" section.

[daygon]

I had a post about this here while back.
Her it is http://www.webforumz.com/html-forum/...ike-tables.htm

[majo323]

There is nothing wrong with the table element at all. With the DOM it is possible to work with rows/cells as good as with div elements and tables are necessary if you wosh to dynamicaly accomodate the width/height of the layout.

-------------------
Malware blog project

[karinne]

^ We're not saying there's anything wrong with the table element. But if you used in a matter that it should ... then there's a problem. If you're using table to help you with your layout, not good. If you use for tabular data ... very good

[moojoo]

Originally Posted by majo323

There is nothing wrong with the table element at all. With the DOM it is possible to work with rows/cells as good as with div elements and tables are necessary if you wosh to dynamicaly accomodate the width/height of the layout

Same with divs, in fact probably as easy if not more so. At any rate tables were never intended for layout, they just happened to be a solution at a time when that was the only acceptable method. The days of tables for layout are over and CSS/XHTML is now the standard. I am not anti-table but I am against the abuse of tables which is all to common in novice web design/dev.

[daygon]

Tables were more of a 90's thing back when css wasnt that well known. Yes its easier to work with but its less appealing to the eye and if you have images it has to be a fixed size so it dosent distort you page and make it look horriable. With css the layout expands with the users monitor settings. Yes tables do that to but if you have images you get the problem that i just stated. CSS also helps with those website thieves that want to mock your site make it have a more difficult time to mock it. All they really get is your info and not your layout (in your using external css), unless they know how to get to it.but if thier noobs trying to rip your site off and call it thier own then it makes it harder. My thing is trust the experts and dont ask questions or people look at you like your stupid. That just what i learned.

[Daniel]

im doing web dev. in my course and they teach us to use tables - bloody annoying cause i know we wont ever use them

[daygon]

Yeah im sorry dan its a lost cause. You know how trends come back around. Just wait... you keep doing tables you'll be the cool guy again yet.

[mreine]

What really makes me mad is so many of the tops sites for many different searches are, of course, table designs.

When are these relics going to start taking second place? Seems all of our efforts to comply with these better css/xhtml techniques are going unnoticed.

I'm guessing it's a matter of them being around a lot longer, but why should that really matter? That would be showing preferential treatment in a situation that should be completely unbiased.

[Lchad]

Snow thanks for that link! I learned a lot! They did such a cute job of making their points!

[Ryan Fait]

I agree with you mreine.

Search engines definitely show preferential treatment to those sites that have been around longer. I've got a site with nothing but a single link to my current site on it. It still turns up in search engines fairly high for the content that used to be on it (8-10 months ago). It's so ridiculous.