The Need to Organize Site Files
we have placed all our site files into the main (root) website folder. As a website becomes larger and more sophisticated, a single folder becomes too cluttered to manage effectively.
Relative Paths
Once we move site files to subfolders, we need a way to tell the browser where to find them. To do this, we use relative paths:
Absolute Paths
A common mistake committed by novice web designers is to copy and paste the full path to a local file in their markup:
This can be a frustrating error, as the browser on our own computer can locate and display the image. But when the site is uploaded to a live web server, the image won’t appear, since the location is no longer valid.
External CSS Style Sheets
Our earlier example of an external CSS style sheet assumed the actual CSS file was in the same directory as the XHTML file. Now that we are better organizing our site, we should move the CSS file to its own folder:
Relative Paths in Style Sheets
As we know, CSS style sheets can set background images for elements. Now that the style sheet is in its own folder, we need a way to point the CSS file to an image that is located up one folder level and then down into a different subfolder:
Web design 