Qualcuno dirà che tutti sanno cos'è una CARTELLA o DIRECTORY che dir si voglia. Tuttavia giova ripetere che si tratta di una specifica entità dove sono organizzati files, e/o altre directory su un dispositivo di archiviazione, per esempio un HD (hard disk) o una sua partizione, Una DIR è pertanto definibile come un indirizzo, percorso (path) o locazione del file system in cui sono presenti file o altre directory.
Una directory elencata in un'altra directory è anche detta subdirectory, mentre quella che la contiene è la sua directory superiore (o directory di livello superiore).

Nella cartella principale troviamo una serie di sottocartelle nelle quali 'alloggeranno':

• il file index.htm
• i files che servono per far funzionare le pagine (scripts, CSS, widgets)
• i files che utilizziamo dentro le pagine Musica, Immagini, filmati etc, che possono essere anch'esse suddivise in sottocartelle per raggruppare i files per categorie o altro.

Il file HTML da cui si parte si chiama sempre 'index'. Quando ci si collega e arriva all'indirizzo del sito il browser apre automaticamente questo file (index) che contiene uno o più menù con i collegamenti che rimandano ai files 'alloggiati' nelle cartelle di file 1, 2, 3, 4, o anche con collegamenti a files del web in internet. Dentro ognuna delle cartelle oltre ai files HTML possiamo mettere anche delle sottocartelle con altri elementi per meglio individuare gli oggetti. CREARE LE CARTELLE PER IL SITO nel nostro pc locale (Client) In questo caso i links che collegano i vari files nel nostro sito sono relativi all'indirizzo della cartella del HD dove il sito risiede.
Per prima cosa sarebbe opportuno avere le idee chiare su quello che si vuol fare, cioè avere una progettazione generale, e il disegno schematico della pagina di primo livello,cioè di quelle con collegamenti a index.htm.

LA PROGETTAZIONE GENERALE
Consiste nello scrivere quello che si vuol fare nel maggior dettaglio possibile, corredando il testo con schizzi e disegni. Potete farlo con un qualunque software, anche Power Point o altro, come preferite.
Come primo passo, consiglio però di progettare su supporto cartaceo, per esempio su un classico quaderno di computisteria, a righe o a quadretti che sia. Caso mai potrete poi sempre spostare tutto su supporto digitale, il che poi anche contribuisce a chiarirsi meglio le idee. Utilizziamo la famosa regola giornalistica del 5W1H per fissare le idee.

• dato per scontato che abbiamo già i minimi strumenti necessari per lavorare, le cinque W servono per descrivere come fare il lavoro:
  
  
  • WHAT (che cosa) - il PRIMO PASSO è decidere a grandi linee che cosa si vuole, cioè gli obbiettivi che ci si pongono cioè il perché (why) facciamo il sito, e a quale 'audience' (who)è destinato il sito. È anche importante stimare l'impegno necessario in termini di tempo (when), e anche di lavoro (how - what come fare cosa). Se potete dovreste fare delle chiacchierate con altri e prendere appunti sulle idee che vengono fuori dalla discussione, per poi riordinarle sul vostro quaderno. Si tratta del cosiddetto 'brain storming'.
  • WHO (chi) - a CHI è destinato il sito. Sapere qual è la categoria dei probabili destinatari aiuta a determinare lo stile del sito, i contenuti, gli strumenti che ci serviranno, il tipo di figure e di fotografie, etc. È anche molto importante determinare la definizione delle pagine per determinare le dimensioni dello schermo più usate dagli utenti e quindi scegliere. Annotate tutto sul vostro quaderno.
  • WHY (perché) - gli obbiettivi che si vogliono ottenere ci indicheranno gli strumenti che saranno necessari e anche se e quanto costerà. Non risparmiatevi sulla lunghezza delle spiegazioni, sul testo con schizzi e diagrammi. Se fate il sito per conto di qualcuno, ma anche se lo fate per voi stessi anche qui dovreste fare il cosiddetto 'brain storming', con i clienti o con gli amici.
  • WHERE (dove) - dove sarà alloggiato il sito, e quindi sapere quali sono le caratteristiche offerte dal provider, e ciò che è permesso fare o che non si può fare se si mettono le nostre le pagine su quel server. Sarà utile fare un giro su internet per paragonare tra loro le offerte di diversi provider. Io ho scelto One.com perché offre dominio, caselle postali, blog e anche una considerevole quantità di spazio gratis, ampliabile a pagamento. Dovrebbe essere anche stabile, perché di diritto europeo. Fatevi un prospettino dei provider e scegliete bene.
  • HOW (come - gli strumenti) - per determinare l'impegno che ci vuole, e gli eventuali costi, si deve assolutamente sapere quali strumenti intendiamo adoperare.
    • IL PC - se abbiamo a disposizione solo un PC lento, con poca RAM, una scheda video scarsa, e uno schermo a bassa definizione, è inutile neppure cominciare. La connessione a internet deve poi essere la più veloce possibile almeno ADSL, sia per effettuare ricerche su internet, sia per scaricare i files che per caricare il nostro lavoro sul server host..
    • Il software di protezione cioè i programmi che dobbiamo già avere installati per evitare che quando cerchiamo materiale su internet qualcuno ci appiccichi virus, trojans, adwares. Tutta la roba che ci rallenta o ci blocca deve esser rimossa, e gli eventuali HD periodicamente deframmentati. Il solito firewal non è sufficiente.
    • il software operativo cioè quello che ci permette di editare, visualizzare e correggere i nostri files - le pagine web e gli annessi comprese foto, immagini, filmati, musica e suoni.
      Uso Dreamweaver e non Frontpage, perché il primo è più semplice, lasciando maggiori libertà di aggiungere senza problemi files e pagine esterne da integrare nel sito. Dreamweaver lo uso soprattutto per i menú contestuali a tendina che ti elencano e ti forniscono i comandi di stile che puoi aggiungere nei vari tipi di TAG. Poiché sono un fautore della multi-operatività e dell'auto sufficienza ho anche un programma per manipolare le immagini, uno per i filmati e uno per musica e i suoni.
      
  • WHEN (quando) - abbiamo detto che è importante stimare l'impegno necessario in termini di tempo (when), e anche di lavoro (how - what, cioè come fare cosa). Se fate il sito per conto di qualcuno è assolutamente necessario fissare delle scadenze, ma anche se lo fate per voi stessi non dovete pensare di arrivare alle calende greche. Se non avete tempo o non siete disposti a studiare e lavorare seriamente è bene non cominciare nemmeno. Fatevi quindi un programma temporale con tutte le attività, basta un semplice diagramma di GANTT, purché le attività siano in ordine logico di esecuzione.
• Quando avete terminato la progettazione generale, potete scegliere l'HD dove scrivere i files, e creare una dir con nome appropriato. Potete poi cominciare a lavorare al sito,
  • creare la struttura base delle directory. Naturalmente ognuno può sistemare le cartelle e i files come vuole, ma è sempre meglio il maggior dettaglio per poter rintracciare i vari files. L'inconveniente della complessità strutturale è che poi bisogna prestare molta attenzione a come si creano i collegamenti.
  • preparare i fogli di stile CSS per inquadrare almeno uno schema della pagina base di primo e di secondo livello.
  • preparare le immagini di base con Photoshop o altro programma che consenta di selezionare colori e trasparenze e tipi di file immagine.

ESEMPIO DI COME È STRUTTURATO QUESTO SITO

Ecco come è strutturato questo sito, che è predisposto per essere tradotto dall'italiano in 3 lingue:

# DIR: LINOBERTUZZI (sul 2° Hard Disk - windows 7 sta sul 1° HD)

° FILE: index.htm (dal quale i files principali nelle varie lingue)
° FILE: mainit.htm ( file principale in italiano)
° FILE: ifratesta.htm ( contiene la testata delle pagine in italiano)
° FILE: itotfondo.htm ( file principale in italiano)

le cartelle sotto la root sono:

# DIR: ITALIANO
# DIR: INGLESE
# DIR: FRANCESE
# DIR: SPAGNOLO

# DIR: CSS
# DIR SCRIPTS - contiene gli scripts utilizzati nel sito
# DIR SPRYASSETS - elementi richiesti per i menu spry
# DIR MUSICA - contiene le musichette da scaricare
# DIR IMMAGINI - contiene tutte le immagini
# DIR MODELLI - contiene modelli di files
# DIR CURRICULA - contiene il curriculum vitae del proprietario
# DIR ANIMATE - contiene files gif di figurine animate

° FILE: mainit.htm

le cartelle sotto la root sono:

# DIR: FILOSOFIA
# DIR: LETTERE
# DIR: PROGETTI
# DIR: PARTNERS
# DIR: SCARICA
# DIR: SOFTWARE
# DIR: SPIRITO
# DIR: STORIA
# DIR: MODULI - per iscrizione - ricezione messaggi - ricezione files.
# DIR: PROVASOLUZIONI - contiene la pagina che state vedendo e simili.