Where should I put my css files?

Question

I have a middle size of website that share a common header/footer and almost each page would have its own specific file for layout. I have put the common header/footer in a sperated html file, but I do not know where to put the css file because the link element in footer.html <link rel="stylesheet" type="text/css" href="footer.css" /> will not link to the current directory of this html file but the requiring php file.

I look around quite a few websites and definitively there is no uniform solution. One solution is put all the css file in root-directory/css, while quite a few websites use hierarchical directory like '/skin' '/global' etc. The others choose a quite differential way using links like http://sstatic.net/stackoverflow/all.css?v=5fc0e3026fcc (this is the stackoverflow way).

So my question which way is better or should I use for my situation?

ps. actually I think this problem could also apply to image file storage.

Answer 1

I always tend to store my css in directories under the root folder.

/css/frame.css
/css/menu.css
/css/form.css
/css/print.css

I also split that down further if I ever need a ie specific css file

/css/ie6/frame.css

Which would contain all my ie6 specific overrides.

I do the same for images

/images/menu/......
/images/home/......

etc

It is all personal preference though, pick whichever style suits you.

Answer 2

almost each page would have its own specific file for layout

Try putting all your CSS in one file anyway, and see how big it is. After gzipping, it could be pretty small, thus making it not worth separating your styles into multiple files.

If you do have multiple CSS files, it doesn’t really matter where you put them on your server. I’d suggest having them all in a directory like /css/, because then you don’t have to think about where a given file is.

Answer 3

you can have it link to

/public/stylesheets/screen.css

this is how Ruby on Rails does it, for example.

The big companies have a "CDN" (content delivery network) so that an end user any where in the world can get to the content fast because the CDN has machines at many locations at different parts of the world. You can find a lot of information in the book "High Performance Web Sites"

Answer 4

CSS files are just one of many types of file you can expect to handle once your site grows. There is little technical argument for storing them in any particular place. I have always used the following basic structure:

/root
 /pages
 /scripts
 /css
 /databases
 /images
 /documents

That way, everything is nicely tucked away! I hope this is helpful, but this question is very subjective.