Question

I have a SharePoint farm with about 20 css files and im convinced that it can be condensed into far less than that. However, going through each page would no doubt get tiresome and infuriating.

So is there a tool available to verify how much of a css file is being used across a website/webapp?

Answer 1

The only one I’m familiar with is: http://unused-css.com/

A web crawler follows the links of your site. On each page, we retrieve the CSS files and list the selectors. The selectors are tested on the html page. If the selector matches an element, it is marked as used. When all the files have been visited, a new css file with only the used selectors is built. That’s the file you can download.

I haven’t used it extensively though.

Sept 6, 2012 Update: Another promising looking tool – Deadweight

Deadweight is a CSS coverage tool. Given a set of stylesheets and a set of URLs, it determines which selectors are actually used and reports which can be “safely” deleted.

January 29, 2013 Update: Another new tool – http://www.csstrashman.com/

The trashman examines your site’s live DOM and reverse engineers a new, more elegant definition that captures styles down to the pixel.