Geek out time! There are a lot of places on the web that keep telling you about the merits of purely CSS based design, and avoiding the use of tables (A List Apart is one example). But reasons cited have always seemed to theoratical to me; it’s always along the lines of “separate aesthetic form and programmatic function, keep pages semantically pure” and multiple other justifications that, while true and appropriate, require a 5,000 page dictionary to comprehend.
I’ll now try to explain it in really simple terms that web designers (by that I mean Imageready-junkies and Dreamweaver-dependents) can understand. And I’ll state it out in point form (a vestige from my army days I think):
- Love your colleagues - Show your programmer colleague some love. You can’t imagine how torturous it is for a developer to work through 500 nested tables just to find out where the data goes. Imagine reading a book where the words “the” and “is” are repeated 500 times for no apparent reason. It’s like that - infuriating. So your colleagues may be like geeky and all, but doesn’t mean you should torture them for their lack of fashion sense and what not. Learn CSS!
- Love your design - Do you love your own design? Enough to protect it no matter what? Then you might be better off expending the effort and learning how to do CSS-based designs. I think anyone who has worked with programmers on the team have witnesses how the lazier programmers have this tendency to shred through designs, leaving 1-pixel gaps between sliced images where there were none, and totally ruining a design so painstakingly sliced into HTML by your trusty Imageready program.Only you can stop this insanity. Not by threatening the programmer with death, but by adopting CSS-based design. You see, the programmer has absolutely no need to touch your CSS files in 99% of cases, so in essence he/she has no need to touch your designs at all, down to the last pixel in your layout. So your design is untouched.
- Love your users - There are a multitude of reasons why CSS-based websites are better for users. CSS files are cached across pages, the code-base becomes neater and smaller in size, and it becomes easier for search engines like Google to read your sites. I’m not going to be the guru on this, but just Google for the reasons why XHTML is better than HTML and you can find a multitude of other reasons. And get this - designing in CSS makes it much easier to allow blind people to hear your site, or to let the older folks with poor eyesight like me in increase the font size (something called accessibility). Oh, and trust me on the poor eyesight thing… my monitor is set to 1600 x 1050 pixels on a 15.4 inch screen. Words are mighty small, and I know how it feels!
- Love yourself - This is pretty important. If you know CSS-based designs, you are going to be pretty hot in demand job-wise. In fact I’m looking for one myself! (shameless plug: if you’re interested, please mail me at adrian.lee @ utopia-edge.com). On top of that, you learn something new, and you can start boasting about your mad skillz and start becoming an uber among your peers.
And I’m not the only one. Here’s an interesting site with 55 reasons! Also, this is in response to several posts I read about designers and programmers, but mostly from a programmer point of view. I’m a little bit of both so I do think I kinda know where the two camps are coming from. But I do admit that these four points only begin to scratch the surface. Still, while I’m not like really hardcore, it’s in my belief that EVERYONE should start doing this.
Resources: CSS Layout Techniques, YUI Library, Layout Gala, CSS Zen Garden
