Oltre ai frame tradizionali esistono i frame in linea costituiti dal tag iframe (il nome del tag corrisponde, appunto, alla contrazione di inline frame).
Non si tratta di frameset ma di elementi veri e propri della pagina che, in quanto tali, possono essere inseriti tra i vari tag del <body" di un comune documento HTML. Mentre nel frameset abbiamo una cornice che "mette insieme" diversi documenti HTML, infatti, con gli iframe si realizzano delle finestre su altre pagine all’interno di una normalissima pagina web all’interno della quale possiamo trovare, testi, immagini, tabelle, ecc.
Il tag iframe è supportato da tutti i moderni browser, solo i browser molto vecchi (come ad esempio Netscape 4) possono avere dei problemi di visualizzazione per questo tag. Al giorno d’oggi, tuttavia, eventuali incompatibilità possono essere considerate davvero irrilevanti, essendo i vecchi browser praticamente scomparsi dal mercato. Al fine di mantenere una piena compatibilità, tuttavia, è possibile inserire un testo alternativo da mostrare nel caso in cui il rowser non supporti il tag. Questo testo va inserito tra i tag <iframe> e </iframe>:
<iframe ... >
Qui scrivo il testo per i browser che non supportano gli <iframe>
</iframe>Quanto usare un iframe?
Il tag iframe è utilizzato di frequente per includere all’interno di una pagina web elementi esterni, ad esempio di altri siti web, come video o banner pubblicitari. In questo modo il designer del documento HTML non deve preoccuparsi di gestire elementi complessi come Javascript o Flash ma può limitarsi ad "aprire una finestra" su un documento remoto che si occupa di gestire, in autonomia, gli effetti che si desidera includere nel documento.
Gli attributi del tag iframe
Vediamo un esempio e supponiamo di voler inserire (all’interno di una ipotetica pagina "index.html") un banner pubblicitario erogato da un sito terzo:
<html>
<head>
<title>I frame HTML</title>
</head>
<body>
<h1>Articolo di esempio </h1>
<p>...</p>
<p>...</p>
<iframe src="http://www.sitoesterno.ext/banner.php?partner=123" width="728> height="90"></iframe>
<p>...</p>
<p>...</p>
</body>
</html>L’attributo fondamentale del tag iframe è src che, esattamente come accade per altri tag come <img>, serve per indicare il percorso (locale o assoluto) della risorsa che si desidera includere nella pagina. Oltre a questo, il tag in questione prevede gli attributi:
- height e width (per definire le dimensioni in altezza e larghezza; le dimensioni s’intendono in pixel);
- frameborder (valore numerico corrispondente allo spessore di eventuale bordo);
- marginwidth e marginheight (margine in larghezza e in altezza);
- scrolling (indica se mostrare o meno le barre di scorrimento all’interno del iframe; può avere come valori: auto, yes, no);
Ad esclusione di width ed height, gli altri attributi del tag iframe sono oggi deprecapi nell’HTML5.
Per quanto riguarda l’aspetto del tag è possibile utilizzare l’attributo style o assegnare una classe di stilizzazione attraverso l’uso dei CSS.
Per maggiori informazioni vi invito a leggere la referenza completa del tag IFRAME.
