The best approach to scramble CSS definitions to a

Question

I'm not sure if it will bring anything beyond saving on traffic through the removal of long-worded names, but I would definitely want to hide my system of namings, declarations and their organization.

The thing is that manual Find&Replace is going to take a very long time, and each slight modification could probably require the process to be redone in part or in whole.

Has anyone thought of this problem? Maybe write a macros? Will it be intelligent enough to be able to discover names in a CSS file? Does anything better and simplier exist?

Answer 1

You might want to try YUI Compressor:

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

Answer 2

Use a CSS compressor. It will make it really hard to read, but it's not possible to make it completely unreadable. Here's one from CSS Drive.

Answer 3

Use Perl. A simple perl script can search through all of your files recursively and replace whatever you specify with something else.

Answer 4

You can't make it "unreadable", but you can save some space by using things like the CSS optimizer

Answer 5

Firstly I don't think I would do it at all, what exatly is to be gained by making it less readable?

But if one had to do it, why not make a custom parser that would convert your "development" names to "production" names and vice versa as needed?

Answer 6

As others have stated, you can make the names shorter or less meaningful, but to reach a human-unreadable state is essentially not possible.

No matter how you rename or distort the css, it still has to have proper atributes and the html has to reference the named classes and/or ids. Additionally tools like firebug will unfailingly point users to the css being used which I assume will defeat your intent.

It also defeats the purpose of using semantically meaningful tags in your html.