News
February 26, 2007
Rating
This post has not been rated, cast your vote!
Share
HTML Utopia: Designing Without Tables Using CSS, 2nd Edition
Last week, I got another paid review request through ReviewMe. If you’re a blogger and haven’t signed up with them yet, I would highly recommend it. I’m a huge fan not only for the extra revenue stream, but for the extra exposure it gives you as well.
This request was to review HTML Utopia: Designing Without Tables Using CSS, 2nd Edition, a book by Rachel Andrew & Dan Shafer and published by SitePoint. I’m definitely a SitePoint fan, and the book’s topic couldn’t be more relevant to UMS readers, so I took it.
The only problem is, they didn’t actually give me a copy of the book to review, so all I can review is the sales page itself. If you’ve actually read this book, I’d love to hear your comments on it.
The foundation of the book is teaching you how to “easily create modern ‘table-free’ websites using CSS from scratch.” The page starts off quite inauspiciously, though, with both “device-independant” and “refridgerator” misspelled right in the first set of bullet-points. However it definitely improves from there.
The sales page goes into great detail about what the book teaches, and it all looks great. If you’re new to CSS design, or just still can’t quite seem to get the hang of it, it might be worth getting a copy of this book. They offer a 30-day, money-back guarantee, so there’s little risk involved.
My biggest concern is whether the book is already dated. Published last April, they mention “new information on making your site compatible with Firefox 1.5 and the upcoming Internet Explorer 7,” but that “new information” is clearly anything but now, since both FF 2 and IE 7 have been out for quite awhile. I’m not sure that makes a difference, but it would be interesting to see whether what they predicted for IE 7 in particular actually came to pass.
So take a look and let me know what you think. I’m interested to hear what some actual readers have to say.
Add Your OpinionMore Opinions on HTML Utopia: Designing Without Tables Using CSS, 2nd Edition
Add Your Opinion
Resources & Links
- Wireframe Showcase
- All About Typographic Hierarchy
- How to use Textmate - Zeldman
- HTML5 Boilerplate
- Take My Texture
- CSS3 Generator
- Check domain status as well as social media names at the same time.
- What does 320dpi mean to designers?
- iOS Icons made in Pure CSS
- HTML5 Rocks
- styleguide.yahoo.com
- I’M COMIC SANS. McSweeney’s Monologues
- Launch List - This is such a cool idea.
- HTML5 & CSS3 READINESS
- Steve Jobs’ thoughts on Flash
I’m still not quite sure what the big deal is about using tables when used appropriately.
Is it the idea that a site can be easily refactored if you use nothing but DIVs and CSS?
Whenever I have had to go through a site redesign, the first step was to throw out the all of the original templates and start from scratch.
Does it make your HTML smaller?
Not always, sometimes you have so many nested DIVs to produce the effect that you want that it is probably equivalent in size?
I’m not saying that TABLES should be as ubiquitous for designing a page as they were in 1999 but why fight for minutes with layout issues with DIVs when if you can do the equivalent, cleanly, with a table in seconds. Keep in mind tables can be styled too.
It’s not about the time factor, DJ. It’s about semantics and proper markup. If I wanted to display a heading, would I use a strong tag? No, I’d use a h1 or other h-tag.
I’d take semantics and proper use of HTML over time savings any day.
That doesn’t answer why a div or several nested DIVs is semantically more correct than a TABLE.
I’m not saying a TABLE is always the best solution and I’m not saying DIV is never the right solution. But this struggle to use CSS/DIVs in a non-intuitive manner to produce a page layout has always perplexed me. Why it is so bad to use a TABLE for a two or three column layout? Is it because it seems so fixed and you can’t tweak it or just drop in another column?
Semantically, I think a table is more appropriate. A table intrinsically has columns. A DIV is a block of something. I’m starting to think that DIVs are the ones that are starting to be abused now.
Basically, why not use the correct tool for the job instead of ad hoc reasons like “I’d take semantics and proper use of HTML over time savings any day.” Using a TABLE is proper HTML. Again, tables within tables within tables within tables is very bad and confusing but that is not what I’m advicating. Use what you need when you need it as appropriate and keep the “religion of zero tables” out of it.
For instance, would you actually advocate using DIVs in place of a table to show a table of data?
Furthermore, a lot of the 2 or 3 column layouts rely on using float. The problem, unfortunately, that I have seen with using float is that it can be rendered on different browsers differently.
DJ - I am happy to see this issue addressed. As someone who learned to use HTML back in 1996, I am fond of the TABLE. As I drifted away from web design in search of other pursuits, I have recently rediscovered the joys of CSS and have been trying to re-learn some things. Unfortunately my big stumbling block is always attempting to design 2 and 3 column layouts that are compatible with each browser. This is always the point where I decide to give up!
I love the TABLE because it JUST MAKES SENSE. Of course, I’m just an amateur, but if something makes sense why not use it?
In light of all this the book does sound interesting…
The table doesn’t make sense - since when has a table been for the display of anything other than tabular data?
It might be slightly easier if you don’t know what you’re doing with CSS and simply want to (lazily) export from photoshop, but your website will NOT be cross-browser compliant - have you never seen the offset imagery in some browsers when using tables for layout?
If you really want a detailed explanation of why not to use tables (among other things) why not try Jeffery Zeldmans book on usability? Its a very entertaining read and has a few useful css workarounds which still apply now even though it is slightly outdated now..
I found this topic looking for a good reason posted on the web as to why not to use tables in design. I love CSS, and I love TABLEs, but each seem to have their place for me.
Ad - you make a really good point. Tables were originally used for simply displaying data, but they also seem to perform functions that CSS doesn’t do so well. Maybe I’m stuck in the dark ages and am not using CSS properly. I’m not sure.
Regarding the cross-browser situation, I think you’ll find that both CSS and tables will create problem, especially going back to IE5 and IE6. Back when the box model still had its discrepancies between browsers, I was pulling my hair out.
Anyway, I will check out Zeldmans’ book and hopefully he can finally shed some light on this issue for me!
I’m trying to apply a “horses for courses” approach, whilst at the same time wanting my pages to be as browser and search engine friendly as possible. But if I have a chart of data, for instance our gig guide, with columns for date, venue and notes, isn’t TABLES the obvious tool? If there is an EASY way to do it using DIVs that would make the content more visible, then I’d be very interested.