As your web site gets larger, you will have to deal with the extra complexity. It will soon get very difficult to handle a collection of dozens of HTML files mixed in with graphics, style sheets and JavaScript code. The ideas presented here are suitable for small to midsize sites. Really big sites present additional problems.
The simplest kind of organization is to collect the files
into folders based on either type, subject matter or sometimes both.
The class web site has several files at the top level.
These are the index page, the schedule, the syllabus and so
on.
Here is a picture of the class site.
The folders collect files by subject matter. Sometimes I want to work on just one set and this makes it easier to find all the examples or assignments. Each of the folders has an index.html file in it so that the navigation links show the entire contents of the folder. However, this means that I have to update the index every time I add or delete a file.
If it makes it easier to find things, you can go deeper in the tree. I could have folders under the notes directory to organize the topics into lectures or weeks. Think about your needs before creating folders or files. It is painful to go around updating links if you decide to move files from one folder to another.
Always use relative pathnames in your site to refer to other files in the same site. This will allow for changes in the position of the whole site on the server. They are also a little faster to access. Generally, the full path to a file will be different on your computer and the server. Choose file and folder names carefully. They should be descriptive of the contents. I don't want to have to open a bunch of files to find the one that contains notes on site management, so I named this file site.html.