Thursday, August 30th, 2007
YAML the CSS framework
Category: Utility
, CSS, Framework
When I first saw an email from Dirk Jesse about YAML, I was instantly in Ruby mode. Then as I read I realised that he was talking about a totally different YAML, his own CSS framework “Yet Another Multicolumn Layout” (compareble to YUI Grids or blueprint) that is designed
for creating flexible float-based multicolumn css-layouts. YAML is
released under creative commons licence.
Dirk told us:
The framework is focussed on flexible layouts and offers column and/or
grid based design elements for flexible, elastic or fixed layouts. YAML
has grown over two and a half years now. Since YAML wasn’t planned to
become a framework, things grew slowly and only with a german
documentenation. Thats I think, is the main reason, why it is almost
unknown outside Germany. This changed with the arival of YAML v3.0 july’07.YAML is very flexible, comes with a bilingual documentation (PDF, > 100
pages) and - my lastest baby - a builder, that allows visual configuration of the basic layout elements.
The building is a very nice Ajax app in its own right:
in a word… WOW. Impressive work by Mr. Dirk Jesse. Been trying various non-table column layouts for awhile, this is very cool. Also, that builder app is super slick and could be a HUGE timesaver. Phenomenal. [bookmarked!]
That thing produces enough divs to make 4 websites… Just saying. I guess it works if you simply want to avoid tables without taking the time to understanding CSS layouts.
Builders of all kinds always produce waste, its the cost vs doing it by hand. The app itself is crazy cool though.
Awesome project, but is building a decent CSS layout really that hard? Doing it by hand is always the best way.
@David: It is - depending on complexity and skill. Dirk has done great work with this tool. Btw - read his book ;)
A good piece of work for fast web development prototyping. I like it.
.::AleX::.
Please forget the name “YAML”. :( A new domain name is not so expensive. :)
Anyway, the application is quite cool as I think. I’m thinking about including something like this into my framework, it would be a nice tool to start a project quickly, even if I know CSS + HTML.
A brilliant tool for lightning fast prototyping and wireframing. I agree with David above that for final production stuff, it would involve a bit of tweaking, optimizing, etc, or custom build by hand, but to quickly get things up and online (eg wireframing a webapp) this is fantastic. Thanks for your hard work Dirk. :)
I really like it, especially the builder application! It is really nice work, well done!
PS Is there uncompressed and commented source code of the builder?
Hello, thanks for your feedback. Of course I know the discussion about the amount of divs in the markup but as YAML is focussed on flexible layouts, there are good reasons for this way in a framework when you want to offer real freedom to the designer. The documentation is nothing for reading in a minute but i promise, it’s worth reading it! Definitely there will be a learning curve when you starting with YAML as features like the Top-Down-Principle or the way YAML deals with IE-Bugs is something, not everyone is familiar with.
@Mario: what’s the name of his book?
It has been developed in jQuery. WOW!
yea that app was developed in jquery, that’s why i’m looking for source,
dirk, can u share the source code please?
Excellent Article but a minor spelling mistake in the first paragraph ;-)
@David Walsh: RE: “is CSS really that hard?”
Yes it is, especially if designs become more complex and you need the results cross-A-Browsers… so doing prototyping like this is very time savy. Most people that I heard of do not touch the main YAML structure in the course of the project, it just works as-is. And overall YAML is a great piece of work IMHO and the result of a long effort. Well done, I´d say.
He needs to rename it. YAML is definately already taken.
WOWWW! It’s Great! I’ll use it.
@Adnan: CSS-Layouts. Praxislösungen mit YAML (german title) http://www.amazon.de/CSS-Layouts-Praxisl%C3%B6sungen-YAML-Dirk-Jesse/dp/3898428370
This looks like an excellent tool. Builder is very intuitive, and I plan to use it in the prototyping phase of an upcoming project.
Have to change the name. YAML is taken. See http://www.yaml.org.
Thanks.Good article
Didn’t know about YAML and CSS. Armenian Genocide April 24th 1915.