Sommario
In HTML i frame consentono agli autori di presentare i documenti in viste multiple, che possono essere finestre indipendenti o sottofinestre. Le viste multiple offrono ai progettisti un modo per mantenere determinate informazioni visibili, mentre altre viste sono fatte scorrere o sono sostituite. Ad esempio, all'interno della stessa finestra, un frame potrebbe mostrare un'insegna statica, una seconda un menu di navigazione ed una terza il documento principale, che può essere fatto scorrere o può essere sostituito navigando nel secondo frame.
Ecco un semplice documento a frame:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un semplice documento a frame</TITLE>
</HEAD>
<FRAMESET cols="20%, 80%">
<FRAMESET rows="100, 200">
<FRAME src="contenuto_del_frame1.html">
<FRAME src="contenuto_del_frame2.gif">
</FRAMESET>
<FRAME src="contentuto_del_frame3.html">
<NOFRAMES>
<P>Questo documento a frame contiene:
<UL>
<LI><A href="contenuto_del_frame1.html">Alcuni magnifici contenuti</A>
<LI><IMG src="contenuto_del_frame2.gif" alt="Una magnifica immagine">
<LI><A href="contentuto_del_frame3.html">Degli altri magnifici contenuti</A>
</UL>
</NOFRAMES>
</FRAMESET>
</HTML>
che dovrebbe creare una struttura a frame di questo genere:
--------------------------------------- | | | | | | | Frame 1 | | | | | | | | |---------| | | | Frame 3 | | | | | | | | | | | Frame 2 | | | | | | | | | | | | | | ---------------------------------------
Se il programma utente non è in grado di mostrare i frame o è configurato per non mostrarli, riprodurrà il contenuto dell'elemento NOFRAMES.
Un documento HTML che descrive l'organizzazione dei frame (chiamato un
documento frameset
) ha una composizione differente rispetto a
un documento HTML senza frame. Un documento standard possiede una sezione
HEAD ed una sezione BODY. Un documento frameset
possiede un
HEAD, ed un FRAMESET in luogo del
BODY.
La sezione FRAMESET di un documento specifica l'organizzazione delle viste nella finestra principale del programma utente. In più, la sezione FRAMESET può contenere un elemento NOFRAMES, per fornire un contenuto alternativo ai programmi utente che non supportano i frame o che sono configurati per non mostrare i frame.
Gli elementi che dovrebbero essere posizionati normalmente all'interno dell'elemento BODY non devono comparire prima del primo elemento FRAMESET o il FRAMESET sarà ignorato.
<![ %HTML.Frameset; [ <!ELEMENT FRAMESET - - ((FRAMESET|FRAME)+ & NOFRAMES?) -- suddivisione della finestra --> <!ATTLIST FRAMESET %coreattrs; -- id, class, style, title -- rows %MultiLengths; #IMPLIED -- elenco di lunghezze, predefinito: 100% (1 riga) -- cols %MultiLengths; #IMPLIED -- elenco di lunghezze, predefinito: 100% (1 colonna) -- onload %Script; #IMPLIED -- tutti i frame sono stati caricati -- onunload %Script; #IMPLIED -- tutti i frame sono stati rimossi -- > ]]>
Definizioni di attributo
Attributi definiti altrove
L'elemento FRAMESET specifica la struttura della finestra utente principale in termini di sottospazi rettangolari.
L'impostazione dell'attributo rows definisce il numero di sottospazi orizzontali in una struttura a frame. L'impostazione dell'attributo cols definisce il numero di sottospazi verticali. Entrambi gli attributi possono essere impostati simultaneamente per generare una griglia.
Se l'attributo rows non è impostato, ogni colonna si estende per l'intera lunghezza della pagina. Se l'attributo cols non è impostato, ogni riga si estende per l'intera larghezza della pagina. Se nessuno dei due attributi è impostato, il frame assume esattamente la dimensione della pagina.
I frame sono creati da sinistra a destra per le colonne e dall'alto in basso per le righe. Quando entrambi gli attributi sono specificati, le viste sono create da sinistra a destra nella riga superiore, da sinistra a destra nella seconda riga, ecc.
Questo primo esempio divide lo schermo verticalmente in due (crea cioè una metà alta ed una metà bassa).
<FRAMESET rows="50%, 50%"> ...il resto della definizione... </FRAMESET>
L'esempio successivo crea tre colonne: la seconda ha una larghezza fissa di 250 pixel (utile, ad esempio, per contenere un'immagine di dimensioni note). La prima riceve il 25% dello spazio rimanente e la terza il 75% dello spazio rimanente.
<FRAMESET cols="1*,250,3*"> ...il resto della definizione... </FRAMESET>
L'esempio seguente crea una griglia 2x3 di sottospazi.
<FRAMESET rows="30%,70%" cols="33%,34%,33%"> ...il resto della definizione... </FRAMESET>
Per il prossimo esempio, supponiamo che la finestra del browser abbia un'altezza corrente di 1000 pixel. Alla prima vista è destinato il 30% dell'altezza totale (300 pixel). La seconda vista è definita per essere alta esattamente 400 pixel. Questo lascia 300 pixel da dividersi tra gli altri due frame. L'altezza del quarto frame è definita come "2*", in modo che esso sia alto due volte il terzo frame, la cui altezza è soltanto "*" (equivalente a 1*). Perciò il terzo frame sarà alto 100 pixel e il quarto sarà alto 200 pixel.
<FRAMESET rows="30%,400,*,2*"> ...il resto della definizione... </FRAMESET>
Lunghezze assolute che non assommano al 100% dello spazio reale disponibile dovrebbero essere adattate dal programma utente. Se sottodimensionate, lo spazio rimanente dovrebbe essere ripartito proporzionalmente tra ogni vista. Se sovradimensionate, ogni vista dovrebbe essere ridotta in base alla sua proporzione specificata dello spazio totale.
I frameset possono essere annidati a qualsiasi livello.
Nell'esempio successivo, il FRAMESET esterno divide lo spazio disponibile in tre colonne uguali. Il FRAMESET interno divide poi la seconda area in due righe di altezza diseguale.
<FRAMESET cols="33%, 33%, 34%">
...contenuto del primo frame...
<FRAMESET rows="40%, 50%">
...contenuto del secondo frame, prima riga...
...contenuto del secondo frame, seconda riga...
</FRAMESET>
...contenuto del terzo frame...
</FRAMESET>
Gli autori possono condividere dati tra frame diversi, includendo questi dati per mezzo dell'elemento OBJECT. Gli autori dovrebbero includere l'elemento OBJECT nell'elemento HEAD di un documento frameset ed attribuirgli un nome tramite l'attributo id. Qualsiasi documento che sia il contenuto di un frame nel frameset può far riferimento a questo identificatore.
L'esempio seguente illustra come uno script potrebbe riferirsi ad un elemento OBJECT definito per un intero frameset:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Questo è un frameset con OBJECT all'interno di HEAD</TITLE>
<!-- Quest'oggetto non viene riprodotto! -->
<OBJECT id="miooggetto" data="data.bar"></OBJECT>
</HEAD>
<FRAMESET>
<FRAME src="bianca.html" name="bianca">
</FRAMESET>
</HTML>
<!-- In bianca.html -->
<HTML>
<HEAD>
<TITLE>La pagina di Bianca</TITLE>
</HEAD>
<BODY>
...inizio del documento...
<P>
<SCRIPT type="text/javascript">
parent.miooggetto.miaproprieta
</SCRIPT>
...resto del documento...
</BODY>
</HTML>
<![ %HTML.Frameset; [ <!-- i nomi di frame riservati cominciano con "_" altrimenti cominciano con una lettera --> <!ELEMENT FRAME - O EMPTY -- sottofinestra --> <!ATTLIST FRAME %coreattrs; -- id, class, style, title -- longdesc %URI; #IMPLIED -- collegamento ad una descrizione lunga (integra title) -- name CDATA #IMPLIED -- nome di frame per l'indirizzamento -- src %URI; #IMPLIED -- sorgente di contenuto di frame -- frameborder (1|0) 1 -- servono bordi per il frame? -- marginwidth %Pixels; #IMPLIED -- larghezza del margine in pixel -- marginheight %Pixels; #IMPLIED -- altezza del margine in pixel -- noresize (noresize) #IMPLIED -- permettere agli utenti di ridimensionare i frame? -- scrolling (yes|no|auto) auto -- barre di scorrimento oppure no -- > ]]>
Definizioni di attributo
Attributi definiti altrove
L'elemento FRAME definisce il contenuto e l'aspetto di un singolo frame.
L'attributo src specifica il documento iniziale che il frame conterrà.
Il seguente documento HTML di esempio:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un documento organizzato a frame</TITLE>
</HEAD>
<FRAMESET cols="33%,33%,33%">
<FRAMESET rows="*,200">
<FRAME src="contenuto_del_frame1.html">
<FRAME src="contenuto_del_frame2.gif">
</FRAMESET>
<FRAME src="contenuto_del_frame3.html">
<FRAME src="contenuto_del_frame4.html">
</FRAMESET>
</HTML>
dovrebbe creare una struttura a frame di questo tipo:
------------------------------------------ |Frame 1 |Frame 3 |Frame 4 | | | | | | | | | | | | | | | | | | | | | | | | | | | | | -------------| | | |Frame 2 | | | | | | | | | | | ------------------------------------------
e far sì che il programma utente carichi ciascun file entro una vista separata.
Il contenuto di un frame non deve trovarsi nello stesso documento in cui vi è la definizione del frame.
ESEMPIO ILLEGALE:
La seguente definizione di un frameset non è HTML legale poiché il contenuto del secondo
frame si trova nello stesso documento del frameset.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un documento organizzato a frame</TITLE> </HEAD> <FRAMESET cols="50%,50%"> <FRAME src="contenuto_del_frame1.html"> <FRAME src="#ancora_nello_stesso_documento"> <NOFRAMES> ...del testo... <H2><A name="ancora_nello_stesso_documento">Sezione importante</A></H2> ...del testo... </NOFRAMES> </FRAMESET> </HTML>
L'esempio successivo illustra l'uso degli attributi decorativi di FRAME. Specifichiamo che il frame 1 non consentirà barre di scorrimento. Il frame 2 lascerà dello spazio bianco intorno al suo contenuto (inizialmente un file immagine) ed il frame non sarà ridimensionabile. Nessun bordo sarà tracciato tra i frame 3 e 4. Bordi saranno tracciati (per impostazione predefinita) tra i frame 1, 2 e 3.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un documento organizzato a frame</TITLE>
</HEAD>
<FRAMESET cols="33%,33%,33%">
<FRAMESET rows="*,200">
<FRAME src="contenuto_del_frame1.html" scrolling="no">
<FRAME src="contenuto_del_frame2.gif"
marginwidth="10" marginheight="15"
noresize>
</FRAMESET>
<FRAME src="contenuto_del_frame3.html" frameborder="0">
<FRAME src="contenuto_del_frame4.html" frameborder="0">
</FRAMESET>
</HTML>
Nota. Per informazioni sull'uso corrente nel determinare la destinazione di un frame, si consultino per favore le note sui frame nell'appendice.
Definizioni di attributo
Si consulti per favore la sezione sui nomi di frame di destinazione per informazioni sui nomi di frame riconosciuti.
Questo esempio illustra come le destinazioni consentano la modifica dinamica del contenuto di un frame. In primo luogo definiamo un frameset nel documento frameset.html, mostrato qui:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un documento organizzato a frame</TITLE> </HEAD> <FRAMESET rows="50%,50%"> <FRAME name="fisso" src="init_fisso.html"> <FRAME name="dinamico" src="init_dinamico.html"> </FRAMESET> </HTML>
Poi, in init_dinamico.html, creiamo un collegamento al frame denominato "dinamico".
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Un documento con ancore con destinazioni definite</TITLE>
</HEAD>
<BODY>
...inizio del documento...
<P>Ora potete passare alla
<A href="diapositiva2.html" target="dinamico">diapositiva 2.</A>
...continuazione del documento...
<P>Grande! Ora avanti alla
<A href="diapositiva3.html" target="dinamico">diapositiva 3.</A>
</BODY>
</HTML>
L'attivazione di entrambi i collegamenti apre un nuovo documento nel frame chiamato "dinamico", mentre l'altro frame, "fisso", mantiene il suo contenuto iniziale.
Attualmente non vi è modo di codificare lo stato complessivo di un frameset in un URI. Per questo motivo, molti programmi utente non consentono agli utenti di assegnare un segnalibro ad un frameset.
Quando molti collegamenti nel medesimo documento designano la stessa destinazione, è possibile specificare la destinazione una volta per tutte e fare a meno dell'attributo target in ogni elemento. Ciò si ottiene impostando l'attributo target dell'elemento BASE.
Ritorniamo all'esempio precedente, questa volta fattorizzando l'informazione sulla destinazione con il definirla nell'elemento BASE e rimuovendola dagli elementi A.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Un documento con BASE con una destinazione definita</TITLE>
<BASE href="http://www.miocom.com/Diapositive" target="dinamico">
</HEAD>
<BODY>
...inizio del documento...
<P>Ora potete passare alla <A href="diapositiva2.html">diapositiva 2.</A>
...continuazione del documento...
<P>Grande! Ora avanti alla
<A href="diapositiva3.html">diapositiva 3.</A>
</BODY>
</HTML>
I programmi utente dovrebbero determinare il frame di destinazione in cui caricare una risorsa collegata in base alle seguenti regole di precedenza (dalla priorità più alta alla più bassa):
I programmi utente dovrebbero fornire agli utenti meccanismi per annullare l'attributo target.
Gli autori dovrebbero fornire un contenuto alternativo per quei programmi utente che non supportano i frame o che sono configurati per non mostrarli.
<![ %HTML.Frameset; [ <!ENTITY % noframes.content "(BODY) -(NOFRAMES)"> ]]> <!ENTITY % noframes.content "(%flow;)*"> <!ELEMENT NOFRAMES - - %noframes.content; -- contenitore di contenuto alternativo per riproduzione non basata sui frame --> <!ATTLIST NOFRAMES %attrs; -- %coreattrs, %i18n, %events -- >
Attributi definiti altrove
L'elemento NOFRAMES specifica un contenuto che dovrebbe essere mostrato solo dai programmi utente che non supportano i frame o che sono configurati per non mostrare i frame. I programmi utente che supportano i frame dovrebbero mostrare il contenuto di una dichiarazione NOFRAMES soltanto se configurati per non mostrare i frame. I programmi utente che non supportano i frame devono mostrare il contenuto di NOFRAMES in ogni caso.
L'elemento NOFRAMES fa parte di entrambe le DTD, transitoria e a frame. In un documento che utilizza la DTD a frame, NOFRAMES può essere usato alla fine della sezione FRAMESET di un documento.
Ad esempio:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>Un documento organizzato a frame con NOFRAMES</TITLE>
</HEAD>
<FRAMESET cols="50%, 50%">
<FRAME src="principale.html">
<FRAME src="sommario.html">
<NOFRAMES>
<P>Ecco la <A href="principale-noframes.html">
versione non basata sui frame del documento.</A>
</NOFRAMES>
</FRAMESET>
</HTML>
NOFRAMES può essere usato, per esempio, in un documento che è la sorgente di un frame e che usa la DTD transitoria. Questo permette agli autori di spiegare lo scopo del documento nei casi in cui esso è visto al di fuori della struttura a frame o con un programma utente che non supporta i frame.
L'attributo longdesc consente agli autori di rendere i documenti a frame più accessibili per coloro che usano programmi utente non visuali. Questo attributo designa una risorsa che fornisce una descrizione lunga del frame. Gli autori dovrebbero considerare che le descrizioni lunghe associate con dei frame sono destinate al frame, non al contenuto del frame. Poiché i contenuti possono mutare nel corso del tempo, è possibile che la descrizione lunga iniziale divenga inappropriata per i successivi contenuti del frame. In particolare, gli autori non dovrebbero includere un'immagine come unico contenuto di un frame.
Il seguente documento organizzato a frame descrive due frame. Il frame sinistro contiene un indice ed il frame destro contiene inizialmente un'immagine di uno struzzo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un documento a frame malamente progettato</TITLE> </HEAD> <FRAMESET cols="20%, 80%"> <FRAME src="indice.html"> <FRAME src="struzzo.gif" longdesc="struzzo-desc.html"> </FRAMESET> </HTML>
Si noti che l'immagine è stata inclusa nel frame indipendentemente da qualsiasi elemento HTML, cosicché l'autore non ha altro mezzo di specificare un testo alternativo se non tramite l'attributo longdesc. Se il contenuto del frame destro cambia (ad es. l'utente seleziona un serpente a sonagli dall'indice), gli utenti non avranno nessun accesso testuale al nuovo contenuto del frame.
Pertanto gli autori non dovrebbero porre direttamente un'immagine in un frame. Al contrario, l'immagine dovrebbe essere definita in un documento HTML separato, ed ivi postillata con l'appropriato testo alternativo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <HTML> <HEAD> <TITLE>Un documento a frame ben progettato</TITLE> </HEAD> <FRAMESET cols="20%, 80%"> <FRAME src="indice.html"> <FRAME src="contenitore-struzzo.html"> </FRAMESET> </HTML>
<!-- In contenitore-struzzo.html: --> <HTML> <HEAD> <TITLE>Il veloce e potente struzzo</TITLE> </HEAD> <P> <OBJECT data="struzzo.gif" type="image/gif"> Questi struzzi certamente sanno di buono! </OBJECT> </HTML>
<!ELEMENT IFRAME - - (%flow;)* -- sottofinestra incorporata --> <!ATTLIST IFRAME %coreattrs; -- id, class, style, title -- longdesc %URI; #IMPLIED -- collegamento ad una descrizione lunga (integra title) -- name CDATA #IMPLIED -- nome di frame per l'indirizzamento -- src %URI; #IMPLIED -- sorgente di contenuto di frame -- frameborder (1|0) 1 -- servono bordi per il frame? -- marginwidth %Pixels; #IMPLIED -- larghezza del margine in pixel -- marginheight %Pixels; #IMPLIED -- altezza del margine in pixel -- scrolling (yes|no|auto) auto -- barre di scorrimento oppure no -- align %IAlign; #IMPLIED -- allineamento verticale o orizzontale -- height %Length; #IMPLIED -- altezza del frame -- width %Length; #IMPLIED -- larghezza del frame -- >
Definizioni di attributo
Attributi definiti altrove
Le informazioni da inserire in riga sono designate tramite l'attributo src di questo elemento. Il contenuto dell'elemento IFRAME, d'altra parte, dovrebbe essere mostrato soltanto dai programmi utente che non supportano i frame o che sono configurati per non mostrare i frame.
Per i programmi utente che supportano i frame, l'esempio seguente piazzerà un frame incorporato, circondato da un bordo, nel mezzo del testo.
<IFRAME src="pippo.html" width="400" height="500"
scrolling="auto" frameborder="1">
[Il tuo programma utente non supporta i frame o è attualmente configurato
per non mostrare i frame. Tuttavia, puoi visitare
<A href="pippo.html">il documento collegato.</A>]
</IFRAME>
I frame incorporati non possono essere ridimensionati (e perciò non prendono l'attributo noresize).
Nota. I documenti HTML possono essere incorporati in altri documenti HTML anche per mezzo dell'elemento OBJECT. Si veda per dettagli la sezione sui documenti incorporati.