Vandelay Website Design Blog

23 Resources for Clean and Compressed CSS

There are a number of free online tools that can help you to create and maintain effective CSS coding. These tools include validators, optimizers, compressors and more. Try out a few of these tools and see how they can help you to keep more efficient style sheets.

CSS TIDY

CSS Tidy is an open source CSS parser and optimizer from SourceForge. It is available as an executable file, and there is also an online version. CSS Tidy is often able to achieve a compression ration of 30% or more. In addition to compression, CSS Tidy can also format CSS code for higher browser compatibility.

CSS Tidy Screen Shot

CLEAN CSS

Clean CSS is another simple online tool that gives you a few options for formatting and optimizing CSS. Clean CSS gives you easy control over how much you want it to do. It is also available in German and French.

Clean CSS Screen Shot

CSSCHECK

Insert the URL of your style sheet and CSSCheck will quickly run a report that gives you some feedback on the code. It will give warnings for items that may cause problems.

CSSCheck Screen Shot

CSS ANALYZER

The CSS Analyzer from Juicy Studio allows you to validate your CSS code, and it also tests the color contrasts and the units of measurement. Just enter the URL of your style sheet and it will produce the report.

CSS Analyzer Screen Shot

CSS OPTIMIZER

CSS Optimizer is another tool for reducing the file size of style sheets. Unlike some of the other tools, it offers the option to upload a file from your computer in addition to the option of entering a URL.

CSS Optimizer Screen Shot

FLUMPCAKES CSS OPTIMIZER

The CSS Optimizer from Flumpcakes gives you several options and provides the save features as many of the other optimizers on this list.

Flumpcakes Screen Shot

CSS DRIVE CSS COMPRESSOR

CSS Drive provides a CSS Compressor with options for “Light”, “Normal”, or “Super Compact.” You simply paste your code into the page and it does the work.

CSS Drive Screen Shot

CSS SUPERDOUCHE

CSS Superdouche offers less features and options than some of the other tools, but it still functions essentially the same. It works to reduce the size and complexity of the file by eliminating unnecessary elements and organizing the file.

CSS Superdouche Screen Shot

ROBSON CSS COMPRESSOR

Another option for compressing your CSS files, the Robson CSS Compressor offers many of the same features as the other choices listed here, but it is still in development, so “it may not work correctly.”

Robson CSS Compressor

W3C CSS VALIDATOR

The W3C offers a validator for CSS files. Simply enter the URL and see how your style sheet does.

W3C Validator Screen Shot

Other Choices:

Originally Published January 28th, 2008

36 Responses

  1. 23 Resources for Clean and Compressed CSS « Hotware: Dirk’s Software Blog
    January 28th, 2008

    [...] 29, 2008 23 Resources for Clean and Compressed CSS | Vandelay Website Design Posted by Dirk Filed in [...]

  2. Spuds
    January 28th, 2008

    Great article. some really useful resources.

  3. Nate Koechley
    January 28th, 2008

    The Yahoo! User Interface Library (YUI), where I work, offers the YUI Compressor. While originally designed for use with JavaScript exclusively, since version 2.0 it has offered CSS compression as well.

    http://developer.yahoo.com/yui/compressor/

    Thanks,
    Nate

  4. Trainingstagebuch
    January 29th, 2008

    Thank you for these great article.

    Greetings
    Nils

  5. Aries-Belgium
    January 29th, 2008

    “CLEAN CSS … It is also available in Dutch and French.”

    It’s not Dutch but German. But indeed a great article.

  6. Freak Group — Diseño web, recursos y demás
    January 29th, 2008

    23 recursos para optimizar y limpiar tu CSS…

    Para los maquetadores CSS que les gusta tener su códigio limpio y optimizado existen una serie de herramientas gratuitas que ayudan a que las hojas de estilo sean más eficientes. Entre los recursos podemos encontrar validadores, optimizadores y compr…

  7. chris
    January 29th, 2008

    Thanks for sharing these, the list looks great!

  8. Tibi Puiu
    January 29th, 2008

    Great resource Steve, I’m really a messy coder so this should definitely come in handy.

  9. Colección de recursos para limpiar y optimizar el CSS » Cosas sencillas
    January 29th, 2008

    [...] VANDELAYDESING han recopilado una serie de herramientas en línea gratis, que te puede ayudar a crear y mantener [...]

  10. Matthew Griffin
    January 29th, 2008

    Great list, Steven. Thanks.

  11. Paul
    January 29th, 2008

    Thanks for sharing these wonderful resources.

  12. Madhur Kapoor
    January 29th, 2008

    Great list steven.

  13. links for 2008-01-29 « toonz
    January 29th, 2008

    [...] 23 Resources for Clean and Compressed CSS | Vandelay Website Design (tags: css tools optimization) [...]

  14. Vandelay Design
    January 29th, 2008

    Nate,
    Thanks for leaving the additional resource. I forgot about that one. I’ve never personally used it, but I should check it out.

    Aries-Belgium,
    Thanks for the correction, I edited the post.

    Tibi,
    I hope it helps.

  15. links for 2008-01-30 | The Straight Pitch
    January 29th, 2008

    [...] 23 Resources for Clean and Compressed CSS Mastering CSS is the key to good web design. These tips are extremely helpful. (tags: CSS tips and tricks stylesheets web design cascading style sheets) [...]

  16. blacque
    January 29th, 2008

    great resource! i’ll try some later :)

  17. Rob
    January 30th, 2008

    Very nice article. I wrote an article on compressing CSS, but you have gone further with a decent list of automation CSS shrinking apps.

  18. Freelance Writing Blog Crawl | The Writers Manifesto Blog
    January 30th, 2008

    [...] Design is another blogger who manages to constantly write excellent and valuable posts. His 23 resources for clean and compressed CSS is great for buddying designers or those who need a little refresher [...]

  19. links for 2008-01-30 « Amy G. Dala
    January 30th, 2008

    [...] 23 Resources for Clean and Compressed CSS | Vandelay Website Design (tags: css reference web_design web_dev tools utilities) [...]

  20. Shakin.ru » 23 полезных CSS сервиса
    January 30th, 2008

    [...] Vandelay Design  Перевод: [...]

  21. links for 2008-01-30 | 博客报--All about blogging.
    January 31st, 2008

    [...] 23 Resources for Clean and Compressed CSS 另CSS代码更简洁的23个在线工具 (tags: CSS webdesign tools online) [...]

  22. Fatih Hayrioğlu’nun not defteri » 01 Şubat 2008 web’den seçme haberler
    February 1st, 2008

    [...] CSS temizleme ve optimize etme araçları. Bağlantı [...]

  23. Best of the ‘Sphere - 3/2/08 | TechnoMoney | Smashing Blogging Tips
    February 3rd, 2008

    [...] 23 Resources for Clean and Compressed CSS from VandelayDesign [...]

  24. Jonathan Franzone
    February 8th, 2008

    Great links! Thanks for posting this list. I’m not a CSS master (yet) and so I often need a lot of help when doing web page layout. I also usually end up with a lot of CSS clutter.

  25. 99 Ways to Improve Your Blog | PureBlogging
    March 10th, 2008

    [...] even being used if you have made some customizations or changes to the site. I wrote a post 23 Resources for Clean and Compressed CSS that should help you with the [...]

  26. 23 narzędzia do oczyszczania i kompresji CSS | CSS Mania
    April 5th, 2008

    [...] “oczyścić”, skompresować czy wskazać błędy w arkuszu stylów CSS. Wypróbuj 23 narzędzia, które mogą pomóc w codziennej pracy z CSS. (Brak głosów)  Loading [...]

  27. Блог Волотко Дмитрия - Это нормально © :: Entries :: 23 сервиса для работы с CSS или ссылки на выходные #8
    May 4th, 2008

    [...] оптимизировать, сжать или провалидировать ваш CSS-код. Vandelay Design поделился своей подборкой из 23х подобных [...]

  28. Сервисы для CSS | MishaSite.net
    May 4th, 2008

    [...] статьи 23 Resources for Clean and Compressed CSS с Vandelay Design опубликовал Дмитрий Волотко. Привожу ее [...]

  29. PraP
    May 26th, 2008

    Nice one n thanks sharing this URLS.

  30. ESS »  Css Düzenleyiciler
    June 22nd, 2008

    [...] devamına buradan ulaşabilirsiniz. Css hakkında daha fazla kaynak için; Posted on 22 Haziran 2008 by admin [...]

  31. Burak Önal
    July 25th, 2008

    Thanks for sharing these, the list looks great!

  32. christea
    September 21st, 2008

    I have tested CSS&JSS:
    ( http://taat.pl/en/cssjss/ )
    It’s very easy to use and the compression is impressing.

  33. masterza
    September 23rd, 2008

    I am ecstatic! reading and checking files CSS is the thing.

  34. Hans
    March 2nd, 2009

    Here I add two additional ones.
    - CSS compressor, find and remove unsed class and ID
    http://www.pagecolumn.com/tool/css_compressor.htm
    - CSS formatter
    http://www.pagecolumn.com/tool/css_code_formater.htm

  35. 25 Scripts for Dropdown Navigation Menus | Vandelay Design Blog
    March 31st, 2009

    [...] 23 Resources for Clean and Compressed CSS [...]

  36. Jon
    July 2nd, 2009

    CSS rounded corner generator, modeled after Google’s rounded corners: http://svidgen.com/rcg.php

Leave a Reply