Possible Duplicate:
Any recommendations for a CSS minifier?
JsMin is a compression and combination executable for javascript files. Is there something like that for CSS files?
Asked
Active
Viewed 1,011 times
1
Community
- 1
- 1
Dan Appleyard
- 7,405
- 14
- 49
- 80
-
1I think Stackoverflow may need to update their question search. When I typed in the question originally, the "duplicate" mentioned above was not listed. – Dan Appleyard Jun 29 '11 at 15:27
3 Answers
3
Google #1 result for CSS compression: http://www.refresh-sf.com/yui/
George Johnston
- 31,652
- 27
- 127
- 172
-
As my question asked, I was looking for an executable (not a web site that does it for me). – Dan Appleyard Jun 29 '11 at 15:25
1
CSS cannot be minified in the same way that JavaScript can. You can replace variables such as lastItemRead with names like a, but in CSS you cannot replace selectors like .lastItemRead with shorter selectors (not without crawling through and rewriting your entire site).
That being said, you can remove white-space and comments from CSS files. There are several tools that exist for doing this - the YUI Compressor is a popular option from Yahoo!.
There's a lot you yourself can do also to keep your CSS files lightweight. Remove unused selectors, reduce redundancy, and try to join many rules:
background-color:red;
background-image:url(stars.png);
background-position:center center;
background-repeat:no-repeat;
Is a bit verbose; better to write it as:
background:red url(stars.png) center center no-repeat;
Saves a tremendous amount of space. Another thing to look out for is adding unnecessary characters to rules. For instance, when you are setting paddings and margins, there's no need to add a unit after your 0 values:
margin:0px 10px; /* 0px should be 0 */
A lot of this stuff can be fleshed out by using a great tool like the CSSLint, online at http://csslint.net/. Warning: CSSLint will hurt your feelings!
