During the last week of the spring semester, I was roped into several heated conversations regarding web development. In all of these conversations, people somehow managed to get me to argue on the side of tables versus divs & css.
To me, having a good deal of practical web development experience, these "CSS fundamentalists" are scary. Now, you might call me pretentious, but web developers are not necessarily going to be good programmers, and likewise, good programmers may not always make the best web developers. However, there is one paradigm that I believe web developers and programmers alike can agree with: less work + stable result is always going to be a goal to strive for. In every one of these arguments, I had to bring up the issue of visual consistency. I've worked cross browser, cross platform, to try and get things to look the same on every browser I test on. In every case, a table will produce a more consistent result than a Div/CSS approach. I brought this point up, and the CSS fundamentalist would bring up two or three possible solutions using divs, and more CSS. Of course, the more points I brought up, the more css they suggested, and the less likely it was to work on a variety of platforms.
The bottom line is, CSS is more work, for a less stable result. The only reason these people insisted on using it was because tables were "obsolete" ... which is a fairly arbitrary and unsubstantiated thing to claim, seeing as how they are still supported under W3C standards, HTML 5, and XHTML 1.0 Strict...
There are two valid arguments that I heard against using tables in design:
Tables were not meant for GUI design - Tables were meant to hold tabular data. This is a valid point, but then again, there isn't a whole lot designated in HTML or XHTML standards specifically intended to cater to GUI design. Every tag is meant to hold a specific, well-formed piece of data in the document. HTML as a whole was nothing more than a document formatting language to begin with, and it's only through hacking and adaptation that it has become so adept at GUIs.
Tables are not well supported by mobile browsers - Alright, you've got me there. Tables force a lot of scrolling in mobile browsers, whereas an extremely well thought out Div/CSS layout will automatically be collapsed to a simple, vertically scrollable format. However, if enough of your viewer base is going to be using mobile browsers, you've probably already got a mobile version of your site, specifically designed with minimal extraneous data. There's no need to sacrifice consistency on desktop browsers for the sake of a mobile browser.
Also, speaking from a perspective of practicality, W3C standards are largely useless. Half of them aren't even properly implemented by the browsers used by the majority of the world. It doesn't matter if you've done something right, if it doesn't work on the client's browser. Yes, there will eventually be a day when all browsers can pass the acid test on standards, and when standards evolve to support all platforms and content types in a way that doesn't fail so hardcore. In the meantime, I'll be keepin' it real with my tables.
Subscribe to:
Post Comments (Atom)
You say tables are "less work + stable result". However if you have a multiple-page website(any decent website), you have to edit the table structure for each individual page. VS editing "one" external CSS file. CSS is also much more powerful and pretty much required to create any kind of attractive website. How would you go about centering a webpage created with tables? The "< center >" tag? Well that has been depreciated in the W3 standards which every browser(including IE8) now follow. So your website is going to have a short lifespan, because "< center >" will eventually go from depreciated to non existing. Just look at your blog site here, try making it with tables.. lol
ReplyDelete-Max
I should have been more specific. CSS is a very powerful design tool, and using it to implement uniform formatting across multiple pages is of course a key to practical web design/maintenance.
ReplyDeleteMy issue is with using divs versus tables to position text/graphical elements on a page. Different browsers treat margins/padding/borders/width/height attributes in CSS differently, and yes, there are workarounds for most of the issues, but if it comes down to that, or altering how my server-side script is generating the tables, I'm going to choose the latter.
I will use divs for trivial content formatting, but as for floating divs, they have proved so inconsistent across different browsers that it's honestly less of a headache for me to change a table layout.
Also, multi-page websites using any decent content management/MVC system are trivial to change tabular layouts for. Recreating this site with tables, as such, would require minimal effort, whereas to ensure that this site displays properly with divs (as it does) tends to require significantly greater effort for the same result.
Solution: http://ra-ajax.org/floating-divs-multiple-columns-layout-the-perfect-solution.blog
ReplyDeleteI've tried a few div/css frameworks, and I ended up going with the 960 grid system for a couple projects. In the 960 layout, it's really clear what you're going to end up with, though it still takes longer to design for absolutely no reason. I believe my philosophy boils down to using tables for all "critical" relative positioning (when you're working on a project where 2 pixel differences on IE6 actually affect customer experience), and using divs for internal content scaling/positioning.
ReplyDeleteMy problem is more with the fact that people seem to be against using tables for no reason other than the fact that there is a new alternative to them. Given current standards, I can't see a reason not to use them. Believe it or not, I can read table layouts better than I've ever understood a ton of divs on the same indentation. I honestly don't think tabular data will ever be deprecated, and I'm absolutely sure that, as long as you don't rely on margin/padding/cellspacing/cellpadding for anything in terms of the table itself, any layout you make with a simple table will line up the same on every browser you test it on, guaranteed.