Guida al linguaggio HTML - Tabella codici ASCII, Hex, Char, HTML, Dec, Oct, IBM compatibile - Ascii character table - ascii ascii ascii ascii ascii, euro, euro, euro

Guida base al linguaggio HTML

di Mauro Pierluigi

Divisione delle pagine in Frame

Prima di iniziare a trattare questo argomento è necessario chiarire bene che i motori di ricerca non indicizzano i siti e le pagine web sviluppate con i frame, questi interrompono l'indicizzazione del sito non appena appare la struttura di un frame, fermandosi a quella pagina web, quindi se il sito è tutto sviluppato con i frame sin dalla prima pagina avete poche speranze che il sito abbia molte visite. Quindi dimenticatevi dei frame e sviluppate solo pagine intere. Se proprio avete vagliato ogni possibile soluzione e non vi resta altro che suddividere le vostre pagine in frame allora dovrete mettere un particolare impegno nella cura dei Meta Tags , del titolo e del contenuto che andrete a mettere in mezzo ai Tag "<noframes>...</noframes>", inoltre se sviluppate tutto un sito basato sui frame è buona norma affiancarlo ad un sito alternativo, magari solo testuale, in modo che i motori di ricerca possano indicizzare nei loro database tutte le pagine e sottopagine.

Una pagina in frame non è altro che un contenitore che contiene altre sottopagine, quindi se per esempio creiamo una pagina web suddivisa in due frame indipendenti ci ritroveremo a lavorare con 3 pagine web, cioè la prima che rappresenta la struttura base e altre due che riempiono questa struttura.

Per impostare una pagina in frame dovremo, come detto sopra, creare un documento HTML dove ci sarà specificata la struttura e le divisioni, poi altrettante pagine web (di contenuto) per quante divisioni avremo impostato. Un esempio di struttura base è questo:

<html> <head>     <title>Titolo</title> </head> <frameset rows="100,*">     <frame name="intestazione" src="intestazione.htm">     <frame name="principale" src="principale.htm"> </frameset> </html>

Per visualizzare il risultato clicca qui.

Come è possibile vedere dall'esempio abbiamo ottenuto una pagina web divisa in due frame orizzontali, che rappresentano due pagine indipendenti, questi due frame sono divisi da una barra che è possibile anche spostare ridimensionando così i frame stessi, se si vuole invece rendere invisibile questa barra divisoria basta aggiungere nel Tag "<frameset>" gli attributi: framespacing="0" border="0" frameborder="0" , in questo modo:

<frameset rows="100,*" framespacing="0" border="0" frameborder="0">

Righe e colonne

Il Tag "<frameset>" è quello che determina la struttura base delle divisioni della pagina che può essere divisa più volte in righe, tramite l'attributo "rows", e colonne, tramite l'attributo "cols", la larghezza, o altezza, di queste divisioni può essere specificata sia in pixel che in percentuale, per esempio se scriviamo:

<frameset cols="100,*,100">...</frameset>

avremo una pagina divista in tre frame verticali, di cui quello a sinistra e quello a destra saranno larghi 100 pixel, quello al centro invece si adatterà a quanto spazio disponibile è rimasto, indipendentemente dalla larghezza della finestra del browser.

Se scriviamo:

<frameset rows="20%,15%,*">

avremo una pagina web divisa in tre frame orizzontali, di cui il primo in alto sarà alto il 20% dell'altezza totale della finestra del browser, il secondo (in mezzo) il 15% dell'altezza totale della finestra del browser, e il terzo in basso prenderà tutto lo spazio rimasto disponibile.

Se scriviamo:

<frameset rows="*,*,*">

avremo una pagina web divisa in tre frame orizzontali, semplicemente divisi in parti uguali, ognuno di 1/3 l'altezza totale della finestra del browser.

Contenuti

Se per esempio dividiamo la pagina in tre colonne, quindi tre frames verticali, dovremo inserire altrettante pagine web di contenuto, tramite le istruzioni:

<frame name="sinistra" src="sx.htm"> <frame name="centro" src="centro.htm"> <frame name="destra" src="dx.htm">

queste vanno inserite ovviamente, come nell'esempio sopra, fra i Tag "<frameset>...</frameset>".

L'attributo "name" serve appunto per dare un nome al frame, questo sarà utile per la navigazione, infatti se c'e' un link nel primo frame che, al clic, deve far aprire una pagina web nel frame al centro, dovremo utilizzare l'attributo "target" nel link (come spiegato sopra nella sezione link), specificando il nome del frame che ospiterà la pagina web.

L'attributo "src" indica quale pagina web deve essere aperta inizialmente in quello specifico frame, come valore deve contenere il nome del file HTML.

Il Tag "<noframes>"

Questo Tag è molto utile per due ragioni principali, la prima è relativa ai motori di ricerca, in quanto possono indicizzare il contenuto che va inserito in questo Tag, la seconda è che da la possibilità, ai browser che non supportano i frame, di visualizzare comunque un minimo di contenuto.

Si utilizza così:

<frameset rows="100,*"> <frame name="intestazione"> <frame name="principale"> <noframes>     <body>       ...contenuto...     </body> </noframes> </frameset>

Fra i Tag "<noframes>...</noframes>" va inserita una vera e propria pagina web completa, partendo da "<body>" fino a "</body>", è consigliabile sviluppare una pagina HTML testuale, completa di link alle sottopagine, poi fare copia/incolla del codice fra i due Tag, questo, come detto sopra, permetterà sia ai motori di ricerca di indicizzare un minimo di contenuto, che ai (pochi) utenti che non posseggono un browser aggiornato di visualizzare la pagina.

Frame dentro ad altri frame.

E' possibile nidificare le divisioni in frame in modo che la pagina sia divisa molte volte in sezioni che contengono altre sezioni, sia righe che colonne; vediamo un esempio:

<html> <head>     <title>Titolo</title> </head> <frameset rows="100,*,100">     <frame name="sopra1" src="f1.htm">       <frameset cols="30%,*,30%">         <frame name="sinistra2" src="f2.htm">           <frameset rows="50%,*">             <frameset cols="30%,*,30%">               <frame name="sinistra4" src="f3.htm">               <frame name="destra4" src="f4.htm">               <frame name="destra4" src="f5.htm">           </frameset>           <frame name="sotto3" src="f6.htm">         </frameset>         <frame name="destra2" src="f7.htm">       </frameset>     <frame name="sotto1" src="f8.htm">     <noframes>       <body>       ...contenuto...       </body>     </noframes> </frameset> </html>

Per visualizzare l'esempio pratico clicca qui.

Abbiamo ottenuto una pagina web con ben 8 divisioni, per cui sono stati necessari ben 9 file HTML!

indietro | indice | avanti