Removing Unused CSS Rules

1

I recently was given the task to “clean” a website by optimizing its CSS files. Much to my frustration, the file contained well over 1,000 lines, and I had noticed there were a large number of orphaned and unused CSS selectors. A quick analysis with the Chrome “Audit” (under Inspect Elements), nearly 45% of the selectors were unnecessary. Manually cross-referencing the CSS to filter out unused CSS rules would take me all day!

I came across an online tool to remove unused css rules to streamline the process in a much easier and quicker format. You simply insert your URL and the tool crawls through your website and CSS and outputs a clean CSS file. Advanced options allow you to prevent specific pages from being crawled such as a WordPress folder where your blog may reside.

I suggest formatting the CSS output into a CSS optimizer like CSS Beautify to format the style to be consistent and easy to read.

1 Comment »

  1. Mynak

    June 19, 2014 @ 2:07 pm

    1

    But it’s paid. On the other hand you can use dust-me plugin with firefox. Its free and usable 🙂

Leave a Comment

Log in