La Guida On-Line all'HTML per l'Internet Publishing tutta in Italiano
(C) 1995-98 by Flavio Del Greco e Valerio Zanini

Creare FRAMES

   I Frames sono l'ultima novità supportata da browser come Netscape 2 o MS Internet Explorer. Essi danno la possibilità di creare finestre multiple all'interno della finestra del browser; ad esempio, si potrebbe lasciare sempre una finestra con il proprio logo, oppure con un indice sempre attivo (come per esempio questa stessa pagina). La cosa può risultare molto bella e molto utile; bisogna solo stare attenti a non abusarne: il fatto di caricare più finestre (che in pratica consistono in più pagine HTML vere e proprie) rallenta inesorabilmente il collegamento; inoltre l'uso eccesivo di finestre può creare confusione, oltre a limitare lo spazio per ogni singola finestra.
   Passiamo dunque ad analizzare i codici HTML che servono per creare i frames.

   Innanzi tutto ci deve essere una pagina, quella che viene caricata per prima, con le indicazioni delle finestre; essa avrà una struttura del tipo:
<HTML>

<HEAD>
<TITLE> Titolo della pagina </TITLE>
</HEAD>

<FRAMESET>
Descrizione delle finestre
</FRAMESET>

<NOFRAMES>
<BODY>
Corpo della pagina per browser
che non supportano i frames
</BODY>
</NOFRAMES>

</HTML>

   La descrizione delle finestre consta di una serie di indicazioni sulla posizione e dimensione dei singoli frames; gli attributi di FRAMESET sono: ROWS e COLS, che rispettivamente suddividono la finestra principale del browser per righe o per colonne.
   I valori di ROWS e COLS, descrivono le dimensioni delle finestre, che possono essere date secondo varie modalità:

  - con un numero che indica le dimensioni in pixel delle finestra; ad esempio se voglio dividere la finestra in tre righe posso fare: <FRAMESET ROWS="150,400,100">. In questo modo, però, si possono avere conflitti con la dimensione totale della finestra del browser; per ovviare si può fare come segue.
  - con valori percentuali rispetto alla dimensione totale; ad esempio: <FRAMESET ROWS="10%,70%,20%">. Da notare, che se la somma delle percentuali non è 100, il browser automaticamente scalerà tutte le finestre in maniera proporzionata.
  - con una misura relativa, indicata con un asterisco. Posso ad esempio scrivere <FRAMESET COLS="*,2*,*"> per creare tre finestre, di cui quella centrale è larga il doppio delle due laterali, che sono larghe uguali.

  Le tre modalità possono essere usate contemporaneamente; se ad esempio scrivo <FRAMESET ROWS="150,*,*"> otterrò la suddivisione in tre finestre, la prima alta 150 pixel, e le altre si divideranno in parti uguali lo spazio che avanza.

  Altri attributi di FRAMESET sono:
  • FRAMEBORDER: seleziona se visualizzare o meno i bordi dei frames ("YES" o "NO"). Ad esempio, la pagina che stai leggendo è suddivisa in due frame, il menu di sinistra e la pagina principale, senza bordo.
  • BORDERCOLOR: in presenza del bordo, questo attributo permette di impostarne il colore.
  • BORDER: imposta lo spessore del bordo dei frame.
  • FRAMESPACING: imposta lo spazio che deve essere lasciato vuoto fra i vari frames.

      NOTA: questi quattro attributi non sono riconosciuti allo stesso modo dai due browser principali (Netscape e Internet Explorer). Quindi, come al solito, è bene utilizzare tutti gli attributi contemporaneamente: ogni browser riconoscerà i suoi. Ad esempio, se si vogliono eliminare i bordi (come in questa pagina), è bene usare un comando del tipo:
    <FRAMESET COLS/ROWS="...." FRAMEBORDER="NO" BORDER="0" FRAMESPACING="0">

       Dopo aver definito la suddivisione, bisogna indicare cosa inserire in ogni singola finestra. Ciò viene fatto con il tag <FRAME>; ovviamente ci devono essere tanti di questi tag quante sono le finestre dichiarate con FRAMESET; l'ordine dei FRAME corrisponderà all'ordine della suddivisione dichiarata in FRAMESET; gli attributi di FRAME sono:

      - SRC: attributo obbligatorio, il cui valore è l'URL della pagina che dovrà essere inserita nella finestra;
      - NAME: alla finestra può essere dato un nome, valore di questo attributo, che verraà usato come descritto più avanti. Da notare che il nome deve iniziare con un carattere alfanumerico, per ragioni che vedremo più avanti.
      - MARGINWIDTH e MARGINHEIGTH: il valore di questi attributi indicherà, rispettivamente, lo spazio, in pixel, da lasciare oi margini destro-sinistro o superiore-inferiore.
      - SCROLLING: indica se vogliamo forzare o meno ("yes" o "no") la presenza delle barre discorrimento della finestra. Il valore "auto", quello di default, indica che le barre di scorrimento verranno messe solo se necessario.
      - NORESIZE: la presenza di questo attributo, indica che la dimensione delle finestre non può essere modificata, cosa per default possibile.

       Nel caso in cui il browser dell'utente che carica la pagina non dovesse supportare i frames, verrà visualizzato ciò che è compreso nel BODY fra i tag NOFRAMES.

       NOTA IMPORTANTE: i tag FRAMESET, possono essere annidati, per dividere la finestra sia per righe che per colonne !!!
       Vediamo ora un esempio "completo": dividiamo lo spazio disponibile in due righe, la prima divisa in tre colonne, la seconda in due. Per vedere il risultato del listato che segue, clicca qui

    <HTML>

    <HEAD>
    <TITLE> Pagina di esempio per FRAMES </TITLE>
    </HEAD>

    <FRAMESET ROWS="*,3*">
        <FRAMESET COLS="20%,60%,20%">
            <FRAME SRC="fin1.htm" SCROLLING="yes">
            <FRAME SRC="fin2.htm">
            <FRAME SRC="fin3.htm" SCROLLING="yes">
        </FRAMESET>
        <FRAMESET COLS="*,*">
            <FRAME SRC="fin4.htm">
            <FRAME SRC="fin5.htm" NORESIZE>
        </FRAMESET>
    </FRAMESET>
    <NOFRAMES>
    <BODY>
    Corpo della pagina per browser
    che non supportano i frames
    </BODY>
    </NOFRAMES>

    </HTML>


       Manca da discutere la gestione dei collegamenti in pagine contenenti frames.
       Avevamo visto che ad una finestra poteva essere assegnato un nome: questo nome può essere utilizzato per indicare la finestra di destinazione di un'ancora. Basterà aggiungere alla tag <A> l'attributo TARGET con, come valore, il nome della finestra in cui si vuole inviare la destinazione dell'ancora. In questo modo, si può, ad esempio, tenere un indice semmpre attivo in una finestra piccola, che invii i collegamenti sulla finestra principale.
       Se si vuole dare un target di default per tutti i link, esiste il tag <BASE TARGET="nome finestra">. In questo modo, tutte le ancore in cui non sia specificato diversamente, invieranno la pagina in tale finestra.

       Avevamo anche detto che il nome della finestra deve iniziare con un carattere alfanumerico; questo perchè esistono dei TARGET con uso speciale; essi sono:
      "_blank": la pagina sarà visualizzata, a schermo intero, in una nuova sessione del browser;
      "_self": la pagina sarà visualizzata nella stessa finestra, come da default; la cosa serve nel caso si sia specificato un BASE TARGET.
      "_parent": la pagina sarà visualizzata nel FRAMESET in cui è presente la finestra in cui si trova l'ancora.
      "_top": la pagina sarà visualizzata a tutto schermo, eliminando quindi ogni composizione in frames.

       Da notare che se in una finestra si richiama una pagina contenente anch'essa frames, essi verranno ricostruiti tutti all'interno della finestra !!! Quindi attenzione a non dimenticarsi i corretti TARGET !
       Clicca qui per un esempio di cosa puoi fare: in particolare, prova a cliccare, nella finestra 5, dove c'è scritto "PROVA QUI !!!"... e poi ancora... e ancora... ti accorgerai dei problemi che possono nascere se non si stà attenti !!!
    • Indietro all'INDICE GENERALE

    WebKit
    (C) 1995-98 by Valerio Zanini e Flavio Del Greco
    Tutti i diritti riservati.

    Se avete qualsiasi suggerimento o correzione vi preghiamo di contattarci attraverso E-Mail.
    I diritti di riproduzione di questa guida appartengono agli autori. Per richiedere permessi di duplicazione parziale di quanto qui contenuto o per ulteriori informazioni non esitate a scriverci.