How to decrease CSS file Size?

Here are some ways to compress your css file size in case anyone was wondering.

Clean CSS Optimize and format your CSS using a variety of different compression settings. Fixes sloppy code and generates clean and concise CSS. http://www.cleancss.com/

CSS Compressor Compress CSS code to reduce file size and make your sites load faster for free. http://www.csscompressor.com/

Online JavaScript/CSS Compression Using YUI Compressor http://refresh-sf.com/yui/

Minify CSS – How to Minify CSS – Minify CSS – Minify CSS. Minification is the practice of removing unnecessary characters from code to reduce its size, thus improving load times. http://www.minifycss.com/

CSS Drive – CSS Compressor – Use this utility to compress your CSS to increase loading speed and save on bandwidth as well. You can choose from three levels of compression, depending on how legible you want the compressed CSS to be versus degree of compression. http://www.cssdrive.com/index.php/main/csscompressor

Do I need to decrease my css file size?
I guess the quick answer is yes, file size affects users loading times which will help users have better experience on your website and reduce their bandwidth usage especially if they are loading your website on a handheld device.

Some good code practices
instead of this

do this

Image by © Meg380 | Dreamstime Stock Photos

  • Prestashopic

    Using 1 line css will decrease download time of css file

  • Martenxxx

    If size of your CSS files isn't monster, you can let them uncompressed with any problems.

  • Tedel

    1. No, it doesn't.
    2. You can reduce the file size repeating classes, using shorthand CSS instructions, and simplifying your design. It is not a must for a 18kb large CSS file.

  • zuchrivious

    1. not directly, faster sites are more favorable by search engines
    2. try audit your entire site with yslow or pagespeed, css might not be your biggest problem regarding speed

  • Nick

    Yes reducing the css file is a good easy way to start speed optimizing. Use the pagespeed addon, it will automatically create your css file. I believe you can do the same with your html files but I wouldnt suggest that 🙂

  • Face

    I think 18KB is not too big to be compressed
    but if you want to compress it, I suggest you to use online free css compressor like http://www.cleancss.com/