For web developers(especially front end) writing html is an everyday chore. How about spicing things up.
How about using CSS selectors not just to style and access elements, but to generate code?
For example, what if you could write this…

div#footer>p+span.links>a

…and see this as the output?

<div id=”footer”>
<p></p>
<span><a href=””></a></span>
</div>

Isn’t that totally awesome..

Watch the demo here:
http://vimeo.com/7405114

More Details in here:
http://code.google.com/p/zen-coding/

Zen HTML and Zen CSS are the separate plugins for TextMate and NetBeans. They are using template logic, provided by applications and based on Zen HTML Elements and Zen CSS properties documentation.

Zen Coding is the all-in-one plugin, created and supported by Sergey Chikuyonok for Aptana, TextMate, Coda and Espresso. It is based on JavaScript (for Aptana) or Python (the rest of all) script and using more advanced Zen HTML Selectors logic for building HTML.

If you don’t use the supported editors. Here is a web based one, try it out here:
http://zen-coding.ru/demo/

Most of you are familiar with the virtues of a programmer.  There are three, of course: laziness, impatience, and hubris.
—Larry Wall

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>