html p23, I percorsi assoluti e relativi

Percorsi assoluti
Fino a quando ci troviamo nella condizione di creare un sito web di dimensioni ridotte (poche pagine) non avremo problemi di complessità, e possiamo anche ipotizzare di lasciare tutti i nostri file in una medesima cartella. È evidente però che – man mano che il nostro sito web cresce – avremo bisogno di un maggior ordine.

Si presenterà allora l’esigenza di inserire le immagini del sito in una cartelle diverse (in modo da averle tutte nella medesima locazione), e magari sarà opportuno dividere il sito in varie sezioni, in modo da avere tutti i documenti dello stesso tipo all’interno di un contesto omogeneo.

I siti web sono dunque organizzati in strutture ordinate: non a caso si parla di albero di un sito, per indicare la visualizzazione della struttura alla base del sito.

Poiché l’organizzazione di un sito in directory e sottodirectory è una cosa normalissima, dobbiamo imparare a muoverci tra i vari file che costituiscono il sito stesso, in modo da essere in grado di creare collegamenti verso i documenti più reconditi, destreggiandoci tra le strutture più ramificate.

Per farlo esistono due tecniche:

indicare un percorso assoluto
indicare un percorso relativo
Nel caso in cui il documento a cui vogliamo puntare si trovi in una particolare directory del sito di destinazione, con i percorsi assoluti non abbiamo che da indicare il percorso per esteso.

Se esaminiamo:

Leggi le risorse sui fogli di stile

Possiamo vedere chiaramente che il link indica un percorso assoluto e fa riferimento ad una particolare directory. Nella fattispecie:

http:// Indica al browser di utilizzare il protocollo per navigare nel web (l’http)
www.html.it/ Indica di fare riferimento al sito www.html.it
css/ Indica che la risorsa indicata si trova all’interno della cartella "css"
index.html Indica che il file da collegare è quello chiamato "index.html"

Insomma, per creare un collegamento assoluto è sufficiente fare riferimento all’url che normalmente vedete scritto nella barra degli indirizzi. I percorsi assoluti si usano per lo più, quando si ha la necessità di fare riferimento a risorse situate nei siti di terze persone.

Percorsi relativi
Spesso vi troverete tuttavia a fare riferimento a documenti situati nel vostro stesso sito, e – se state sviluppando il sito sul vostro computer di casa (cioè "in locale") – magari non avete ancora un indirizzo web, e non sapete di conseguenza come impostare i percorsi. È utile allora capire come funzionano i percorsi relativi.

I percorsi relativi fanno riferimento alla posizione degli altri file rispetto al documento in cui ci si trova in quel momento.
Per linkare due pagine che si trovano all’interno della stessa directory è sufficiente scrivere:

collegamento alla pagina da linkare nella stessa directory della pagina presente

Poniamo ora di trovarci in una situazione di questo genere:

Figura 1. Riferimento a pagina di una sottodirectory

Dalla pagina "index.html" vogliamo cioè far riferimento al file "interna.html", che si trova all’interno della directory "interna", che a sua volta si trova all’interno della directory "prima".

La sintassi è la seguente:

Visita la pagina interna

Vediamo adesso l’esempio opposto: dalla pagina interna vogliamo far riferimento a una pagina ("index.html") che si trova più in alto di due livelli:

Figura 2. Riferimento a pagina in una directory di livello superiore

La sintassi è la seguente:

Visita la pagina interna

Come si vede, con i percorsi relativi valgono le seguenti regole generali:

Per far riferimento a un file che si trovi all’interno della stessa directory basta linkare il nome del file collegamento alla pagina
Per far riferimento a un file contenuto in una cartella di livello inferiore alla posizione corrente, basta nominare la cartella seguita dallo "slash", e poi il nome del file.

Secondo la formula:
cartella/nomeFile.html Visita la pagina interna
Per tornare su di un livello, è sufficiente utilizzare la notazione:
../nomeFile.html Visita la pagina interna


Grazie a questi accorgimenti potete agevolmente navigare all’interno delle directory del vostro sito: se ce ne fosse bisogno potrete per esempio tornare su di un livello rispetto alla posizione del file, scegliere un’altra cartella, e poi scegliere un altro file:

../altraCartella/nuovoFile.html

Per approfondimenti potete consultare la pagina d’esempio.

Approfondimenti
A volte potrete incontrare la notazione:

Leggi le risorse sui fogli di stile

Se il vostro sito è all’interno di un server Unix (ma la sintassi funziona anche in sistemi Windows, basta che non siano in locale), questa notazione non deve stupirvi: il carattere '/' indica la directory principale del sito, altrimenti detta "root". Dunque è un altro modo di esprimere i percorsi assoluti all’interno del proprio sito.

Un'altra cosa importante da sapere è che quando metterete il vostro sito all'interno dello spazio web, l'indicazione della index all'interno di una directory è facoltativa. Al posto di questo:

http://www.html.it/css/index.html

è sufficiente indicare la directory:

http://www.html.it/css/

Verificate solo con il vostro gestore dello spazio web (cioè "hosting"), se le pagine index della directory devono avere forma index.html, index.htm, index.asp, index.php, home.asp, o altro.

Consigli per i nomi dei file
Quando mettere nel web il vostro sito internet, vi accorgerete che esistono due famiglie di sistemi operativi: Windows e Unix. Questi due sistemi operativi utilizzano differenti modi per gestire i file, dunque alcuni accorgimenti sono necessari:

è consigliabile non lasciare spazi vuoti nei nomi dei file (gli spazi vuoti non sempre vengono interpretati correttamente), meglio ovviare a questa necessità con un "trattino basso" (cioè "_"). Ad esempio: mio_file.html
maiuscole e minuscole possono fare la differenza (in ambiente Unix spesso la fanno), quindi controllate il modo in cui avete scritto i file
Inoltre quando create un collegamento state attenti a non avere una notazione simile a questa:

<a href="file:///C|percorsonomeFile.html">testo

significa che state facendo un riferimento (assoluto) al vostro stesso computer: chiaro che quando metterete i file nel vostro spazio web, le cose non funzioneranno più.