Jan
31
2006A List Apart Finds the Holy Grail (of CSS Layout)
31
2006
With a URL like:
http://www.alistapart.com/articles/holygrail
you know it should be interesting. In this article on the most revered of “Web-Standards-Based-Design” websites, Matthew Levine reveals the secrets for a clean, semantic, CSS-only way to create the page layout framework used by 90% of decent web sites.
If you don’t want to read the article, you can skip right to the example. Just do a “Save As…” and a huge amount of headaches can be avoided on your next project.
The only thing that bugs me about this code is that the side columns do screwy things when the browser window gets really small. This may seem minor, but I’ve always felt that although user interfaces shouldn’t always behave like real-world objects, when you’re using something that appears to implode and collapse in on itself under certain circumstances, you naturally tend to feel like what you’re using may be fragile and unreliable. Early versions of Groove were notorious for this kind of collapsing layout - even buttons would shrink down so that the text on them “fell off”.
Anyway, I’m pretty sure that a fix would only involve one or two non-semantic “container” tags (which Levine wen’t out of his way to avoid - I have much less of a moral issue with the occasional container tag). I’ll let you know if I come up with something.
This bug with the ALA’s Holy Grail has been eating at me to no end. At this point, I don’t care about semantics anymore. As of today, they are horribly limiting. The one purpose the web serves me right now is to make me money. And if I can’t have a functional layout that is light weight, standards-compliant and designed to my customers’ liking, then screw semantics for the time being.
Standardization and semantics were intended to improve usability of the web and ensure future backwards-compatibility of code. But, presently, any religious devotion to semantics is limiting designers because of their conviction to comform to quality.
If you know of any ways to improve ALA’s CSS Holy Grail, I am all ears. You mentioned extra wrappers. You’ve got my full attention.
Nick White 7/13/06 @ 11:35 pm