La musica ed i suoni non sono indispensabili ai fini di un buon documento html ma a volte capita di dover inserire un brano audio. Poco importa che si tratti di musica o di un discorso parlato, il metodo per inserirlo resta sempre lo stesso.
In html 4.01 si fa uso di <object>, html5 ha introdotto il nuovo tag <audio>, noi qui descriveremo anche <bgsound> ed <embed> sebbene il primo sia proprietario dei soli browser IE e l’altro riconosciuto da vari browser ma deprecato in html 4.01 rielaborato con nuovi attributi ed utilizzato da HTML5.
Vi ricordo che per come lavora il browser qualsiasi oggetto inserito in una pagina web per essere visualizzato o, come nel nostro caso, per essere ascoltato, lo si deve prima scaricare nella memoria interna del browser. Se ne deduce che files molto grandi (pesanti) richiederanno tempi piuttosto lunghi a seconda del tipo di file usato e dalla qualità della connessione del visitatore.
<bgsound>
L’elemento <bgsound> necessita di attributi di cui almeno uno necessariamente obbligatorio: src. Questo tag non necessita del relativo elemento di chiusura </bgsound>. Questo elemento è dei soli browser IE, non è supportato da HTML 4.01 e meno ancora da HTML5
src
L’attributo src specifica il nome del file audio da riprodurre, questo può essere in formato: wav, midi, mp3 o qualsiasi altro formato audio valido purché supportato dal plug-in o programma associato nel PC per la riproduzione dei file audio. Il brano così richiamato si avvierà automaticamente.
loop
Con l’attributo loop si stabilisce il numero di volte che il brano deve essere ripetuto, se al posto di un numero viene inserito il termine “infinite” il brano sarà ripetuto all’infinito.
Non adoperatelo, è dei soli browser IE, non è supportato da nessun altro browser.
<embed>
L’elemento <embed> supporta attributi quali: src, loop, hidden, autostart, width, heigth ed è riconosciuto dai vari browser, IE compreso a partire però dalla versione 4.0. Questo tag non necessita del relativo elemento di chiusura. Questi gli attributi possibili:
Disapprovato! dal W3C a favore di object
src
L’attributo src specifica il nome del file audio da riprodurre, questo può essere in formato: wav , midi, mp3 o qualsiasi altro formato audio valido purché supportato dal plug-in o programma associato al PC per la riproduzione audio. Il brano così richiamato si avvierà automaticamente.
Se non vengono specificate le dimensioni con width e heigth il browser IE visualizzerà l’intera interfaccia grafica per offrire il controllo diretto sul player, compresi: volume, avvio, stop, pausa.
loop
Con l’attributo loop si stabilisce se il brano deve essere ripetuto all’infinito (true) o una sola volta (false).
autostart”
Con l’attributo autostart si stabilisce se il brano deve avviarsi da solo, automaticamente (true), oppure no (false).
hidden
Con l’attributo hidden si stabilisce se l’interfaccia grafica deve essere visibile (false), oppure nascosta (true).
width heigth
Gli attributi width e heigth servono per impostare la porzione visibile dell’interfaccia grafica. Questa varia a seconda del browser adoperato, per IE la mancanza di valori farà si che sia visualizzata per intero. A volte è più comodo avere solo i pulsanti.
Queste dimensioni variano a seconda del programma associato al browser adoperato, per questo motivo è preferibile non far vedere alcuna interfaccia, oppure affidarsi ad uno script che una volta intercettato il tipo di browser richiami o una dimensione o un’altra. Si veda a questo proposito la sez. F.A.Q.
<noembed>…</noembed>
L’elemento <noembed> esegue il codice html in esso contenuto soltanto nel caso in cui il browser non supportasse l’elemento <embed>.
Si potrebbe assemblare un codice html che adoperi <embed>, e nel caso in cui questo non dovesse essere supportato, vedi alcune versioni del browser IE, richiamare <bgsoud>. Così facendo si avrebbe quasi la certezza di riuscire a far ascoltare la musica a qualsiasi tipo di browser. Questo tag necessita del relativo tag di chiusura </noembed>
<noembed><bgsound src=”nome_file.mid”></noembed>
<object>…</object>
L’elemento <object> serve per definire un oggetto generico incorporato. Viene utilizzato anche per altri tipi di oggetti quali filmati, applets, ed altro ancora. Nel nostro caso sfruttando alcuni suoi attributi sarà possibile fargli riprodurre un brano musicale. Si farà uso oltre che di type e data anche dell’elemento <param> grazie al quale definire le preferenze di impostazione. Questo tag non necessita del relativo elemento di chiusura </<object>>
<param name=“src” value=”nome_file.mid”></param>
</object>
type
L’attributo type di <object> specifica quale sia il tipo di file da riprodurre, di solito per i file audio si possono avere file di tipo: midi, mp3, wav, ogg. Per ognuno di questi esiste un’apposita sigla:
<param name=”src” value=”nome_file.mid”>
</object>
Questa la tabella dei tipi mime per i files audio:
audio/x-mid | = | mid |
audio/x-wav | = | wav |
audio/mpeg | = | mp3 |
application/ogg | = | ogg |
<param>
L’elemento <param> serve per l’inizializzazione di un oggetto. Ha diversi attributi ma nel nostro caso useremo: src, autostart e loop che serviranno per passare ad object i valori dei parametri da noi specificati.
<param name src value
Con l’attributo src value si specifica il nome del brano completo della sua estensione ed eventuale percorso (path) per raggiungerlo.
<param name=“src” value=”nome_file.mid“>
</object>
<param name autostart value
Con l’attributo autostart value si stabilisce se il brano deve avviarsi automaticamente: value=”true“, oppure no value=”false“, sono ammessi anche valori come “1” e “0“.
<param name=”src” value=”nome_file.mid”>
<param name=”autostart” value=”false“>
</object>
param name loop
Con l’attributo loop si stabilisce se il brano deve essere ripetuto all’infinito: value=”true” o una sola volta value=”false” sono ammessi anche valori come “1” e “0“.
<param name=”src” value=”nome_file.mid”>
<param name=”autostart” value=”0″>
<param name=”loop” value=”1“>
</object>
Nota: ho fatto uso di un file midi per due motivi, il primo perchè questo formato è molto leggero e non richiede tempi di attesa lunghi prima di essere riprodotto. Il secondo è che quel midi l’ho creato io anche se grazie ad un apposito programma, questo mi garantisce da eventuali problemi di violazione del diritto d’autore. Fate sempre molta attenzione ai brani audio che riproducete sul vostro sito, meglio avere il permesso da parte del suo autore o essere certi che siano brani musicali free.
Se avete domande potete scrivere sul forum di supporto, gratuito e aperto a tutti.