Tables vs. CSS

at 09:44 on 09 February 2006, chris wrote:

if you ignore people like this they go away.

I see these people all the time. the "i've been doing web design since '93 so I must be right and better then you"... forgetting of course that things move on and people who are too stupid to learn CSS (come on it's easy) will have to find another job.

look at any web design job right now and CSS is a must have skill.

at 11:14 on 09 February 2006, revision d wrote:

Erm, what valid points? His points are as valid as his code.

at 11:47 on 09 February 2006, Sepherenia wrote:

Oh for goodness's sake, someone seems to have missed the 'use tables for tabular data' part of learning how to code semantically.

Also, am I the only one who's never heard of this CSS-P before?

at 11:50 on 09 February 2006, stu wrote:

CSS-P just means CSS Positioning (i.e. not using tables to position elements). The site reads like it was written about 3 years ago and the writer just comes across as being bitter.

at 12:55 on 09 February 2006, Pete wrote:

He does sound very bitter doesn't he!

Anyway, I thought the idea was that, the Consumer controlled the market. Hence if nobody designs for IE then people will have to use a different browser...

</wishful thinking>

at 13:02 on 09 February 2006, Luke Redpath wrote:

This is a few years old and the guy is just bitter because he sells crappy Dreamweaver plugins that output terrible code and that is supposed to be some kind of ill-informed justification.

at 15:25 on 09 February 2006, Jim wrote:

This is all OK, but taking a balanced view of this, all the objections to the guy's article are personal attacks (ie 'he is just bitter'), rather than demonstrating the flaws in his article.

Also, how does it look like it was written years ago? Sorry, I missed how that works - he makes reference to IE 7 - and makes valid points about design for the real world, rather than expecting everyone to re-code all their sites (and expect their clients to foot the bill), when the box model hack won't work and their site looks screwy... how does/will that work in a commercial world exactly?

at 15:37 on 09 February 2006, G3 wrote:

Yeah, pageweight! the whole table vs css debate aside, better optimization using css, includes, and image optimization help make content more deliverable for the user.

I just did an experiment on this for school

css and tables versions. The css pages were a mere 4kb vs table at 12k each.

Total css site was 300+kb vs nearly 800kb for tables. This was a site with only 4 pages.

CSS would clearly have the advantage on a larger site with more content.

oh, the contact pages won't process. I'm not worrying about those...

at 15:44 on 09 February 2006, Veracon wrote:

Valid point: The division (div) element is stupid and should be avoided.

Otherwise, I strongly disagree. I definitely don't see how tables follow KiSS; they're much, much more complicated to me.

at 16:44 on 09 February 2006, Jim wrote:

Tables are predictable. I'm still concerned about the lack of future-proofing that pure CSS-only sites provide. How can business survive if you're going to be constantly re-working sites whenever a browser/update is released? Surely a hybrid tables/CSS method is the best way. You're then using the best of both worlds - and no hacks. Surely the underlying concept of hacks means that they should be avoided... I'm worried that a lot of design companies will get their fingers burnt when IE7 ships.

at 18:04 on 09 February 2006, Nick Toye wrote:

Ok, Tables are a cheats way of creating layouts. Tabular data people. Thats the bottom line.

Personally I found it more easier to learn CSS than layout with tables. It made more sense. Because it is semantically correct.

This guy makes no valid points whatsoever, and to say that Web Standards are useless, is he stoned? Its like buying a car from some 4th rate kitcar manufacturers who use dodgy parts.

Also many people are using IE hacks in a seperate css file, so when they are not needed they just delete the link. IE7 will be a way off yet, even when it ships its going to take a while to fully integrate into society.

at 19:22 on 09 February 2006, Jim wrote:

Tables aren't a cheat's method of creating websites. They have their place. It's actually easier to look at hacks as cheating, because you actually are cheating the browsing mechanism. Back in the day, the WWW wasn't designed to be the medium that it's become. Things evolve - 'semantically correct' or not. It's the line of least resistance in many cases - ie, if it's easier to create a page using CSS/table hybrid, more reliable and less dependent on browser manufacturers' whims, then you can't blame people for doing just that. It makes logical sense. There seems to be an ivory tower concept underlying this whole CSS-purist belief; in the real world it doesn't stand up.

What are the point of standards if the standards agency (W3C) seemingly has no teeth - the 'standards' are actually recommendations and there is no penalty for non-adherance to them... a green light for browser manufacturers to pick and choose which standards/parts of standards to accep

at 19:24 on 09 February 2006, G5and10 wrote:

Seems like the only people who are bitter are the ones accusing those of being bitter.

None of the reply comments here invalidate any of those guys arguments to begin with as they don't even present an argument to begin with. they just say, "He's wrong" and that's it! wow such savvy for someone who spends all day at Starbucks!

As far as I am concerned, the article is a great spoof on css zeolots just like the Europeans cartoons on the Islamic zeolots, Islam religion, Muslims and Mohammed.

You guys need to get a J.O.B. an actually see what's going in the real world instead of sitting at Starbucks with the latest css book written by authors who they themselves sit aroung writing books and articles all day instead of actually working for someone.....

It just sounds just like all those other FINGER POINTER out there who need to get a J.O.B. in the real world.

at 19:31 on 09 February 2006, Nick Toye wrote:

Because, tables are for tabular data, not layout. End of argument.

Also hacks are a must because of a certain browsers lack of support for web standards. Standards endorsed by the W3C.

End of argument.

I have a job in the real world, I make good money by producing good content for good clients. Those who ask me to develop a site using old methods dont pay the money, so I have no problem.

I'm afraid those who feel that table-based design is the best way to go, are sadly mistaken, and are very much in the minority. When was the last time that you saw someone endorse table-based layouts at any of the major Web Conferences?

at 19:34 on 09 February 2006, Nick Toye wrote:

Oh and i'm sure Eric Meyer, Dan Cederholm, Jeremy Keith, Jeffrey Zeldman, Andy Budd all have jobs, or J.O.B.S as you put it. Care to share what you do?

at 19:50 on 09 February 2006, Jim wrote:

End of argument.

Well, obviously, that's the way to end a discussion in your favour. It's a shame they don't use that method in the real world. oh, wait a minute... they'd get laughed out of the room!

'Tables are for tabular data'. OK, I don't know if you're from a design background or not, but grids play an instumental part in layout design. Grids are tabular. Where you decide to draw the line is up to you, but it's a blurry line. It's a more convincing argument than the polar opposite: 'Also hacks are a must because of a certain browsers (sic) lack of support for web standards'. So what? You work with what you've got. Hacks are merely sticking plasters, not a be-all-and-end-all solution.

CSS has its limits. It can work together with tables. It doesn't seem sense to say 'tables are wrong for layout. Hacks are right'. Tables aren't likely to get removed from IE7. The box model hack on the other hand...

IE7 may take a while to propagate, but has a

at 19:52 on 09 February 2006, Jim wrote:

...huge market share. Sorry, ran over my 1000 chrs!

at 20:03 on 09 February 2006, real worlder wrote:

I don't use tables at all for layout and build large, corporate websites all day long. And they even work in IE! I know, it's a miracle but if you're smart enough you too might be able to do it.

Lovely site design the dumbo has btw. lol.

at 20:22 on 09 February 2006, Jim wrote:

Good for you! They even work in IE? Fantastic!

But wait a moment... what about IE7? Not so long from now you might be working all day long to fix all your large, corporate websites... are your large corporate clients going to be happy to pay you to do that when their competitors don't have to? Seems like sense to me. You must be very proud. Well done you.

Hacks are great, aren't they?!?

at 20:41 on 09 February 2006, ber wrote:

this guy hates change. he's basicly refusing to learn a new and better way to code.

i mean, how can you say that css code is less readable? i mean i look at some old pages with all the tables and gunk and that shit is spaghetti. it hurts my brain to try to wrangle where anything is. versus nice clean ordered content with css.

can you imagine what the world would be like if we all refused to change and adapt our skillset to new technologies?

whatever, this guy is so stuck in the past it's pointless to argue with him.

at 21:18 on 09 February 2006, Jim wrote:

It's not pointless to argue. If I was stuck in the past, would I be on Stylegala trying to make sense out of the purist-CSS theory? I was hoping to be convinced, but now I'm kind of getting a 'it's pointless to argue' line. I'm open-minded, I'm just using logic to work out the way I should head forward with the way I build sites. I'm bothered about all this, I was hoping to be convinced. Now I'm leaving the board feeling less and less convinced. No-one has laid down a proper watertight argument as to why you shouldn't use tables and use pure CSS. I'm looking from real-life experiences. Things mess up on browsers when they never used to. Blaming a browser is pointless, it's out there and in use. Surely the thing that can change is the code. Logically, that should fit the browser, not the other way around, regardless of these woolly 'standards'.

at 22:11 on 09 February 2006, David B. wrote:

I aggree with Jim. these purist attitudes have got to go away. I myself just jumped on the CSS boat and i totally understand the need for standards now, and if you look at my site you will see that i have put my best foot forward, but the attitudes that you all are displaying for the most part of the people who disaggree are horrible, you would think ( and i would like to think otherwise ) that this was a room filled with children.

Intelligent comments are the only way to convince someone that their ways may need to be changed. some of you should read the article of " constuctive critisim" that was just put out by Jason Santa, since he is one of the 'guys standards purist' look up too maybe you will take heed. and there is nothing wrong with being a purist, not a zealot, but a purist, you just need to lay the personal attacks at the door and come with some mature comments.

I have to ask Vercon, whats wrong with divs? am i doing it wrong, cause thats how i got my introduction

at 22:14 on 09 February 2006, David B. wrote:

(damn 100 word limit :) )

introduction into non tables based design. I am learning to be MORE semantic and cutting the divs down to the least possible number and concentrating on whether i am 'dividing ' my content correctly, but really if 'divs' are not the way to go, and tables are not the way to go. then which way to go? and why are most the the examples of standards div based? seems to me we are walking right back down the wrong road?

what happens 5 years from now when instead of people railing against tables, they are railin against 'divs'? where am i supposed to be as far as semantics are concerned?

at 00:10 on 10 February 2006, Nick Toye wrote:

Look, this is a silly argument. Why spend time developing a site with tables, writing all that code in the markup when it is totally unnecessary.

CSS is intended to make everyone's life easier, also tables are for tabular data. That was what they were intended for and that is how they should be treated. Using a table to layout a site is in my opinion worse than using a hack to compensate for a poorly developed browser.

Also these hacks that we are forced to use can be imported into our main style sheet. Once they are no longer needed, all we need do is do a quick find and replace and they are gone. Not tricky, not time consuming, you wouldn't even have to charge for it.

CSS has allowed us to manage our web pages more efficiently, so we can change small areas that can then have a more widespread effect on huge sites.

Get Dan Cederholm's books and Zeldman's, prepare to be evolved.

at 00:16 on 10 February 2006, Joshua Kendall wrote:

I use CSS for all of my layouts and styling. What other people use is none of my concern unless I am working directly with them.

If people want to use CSS let them, if they want to use tables let them. At the end of the day it doesn't matter as long as the client is satisfied and visitors can use it.

at 00:18 on 10 February 2006, Nick Toye wrote:

Jim:

I can point you in the direction of a load of sites that will convince you that CSS layout is so much easier than table-based layout. I do know where you are though because I was also there, as were many of the top web designers out there.

www.simplebits.com

www.zeldman.com

www.alistapart.com

www.jasonsantamaria.com

www.meyerweb.com

http://www.dontmeetyourheroes.com/

http://www.stuffandnonsense.co.uk/

http://www.mezzoblue.com/

www.andybudd.com

www.csszengarden.com

That last site displays what can be done with css, and how numerous designers have created different stylesheets to go with the same markup, if that doesn't display the power of css then I don't know what does.

Semantics are also a reason why css-layout is better than table layout, a div that has the id of #logo is clearly going to show a logo, whereas a table with a cell that has a logo inside it is not going to have the same effect. The web is moving towards a more semantically rich environme

at 00:20 on 10 February 2006, Nick Toye wrote:

...nt, and CSS will help you along that road.

Also with css you have more control over where you place elements on a page, and you have no need for the spacer.gif.

Trust me Jim, this will change your way of thinking, infact I wish I was where you are right now, because enlightenment is coming brother, and it will blow you away.

Well maybe not, but its a pretty cool learning curve.

at 04:05 on 10 February 2006, Chris Griffin wrote:

Please, tables was never a valid use of creating websites. Everybody just did it because nobody knew any better.

People who still create layouts using tables fit under one or more of these categories:

1) Stupid

2) Ignorant to the fact that tables is old-school (believe it or not it is true)

3) Is waiting for IE to support CSS fully (stupid)

4) Stubborn die-hard designers from the 90s that are now employed by the thrifty business owners that want a website.

De-Cloak fits under predominantly STUPID, but also stubborn die-hard designer.

If you don't think he's stupid, just read some of what he has to say, not only are his ideologies idiotic and preposterous, he can't form grammatically correct sentences. It's obvious that he's just bitter & jealous and he's not smart enough to learn CSS.

at 05:49 on 10 February 2006, David B. wrote:

Chris, you and many others here so exquisitely prove your point through your so knowledgeable, cultivated and wildly mature comments...

at 06:26 on 10 February 2006, kiji wrote:

he has some points; tables are "easier" because Ie does not mangle them as bad as it does with CSS-P. The whole problem with going full CSS is exactly IE and its lack of correct support for standards. His question of "what it IE decides to alter standard CSS"..well, they allready do, so, what's new pussycat?

what he does forget is that your not supposed to change <table> into <div>, creating divitis; you know the type of html pages (like iweb makes them) where everything is in its own div even if it is a header (h1,h2,h3..) or a list: that kind of pages is not what css-pos is about.

Perhaps somebody should tell him about semantic webdesign and keeping content and presentation apart; heck it helps with making sites for handhelds, readers...something tables do not take intoo account.

at 07:22 on 10 February 2006, Chris Lloyd wrote:

I think that what everybody here is so upset about is that there is some guy with shitty website saying that an outdated technique is the correct way to make websites. If you want some rock solid reasons why CSS is better and is mal-informed (not wrong, Dave B.) here are some off the top of my head:

* As soon as you have nested tables life gets ridiculously more difficult. Also tables requires alot more work when integrating them into database systems (2 dimensional looping etc.) If CSS is done correctly it is _alot_ faster

* CSS-P allows for people with different screen resolutions. It is firstly alot harder to make a liquid layout with tables. Then it is also alot more difficult to incorporate different text-sizes when forced by browsers. Functionality like in http://www.masterfile.com/info/products/search.html ("liquidised" search isn't possible with tables).

* The obvious: standards complience. Once your aware of them and you still use tables then your only cheating yourself

at 07:38 on 10 February 2006, Chris Lloyd wrote:

CONTD: (and possibly your customers).

* Future proofing. If done correctly (IE hax implemented with Javascript for example), your website should look the same on any browser in the future. People should also be able to view it on mobile devices, print it easily or maybe incorporate it in new ways we haven't though up of yet. If standards were meant to be ignored, whats the point of XML?

* Size. Itshard to believe that tables only make up 5% of load times. Both I and G3 have noticed substantial improvments in size on large sites without tables. On smaller sites it mightn't make much difference, but then it is ALOT quicker to code with CSS.

* Inclusivity. Screen readers etc. Nuff said.

Thats a short list. Tables do have their merits, granted they are alot easier for cross browser-compatibility. But I feel that the article is just trying to make excuses. Other that compatability, he offers few reasons why tables are actually better than css, only reasons why we shldnt b bothered w

at 07:49 on 10 February 2006, turtlemonster wrote:

The evolution of CSS hasn't reached its end just yet. If web designers/developers took something as limited as the table and found a way to create beautiful layouts with it, imagine what might happen with css!

Just because we haven't found all the ways yet, doesn't mean they don't exist.

Wasnt there a time in the history of the table when not all browsers supported them the exact same way at exactly the same time?

Even now people are finding ways to use CSS for things it wasn't intended for. Eg javascript free rollovers using and liquid layouts that actually changes the layout itself with the resizing of the window (http://www.collylogic.com/). Let's not forget that css can be used to make printed webpages easier to read.

And there are many more examples.

IMO, CSS is better than tables if only for the fact that we haven't yet fully discovered what it is capable of. And the only way to find out is to keep pushing the limits.

at 10:18 on 10 February 2006, Nick Toye wrote:

Really though, there shouldn't be an argument. CSS and Tables are not similar technologies. You can style a table with CSS.

The point with CSS is that you can seperate style from structure making it easier to maintain. But because we used tables back in the day, it is harder for people to accept that there are other ways.

People still use frames, they still use fireworks and photoshop to slice up a design and export to html. The code that is created is over-bloated. We have .net magazine handing out tutorials that are geared towards table based layouts, because it's supposed to be easier, when in actual fact its harder because CSS is a million times more easier.

We have people who are still designing sites, with a "Best Viewed in Internet Explorer" sign. IE is a broken browser. So what does that tell you?

There is also no problem with CSS, only with those who misuse it, same as flash. Done right, it can improve load times, SEO, accessibility, and general effi

at 19:22 on 10 February 2006, Paul wrote:

Well, I think we as a community need to push the practical advantages of CSS. Too often we get wrapped up in the "because it's right!" arguement, without properly articulating the benefits to the customer/client/colleague.

Here's the general line I've gone with. From the beginning, CSS-based sites (fully CSS based) are far more Google-Friendly (this is a major client concern). For the designer, CSS-based sites allow you to stuff common resouces (images found on each page, etc.) in one location so updating them is easier. For the user, this means that the images are cached in the browser, dramatically lowering page access times. It additionally lowers server load by sending the background image once per visit versus once per page.

And finally, for us it allows *all* stylistic information to be kept in one central location. Client wants the nav bar on the left now, or the client wants another comp? No problem, not even for a 90 page site. And *that* is the advantage of CSS.

at 19:13 on 12 February 2006, Luke Redpath wrote:

"Also, how does it look like it was written years ago?"

Er, because I read it a couple of years ago.

So he may have updated it since then, so what?

I've got not time to spend picking apart his lame arguments - I did all that the first time this article came around.

I can't believe how much discussion there has been on this lame article. Arguments about tables vs css belong where should be...2 years ago. If you aren't using CSS for layout on all but the most exceptional of circumstances you don't deserve to call yourself professional.

at 00:23 on 27 February 2006, jose wrote:

I find it somewhat insane that people use the "use tables for tabular data" argument to justify css. Note this quote from "The Zen of CSS Design":

"The float attribute is technically not a layout tool. Floats were developed to give text the ability to wrap around inline elements, and were never intended for use as a full-blown layout method."

at 06:48 on 30 January 2007, john wrote:

Is css positioning supported by all browsers?

at 19:24 on 03 June 2007, Guy in Muskoka wrote:

FOR ANYONE READING THIS ARTICLE WHO WANTS TO WALK AWAY WITH A PLAN:

PROBABLE FUTURE

+ <table> will die away as a useless individuated subset of <div>

+ <div> definitions will grow

ONGOING PRESENT

+ watch the w3c specs for continuing developments & keep current

+ use <div> wherever possible

+ assume browser variance; test everything in all browsers, current & legacy

+ all we have as developers is the w3c (and similar)

+ <table>s are meant for rows/columns display

+ <div> CAN replace any table

+ <div> allows you to invent your own table conceptually

+ <div><table></table></div> is the new usage where used

+ CSS defs for the supported <table> tag is a norm

+ research QUIRKS MODE vs STANDARD MODE - an obfuscation

THE HAGGARD PAST

+ research the inline <div> bugs presented by IE, spec older vers - they can be worked around intelligently

+ don't use <table> to avoid <div> bugs, use <div> and code to avoid the IE inline abnormalities.

SUMMARY

+ <table> was a handf

at 19:28 on 03 June 2007, Guy in Muskoka wrote:

(continued!)

SUMMARY

+ <table> was a handful, so is <div>

+ yes this is a result of corporate interest

+ without corporate interest we don't work

+ snake-chases-tail as we navigate the path between a (possible, attainable) industry ideal and corporate survival of the products we write for

at 13:41 on 18 June 2008, zeka oyunları wrote:

-Thanks for this good blog text.3,

..,,,

at 09:48 on 19 June 2008, bedava oyunlar wrote:

-very nice, thanks--

at 13:40 on 19 June 2008, 2 kişilik oyunlar wrote:

€very goods-??

at 10:15 on 24 June 2008, oyun wrote:

Thanks, for this good blog tex.

))8

at 14:47 on 26 June 2008, oyunlar wrote:

nice, -very goods!57

at 11:01 on 30 June 2008, oyunlar wrote:

_thanks_ss

at 08:40 on 03 July 2008, komik oyunlar wrote:

nice very muchcçcvö

Add a comment:

Keep the comment relevant, constructive and be polite.
A valid email address or URL to your site must be provided, or the comment might get deleted. Content seemed inappropriate or offensive may be edited and/or deleted. Avoid explicit language and words such as "sucks" and "ripoff". For more in-depth discussions use our forum. Email addresses are never displayed. Line breaks and paragraphs are automatically converted - no need to use <p> or <br/>. Quotes & apostrophes are automatically converted to smart punctuation. Be careful when copying and pasting portions of entries or other comments. The following inline HTML elements may be used: <strong><em><pre><q><blockquote><code>. All other code will get removed before posting. Don't forget to close your tags.