Before deployment, is there tool to compress HTML class attribute and CSS selectors?

steveyang picture steveyang · Nov 9, 2011 · Viewed 9.3k times · Source

In current project, I was asked for compressing the HTML class attribute and corresponding CSS selectors before deployment. For example, the code on production is:

<div class="foo">
  <div id="bar"></div>
</div>

.foo {/*Style goes here*/}
#bar {/*Style goes here*/}

On deployment, I want the HTML class and corresponding CSS selectors to be substituted:

<div class="a">
  <div id="b"></div>
</div>

.a {/*Style goes here*/}
#b {/*Style goes here*/}

What's the available tools there to archive this compression?

Answer

Litek picture Litek · Nov 15, 2011

If you really want to rename class names (keeping in mind what Madmartigan said) Google Closure Stylesheets does that. It's an overkill, and YUI Compressor or any other minification + gzipping tool should give you enough performance boost, but it can do it. You'll have to use other Closure tools to make appropriate changes to your .js files and html templates.