HTML - Incorporare Multimedia

A volte è necessario aggiungere musica o video nella tua pagina web. Il modo più semplice per aggiungere video o audio è quello di includere un tag HTML speciale chiamato <embed>. Questo tag fa sì inoltre che sia il browser stesso (se supporta il tag <embed>) ad aggiungere automaticamente dei controlli multimediali.

Si può anche indicare un tag <noembed> per quei browser che non riconoscono il tag <embed>. Ad esempio, si può mostrare un film tramite <embed>, mentre tramite il tag <noembed> mostrare una singola immagine JPG nel caso il browser non supporti il tag <embed>.

Esempio

A seguire un semplice esempio per eseguire un file midi incorporato nel documento:

<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src="/html/yourfile.mid" width="100%" height="60" >
   <noembed><img src="yourimage.gif" alt="Alternative Media" ></noembed>
</embed>
</body>
</html>

Produrrà il seguente risultato:

Si può includere qualsiasi file multimedia tramite l' attributo src. Puoi provare tu stesso cambiando il file.

Attributi del Tag <embed>

A seguire un elenco di importanti attributi che si possono utilizzare con il tag <embed>.

Attributo	Descrizione
align	Determina come allineare l'oggetto. Può essere center, left o right.
autostart	È un valore booleano che indica se il media deve partire automaticamente. Può essere true o false.
loop	Specifica se un audio dev'essere eseguito in continuazione (impostando loop su true), un certo numero di volte( un valore numerico positivo) o nessuna volta (false)
playcount	Specifica il numero di volte che dev'essere eseguito un audio. È un attributo alternativo a loop per IE.
hidden	Definisce se un oggetto multimediale dev'essere visto nella pagina. Se false non sarà mostrato, invece se true si.
width	Larghezza dell' oggetto in pixel.
height	Altezza dell' oggetto in pixel.
name	Un nome utilizzato per riferirsi all' oggetto.
src	URL dell' oggetti da incorporare.
volume	Regola il volume dell'audio. Può essere da 0 (off) a 100 (volume massimo).

Formati Video Supportati

All' interno del tag embed si possono utilizzare diversi formati di file video come Flash (.swf), AVI (.avi), e MOV (.mov).

.swf files - sono i file video creati dal programma Macromedia's Flash.
.wmv files - sono i file video creati dal Microsoft's Window's Media Video.
.mov files - sono i file video creati da Apple's Quick Time Movie.
.mpeg files - sono i file video creati con il Moving Pictures Expert Group.

<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src="/html/yourfile.swf" width="200" height="200" >
   <noembed><img src="yourimage.gif" alt="Alternative Media" ></noembed>
</embed>
</body>
</html>

Produrrà il seguente risultato:

Audio in Background

Si può utilizzare il tag <bgsound> per eseguire un file audio in background. Questo tag è supportato solo da Internet Explorer e viene ignorato dagli altri browser. Scarica e riproduce un file audio quando il documento viene scaricato e visualizzato dall'utente. Ovviamente anche il file audio in background riprenderà la riproduzione ogni volta che l'utente aggiorna il browser.

Questo tag ha solo due attributi loop e src. Entrambi questi attributi hanno lo stesso significato spiegato in precedenza.

A seguire un piccolo esempio che mostra come incorporare un file midi:

<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<bgsound src="/html/yourfile.mid">
   <noembed><img src="yourimage.gif" ></noembed>
</bgsound>
</body>
</html>

Produrrà una schermata bianca. Poichè questo tag non mostra nessuna componente, ma rimane nascosto.

Internet Explorer può anche gestire tre diversi file in formato audio: wav, il formato nativo per PC; au, il formato nativo per la maggior parte delle workstation Unix; e MIDI, un formato di codifica musicale universale.

Il tag HTML Object

HTML 4 introduce l'elemento <object>, che offre una soluzione all-purpose per includere oggetti generici. L' elemento <object> permette agli sviluppatori HTML di integrare qualsiasi file attraverso un oggetto che verrà rappresentato dall' user agent del browser.

A seguire qualche esempio:

Esempio - 1

Si può incorporare un documento HTML all' interno di un altro come mostrato di seguito:

<object data="data/test.htm" type="text/html" width="300" height="200">
  alt : <a href="data/test.htm">test.htm</a>
</object>

Here alt attribute will come into picture if browser does not support object tag.

Esempio - 2

Si può incorpare un documento PDF in un documento HTML come mostrato di seguito:

<object data="data/test.pdf" type="application/pdf" width="300" height="200">
  alt : <a href="data/test.pdf">test.htm</a>
</object>

Esempio - 3

Si possono definire dei parametri tramite il tag <param>. A seguire un esempio per incorporare un file wav:

<object data="data/test.wav" type="audio/x-wav" width="200" height="20">
  <param name="src" value="data/test.wav">
  <param name="autoplay" value="false">
  <param name="autoStart" value="0">
  alt : <a href="data/test.wav">test.wav</a>
</object>

Esempio - 4

Si può aggiungere un documento flash come mostrato di seguito:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="penguin" 
   codebase="someplace/swflash.cab" width="200" height="300">
   <param name="movie" value="flash/penguin.swf" />
   <param name="quality" value="high" />
   <img src="penguin.jpg" width="200" height="300" alt="Penguin" />
</object>

Esempio - 5

Si può incorporare un Applet Java in un documento HTML come segue:

<object classid="clsid:8ad9c840-044e-11d1-b3e9-00805f499d93" 
   width="200" height="200">
   <param name="code" value="applet.class">
</object>

L' attributo classid identifica quale versione del Plug-In Java utilizzare. Si può anche usare l' attributo facoltativo codebase per indicare se e dove scaricare la JRE.