HTML/CSS Frameworks: Useful, Universal, Usable, Unobtrusive
Jens Meiert, November 18, 2009 / November 23, 2009.
This entry is filed under Web Development, Usability.
A high quality HTML/CSS framework needs to have four attributes: useful, universal, usable, and unobtrusive. The four U’s. “Meiert’s four U’s” if you like, says a son of marketing gurus.
-
Useful. If an HTML/CSS framework doesn’t do what sites and the people behind the sites need, it’s worthless. Trash, so to speak. Most HTML/CSS frameworks aren’t useful. They solve problems nobody has (for example, an infinite number of columns), or they ignore problems everyone has (for example, core maintenance after n months). For an HTML/CSS framework to be useful it must only address problems more than 90 % of all target documents have. That excludes framework customization – see Usable.
-
Universal. A high quality HTML/CSS framework wants to be used by as many documents as possible. And given that it might be, at the very least it doesn’t want to do any harm. That is, it does not play havoc with any on-top layout, and it doesn’t significantly slow things down either – see Unobtrusive. It is fine to limit the scope of “universal,” for example to a company. Public frameworks don’t limit their scope. All of them fail being universal. (Stay with me.)
-
Usable. A usable framework is easy to understand and can be dumped into pretty much any document, all of this without customization. (This doesn’t mean people should do this.) You’ll see enough crazy things happening once the framework is in production. People don’t want to customize, and of those who want, most will do something you didn’t expect, and be it to modify their local copy of the framework in very creative ways. To make a framework usable, use as few IDs and classes as possible, narrow layout options to the most probable ones – see Universal –, and generally keep it simple.
-
Unobtrusive. The best framework can not even be seen. You merely feel it. It’s like a ghost gently stroking your hair. It doesn’t slow documents down. It blends in the source code. It’s almost invisible. Alas, you can smell the most popular frameworks from a mile away. Maybe it’s because the document is showing in the status bar that it’s loading something from a foreign hostname. Maybe it’s because the fancy 12 column grid is only offered by framework x. Maybe it’s just paranoia. In order to make an HTML/CSS framework unobtrusive, you need to keep things simple once again, and pull out every “best practice” card you own.
Now that we think about it, maybe the universal margin and padding reset – the one I had to tweet again for simplicity reasons – is the only HTML/CSS “framework” that meets these requirements. Ha. (Choke is not.)
Me at least, the grim web developer, am too much in love with tailored solutions. Next time I’ll explain a framework I wrote for Google, maybe, the one that got referenced so subtly in July. (This is still a personal post though.)
Read More
Enjoy the most popular posts, probably including:
Comments
-
On November 18, 2009, 19:23 CET, Neovov said:
Thanks for the ending teasing…
This go.css made me do some regular expression to make it readable (but still uncomprehensible).Nice post, but I’m still wondering if a great HTML/CSS framework can exists (depending of the “framework” definition). Maybe if you have to make a billion pages for an huge customer. But for different customers?
Through the time I made a kind of HTML/CSS squeletton I use in each project I work on. But I find it still uncomplete… (I’m sure you can help
)BTW, isn’t there a problem with the Choke’s file weight in your post ? (Choke 1.0 (ZIP, 189,210,670 KB))
-
On November 18, 2009, 22:08 CET, Vladimir Carrer said:
Interesting thoughts.
If I should define CSS Framework in one sentence I will say: CSS Framework is making high level reusable CSS Code -
On November 20, 2009, 10:39 CET, Thomas @ DailyThomas.com said:
Maybe, one day, I’ll start using a html/css framework. For now, I just don’t see the benefit of it. Maybe I’m just too conservative… I also still use wsftp95 for uploading my files… lol !
-
On November 24, 2009, 14:34 CET, Richard said:
There will probably never be an ideal HTML/CSS framework but often it is a case of just avoiding reinventing the wheel (even if the wheel we are using is a little wonky and doesn’t handle corners well, ha ha).
Do you have have any recommendations on frameworks that meet or come close to your ideals? -
On November 30, 2009, 15:12 CET, Alan Gresley said:
Just give me some pieces of 4 by 2 (timber), nails and a hammer and all is well. I build up code fragments like this in NoteTab.
<code < >
^!InsertHtml <CODE><^&></CODE><li><a href=""
^!InsertHtml <LI><A href="">^&</A></LI>
This produces this in the source.
<code><></code><li><a href=""></a></li>
You can create some very large code fragments and even optional selection boxes. Take some time to build up though.
Frameworks look so bloated in comparison.
-
On December 23, 2009, 18:54 CET, Alan said:
Meiert’s four U’s sounds like a good principle to me, Maybe i should be concentrating on the last one since it looks like google will be leaning more and more on the speed of websites after adding the speed section to the webmaster tools.