I agree. This is how I've done it for last few years and have recommended it before on HN.

ref: http://news.ycombinator.com/item?id=1518096 | http://news.ycombinator.com/item?id=705706 | http://news.ycombinator.com/item?id=705800

also: Web Development as Tag Soup - http://news.ycombinator.com/item?id=252185

I'm sorry, but this is simply not true. You can't just magically move elements around in CSS without changing the markup. And even if you can accomplish a lot, many things will become very awkward as you try to tweak CSS in ways that was never intended.

I think we must just accept that we have a markup language (HTML; <p>, <strong> and so on), a way to style that (CSS) and a layout engine (CSS+HTML; <div>, <span> and so on).

I think the "just use CSS" or "we can boil HTML/CSS/JS down to a subset of reusable chunks" doesn't work. It's simpler to just let these technologies be what they are, and remove the need to care!

https://github.com/antirez/lamernews/blob/master/app.rb#L138...

For instance to write

    <foo>
      <bar id="4">content</bar>
    </foo>

    H.foo {
        H.bar(:id => 4) {"content}
    }

It is far easier to find a really good designer, who knows HTML/CSS and a bit of JS (probably jQuery) than it is to find a really good designer, who knows HTML/CSS and a bit of JS (probably jQuery) and then is also comfortable configuring a Rails environment and also proficient enough with coding Ruby to learn quickly and without support or input, this custom DSL.

There are already so many people that have the skills you need, why force the issue? Let the technologies be what they are. In my experience, communication between team members is the single highest cost in building software. Unless you're a designer/developer or you're working with a small team on your startup and you happen to have all the skills you need right there in one office and timezone, you'll need to confront the issues of resourcing, iteration and staff changeovers - what I'm advocating is that we play to the prevailing skill separations and reduce the communication overhead.

Thus you remain in full control of the data (HTML) and you've completely separated the design (CSS) & behaviour (JS) logic that gets applied to it.