PageSpeed : Minify CSS

Published

Compacting CSS code can save many bytes of data and speed up downloading, parsing, and execution time.





What is minified CSS?


here is a non-minified CSS code.


div
{
background:#FFF;
color:red;
margin:0px auto;
padding:2px;
width:200px;
heiht:200px;
}

Size: 99 bytes



if we just remove the whitespaces, it will become :


div{background:#FFF;color:red;margin:0px auto;padding:2px;width:200px;heiht:200px;}

Size: 83 bytes


Why minifying CSS?


As you could see in above text result, it reduces the filesize, Minifying CSS code has the same befits as js minification. it is recommended to minify CSS for fast downloading, parsing,and execution of stytlesheets.


How to minify CSS?


There are several tools available to minify CSS.
If you do the compression manually, don't forget to make a backup for those files before you edit them so then you can rollback the changes .

Here is good Online CSS Compressor tool.
Copy and paste your CSS Code and get compressed code.

http://refresh-sf.com/yui/




Comments

Post a Comment