Removing Unused CSS Rules
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.