00 30/10/2004 16:45


I frame o pannelli


Con i frame iniziamo un "nuovo capitolo del web design". Quello relativo al layout del sito, quindi alla sua struttura. I frame sono stati molto usati, anche se ora come ora si preferiscono altre tecniche di layout (livelli). Sono proprio i guru del W3C che ne frenano l'utilizzo.
Ma vediamo come realizzarli passo dopo passo.


Prima di tutto, è necessario creare un documento nuovo che gestisca la struttra in frame del sito:


<html>

<head>

<title>

</title>

</head>

<frameset cols="20%","80%">

<frame name="indice" src="pagina_indice.html" target="indice" scrolling=no noresize frameborder=0>

<frame name="contenuto" src="prima_pagina.html" target="contenuto" scrolling=yes noresize frameborder=0>

</frameset>

</html>


Come si può notare alla fine dell'head viene inserito il tag frameset con i suoi attributi: divisione in due colonne, una di dimensione pari al 20% della pagina, l'altra pari all'80%. Nelle due colonne verranno caricate due pagine: nella prima (quella pari al 20%), comparirà "pagina_indice.html", nell'altra "prima_pagina.html".

Andiamo avanti...

Realizziamo le due pagine, quella con l'elenco dei contenuti, o indice, e quella col contenuto vero e proprio.

Nel tag frame src compare anche il target. Perchè? Ci serve essenzialmente per definire dove devono comparire le pagine che corrispondono ai link elencati nella pagina_indice.html.

Ho inserito anche l'attributo bordergrame nei tag relativi ai due frame per impedire che venisse visualizzato il bordo tra un frame e l'altro.

In frame src ho provveduto a togliere la barra di scorrimento (scrolling) dalla pagina con l'indice del contenuto del sito. In più ho aggiunto l'attributo noresize per impedire all'utende di modificare la dimensione dei pannelli.


IMPORTANTE!! Nell'indice, prima del tag </head> è necessario introdurre il tag <base target="contenuto">. Così facendo, ogni pagina corrispondente al link selezionato, verrà visualizzata nella colonna nominata "contenuto" (in questo caso, nella colonna più grande, pari all'80% della dimensione dello schermo).


Tutto ok??? Domande?