|
Amati e odiati, utili o inutili, benfatti o pessimi i frames sono strumenti entrati ormai nella consuetudine del web, e perfettamente gestiti da tutti i browser. I detrattori dei frames affermano l'inutilita' di suddividere ulteriormente le pagine web; pagine che in ultima analisi possono risultare poco leggibili. Altri, come me, pensano che i frames possano rendersi utilissimi evitando di caricare le stesse immagini e mantenendo ordinata la struttura e i contenuti del sito. Naturalmente abusare dei frames puo' portare a traguardi di pessima impostazione grafica, giungendo ad un risultato opposto rispetto a quello preventivato. Un punto certamente a sfavore dei frames e' la loro incompatibilita' con i programmi di navigazione dei non vedenti che davanti a tali strumenti si bloccano, non permettendo la lettura delle pagine. Una buona soluzione e' quella di creare una versione frame ed una versione senza frame (come questa stessa guida ha fatto). Come si creano i frames? Prima di tutto diamo uno sguardo ai comandi HTML per la gestione dei frame.
Per creare una pagina divisa in frame e' necessario creare piu' files HTML richiamati da un file principale che e' poi quello che ne permette la gestione. Prima di tutto quindi bisogna impostare questo file "sorgente", e poi successivamente gli altri files che compongono il frame.  Consideriamo di dover creare una finestra divisa in frame come da figura, con un frame in alto fisso (nel quale caricheremo il file "top.htm" da creare a parte)e un frame centrale (nel quale caricheremo il file "central.htm" da creare a parte) il quale cambi a seconda della pagina che si dovra' visualizzare. Come scritto sopra questi due frames devono essere gestiti da un terzo files il quale dovra' richiamarli assegnando loro una parte della pagina. Ecco il codice di questa pagina:
<frame me name="centrale" src="central.htm"> Come si vede il codice del frame e' racchiuso tra i comandi <FRAMESET></FRAMESET> che si comportano come gli usuali comandi <HTML></HTML>. La grandezza dei frame (o meglio lo spazio che ognuno di essi deve occupare della pagina) e' stabilita dal comando rows="80,*, che sta a significare che il frame alto (che in questo caso e' una riga, "rows") deve essere di 80 pixels, mentre quel "*" sta a significare che tutto il resto deve essere assegnato al frame centrale. Avremmo potuto esprimere anche in percentuali le grandezze dei frames, in questo modo: Impostati i due parametri <FRAMESET></FRAMESET> all'interno di essi si definiscono i nomi e i files da richiamare nei due frames creati. E' necessario dare un nome al frames (name="alto") e indicare il file HTML che dentro al frame dovra' essere caricato (SRC="top.htm"). Si devono quindi previamente creare due files di nome "top.htm" e "central.htm". Nota come sia importante la posizione all'interno del codice per la corretta interpretazione da parte del browser. Se infatti si invertono gli ordini in questo modo:
<frame me name="alto" src="top.htm">  Clicca qui per vedere il risultato di questo frame.
 Per creare due frame verticali e' sufficiente sostituire a "rows" il termine "cols":
<frame me name="sx" src="sx.htm"> <frame me name="centrale" src="central.htm"> </FRAMESET> Clicca qui per vedere il risultato di questo frame.
I vecchi browsers non supportavano i frames per cui, nella prospettiva che le pagine vengano visualizzate da uno di questi "vecchi" software, e' utile inserire del codice che avverta della presenza di frames e della impossibilita' da parte del browser di visualizzarle. Ecco il codice da inserire:
<HTML> <body> Attenzione. Il tuo browser non supporta l'opzione dei frame. Per visualizzare queste pagine e' necessario scaricare un borwser che supporti tali opzioni. Ti consiglio Netscape 3.0 o superiore. </body> </html> </noframe> E' possibile adottare contemporaneamente una divisione sia in colonne (cols) che in righe (rows), in modo tale da creare una finestra divisa in piu' frames. Vediamo come si deve operare sul codice HTML del documento a seconda del numero e della posizione dei frames che si intendono creare.
Per eliminare il bordo grigio dei frames si deve inserire il seguente codice: <frameset cols="20%,60%,20%" border=0> Per impedire che i frames vengano ridimensionati dal visitatore: <frame me name="alto" src="top.htm" noresize> Per eliminare sempre le barre di scorrimento (scrollbars): <frame me name="alto" src="top.htm" scrolling="no"> Per renderle sempre visibili: <frame me name="alto" src="top.htm" scrolling="yes"> Per renderle visibili solo quando servono: <frame me name="alto" src="top.htm" scrolling="auto"> Per regolare la distanza dal contenuto del frame dal margine alto (manginheight) e sinistro e destro (marginwidth): <frame me name="alto" src="top.htm" marginheight=2 marginwidth=5> Per quanto riguarda i links all'interno dei frames (cioe' come caricare una pagina in una frame diverso da quello in cui si trova il link) si deve far riferimento al nome che in fase di realizzazione abbiamo assegnato ai vari frames. Nome che non si riferisce al file ma a quanto scritto dopo "name=". In questo caso, per esempio: <frame me name="alto" src="top.htm"> il nome assegnato e' "alto". Consideriamo la seguente pagina divisa in frames:
Consideriamo che da un link presente su "SX", dobbiamo caricare un'altra pagina sul frame "Centrale". Se il link, presente sul frame "SX", fosse semplicemente: <A HREF="nuova.htm">Clicca</A> la pagina verrebbe caricata all'interno dello stesso frame (cioe' "SX"), perche' in assenza di comandi adatti il browser capisce di dover caricare la nuova pagina nello stesso frame in cui e' presente il link. L'esatto codice e': <A HREF="nuova.htm" TARGET="centrale">Clicca</A> Clicca qui per una prova.
Altro uso fondamentale del comando <TARGET> e' quello di richiamare un link ad un'altra pagina la quale verra' visualizzata a pieno schermo, eliminando tutti i frame preesistenti. Ecco il codice: <A HREF="nuova.htm" TARGET="_parent">Clicca</A> Clicca qui per una prova.
Se inserisci il codice: <base target="_top"> in testa al documento HTML tutti i link presenti nella pagine elimineranno i frame esistenti, senza necessita' di inserirli in ogni link. Un'altra necessita' puo' essere quella di caricare, con un solo click, due o piu' frames (naturalmente la finestra deve essere divisa in almeno tre frames). Consideriamo una pagina suddivisa come nella figura:
La nostra necessita' e' di inserire un solo link nel frame di "SX" che carichi contemporaneamente due pagine diverse nei due frames di destra: "alto" e "centrale". Per fare questo e' necessario inserire qualche riga di codice javascript. La prima parte del codice va inserita tra <HEAD></HEAD>: <HEAD> <script language="JavaScript"> <!-- Hiding function loadtwo(page2, page3) {
parent.centrale3.location.href=page3; // --> </script> </HEAD> Mentre la seconda parte va inserita tra <BODY></BODY> dove si vuole inserire il link: <BODY> <FORM NAME="buttons">
onClick="loadtwo('nuovo1.htm','nuovo2.htm')"> </BODY> Clicca qui per una prova.
|
