Some will say that everybody knows what's a FOLDER (or DIRECTORY if you prefer). However it's worth repeating that it's a specific entity where files and / or other directories are organized into, on a storage device, for example an HD (hard disk) or a partition of it.
A DIR is therefore definable as an address, path or location of the file system in which there are listed files or other directories.
A directory listed in another under-directory is also known as subdirectory, and that which contains it is the parent directory (or upper-level directory). So when you need to call a file from a page, you have to take care to write the link with the path that must be followed to reach the file itself.

SITE'S STRUCTURE

To operate the site design and better organizing the structure is necessary because a web page contains references to elements (images, scripts, sounds, style sheets, other web pages ...) each of which has it's address in a folder.
It is unthinkable to a structure with a single DIR because it would be a mess with pile of files of various kinds: to the programmer would be almost impossible to navigate and easily find a file among thousands. Here we show a general diagram of a simple site.

In the root folder (give it the name as your prefer) are several subfolders in which you find:

• the initial start file named index.htm
• files that are used to operate the pages (scripts, CSS, widgets)
• files that we use inside pages: music, pictures, movies etc, which can also be divided into sub-folders for grouping files by category or as you prefer.
• that's above is an example, as you can group and name folders according your logic needs.

The HTML file from which the site starts is always called 'index'. When we get at the site in internet, your browser automatically opens this file (index) that contains one or more menus with links that point to files 'housed' in file folders 1, 2, 3, 4, or even with links to files of the web outside your site.
Inside each one of the folders in addition to HTML files we can also put subfolders with other elements and files.
CREATING FOLDERS FOR THE SITE in our local PC (Client) :to check and individate the connection links of the various files avoiding mistakes in our website it should be better using a specialized editor. However here's two simple examples:

a) If I have a file named partners.htm residing into the DIR named Files 1, and in partners.htm theres a link which opens again index.htm, and its reference is

../index.htm

../ means one step behind, starting from the folder in which partners.htm resides, and then pointing to index.htm

b) if you have to open a file named list_4.htm residing into the folder Files_4 starting from the file partners.htm the link reference in partners.htm will be

../Files_4/list_4.htm

../ means one step behind, starting from the folder in which partners.htm resides, then going into the folder Files_4, where you point to the file list_4.htm.

At first, it would be appropriate to have a clear idea of what you want to do, which is to have a general design, and the schematic drawing of the top-level page, that is, the index.htm itself and/or those pages with links to it.

THE GENERAL DESIGN
GENERAL DESIGN is to write what you want to do in as much detail as possible, adding text with sketches and drawings. You can do this with any software, even Power Point or other, what you prefer.
As a first step I suggest, however, to design on paper, for example of a classic book of bookkeeping, with lines or squares it. If anything, then you can always move everything on digital media, which then also helps to clarify the ideas much better. We use the famous journalistic rule of 5W1H to fix ideas.

• taken for granted that we already have the minimum necessary tools to begin working, the five W are used to describe the job:
  
  
  • WHAT - you need to decide broadly what you want, that is the objectives you are facing to, why we're here, and what 'audience' (who) is expected for the site. It is also important to estimate the required efforts, in terms of time (When), and also of work (how - how to do what).
    If possible you should do chats with others and take notes on the ideas that come out of the discussion, then rearrange them on your notebook. This is the so-called 'brain storming'.
  • WHO - knowing who are the likely recipients, it helps to determine the site's style, the content, the tools that you will need, the type of figures and photographs, etc. It is also very important to determine the definition of the pages to determine the screen size used by most users. Write down everything on your notebook.
  • WHY - the objectives to be obtained show us the tools that will be needed and also if and how much it will cost.
    Don't spare the length of the explanations, the text with sketches and diagrams. Both If you do the site on behalf of someone,or you do it for yourself, you always should do the so-called 'brain storming', with clients or friends.
  • WHERE - where will be lodged your site, and then to know what are the features offered by the provider, and what is allowed to do, or what you can't do if you put pages on that server.
    It will be useful to take a ride on the internet to compare between offers of different providers. I have chosen One.com because it offers domain, mailboxes, blogs and also a considerable amount of free space, expandable on payment. It should also be stable, because of European law. Do yourself a providers table and choose well.
  • HOW (the tools) - to determine the commitment that it takes, and costs, you absolutely must know what instruments you do intend to use.
    • The PC - if we only have a slow PC, with little RAM, a poor video card, or a low screen definition, it is even useless to begin. The internet connection must then be the fastest one possible, to search on the internet, to download files, to upload your work on the hosting server..
    • The security software that is the programs that we already have installed to prevent, while we try material on the internet, that someone is sticking viruses, trojans, adwares, popups. All the stuff that slows or blocks us must be removed, the window's register and any HD regularly cleaned and defragmented. The usual firewall is not enough. Please spend some money to get and install strong security software.
    • the operating software that is the one allowing us to edit, view and correct our files - Web pages and annexes including photos, pictures, movies, music and sounds.
      I prefer Dreamweaver to Frontpage, because the former is easier, leaving more freedom to add files and seamlessly integrating external pages to the site. Dreamweaver too is endowed with the contextual menu drop down list, which will provide what you can add in the various TAG types and in the stylesheets. Since I am a proponent of multi-operation and self sufficiency also I have a program to manipulate images, one for video and one for music and sounds.
      
  • WHEN - we have said that it's important to estimate the effort required in terms of time (When), and also work (how - what, that is how to do it). If you make the site on behalf of someone is absolutely necessary to set deadlines, but even if you do for yourself you havn't to think to get the cows.
    If you do not have time or you're not willing to study and work hard, you shouldn't even start. Then let's do ourselves a time's program with all activities, just a simple GANTT, provided that the assets are in a logical order of execution.
• When you have completed the overall design, you can choose a dir with appropriate name, where to write your files on the HD, and begin to create. You can then start working on the site,
  • create the basic structure of the directory. Of course everyone can arrange folders and files as he wants, but it's better more detail in order to track down the various files. The drawback of structural complexity is that then you have to pay close attention to how you create links.
  • prepare the CSS to frame at least an outline of the basic page of the first and second level.
  • prepare basic images with Adobe Photoshop or another program that allows you to select colors and transparencies and image file types, and to arrange and save the images for the web with reduced weight..
    

Here's an outline of how this site is structured, which was designed to be translated from Italian into 3 languages.

# DIR: LINOBERTUZZI (the site's root folder on the Hard Disk 2 - windows 7 resides on HD C:) where's index.htm (which lists the links to the main file of each of the different languages). Under this root whe have the followind subfolders

# DIR: ITALIAN containing mainit.htm, that is the starting file
# DIR: ENGLISH
# DIR: FRENCH
# DIR: SPANISH
# DIR: CSS - containing the Style sheets
# DIR SCRIPTS - containing scripts
# DIR SPRYASSETS - elements nedeed by spry menus
# DIR MUSICS - music to download
# DIR IMMAGINI - all the images needed
# DIR MODELLI - file models and templates
# DIR CURRICULA - my curriculum vitae
# DIR ANIMATE - files gif (Jif) with animated figurines

The typical starting files for a language are
° FILE: mainit.htm (main file of each language )
° FILE: ifratesta.htm ( iframe with header of pages)
° FILE: itotfondo.htm ( iframe on the pages' bottom)

All files that can be used without modification, without being translated into various languages, that is, music - images - models - animations are in the root directory then contained in a series of subfolders.

Under each language's subfolder whe have other subfolders as follows:

# DIR: PHILOSOPHY
# DIR: LETTERS
# DIR: PROJECTS
# DIR: PARTNERS
# DIR: DOWNLOADS
# DIR: SOFTWARE
# DIR: SPIRIT
# DIR: HISTORY
# DIR: MODULES
# DIR: PROVASOLUZIONI (tests and solutions)- where there are the pages you're watching just now.

Let's not be too lengthy over such explanation, and do not enter further the various subfolders details. In fact we want to begin to build the structure of our first file index.htm, from which the second level pages will start .

Later I decided to put my site for separate part in different servers which can grant less risk of losing data and more diffusion.