In HTML, è possibile incorporare contenuti audio e video direttamente nelle pagine web utilizzando rispettivamente i tag <audio> e <video>. Analizziamo prima l'incorporamento dell'audio:

Incorporamento di Audio

Il tag <audio> incorpora contenuti audio in un documento HTML. Consente la riproduzione di file audio direttamente all'interno del browser.

Attributi Audio

• controls: Aggiunge i controlli standard dell'audio, come riproduzione, pausa e regolazione del volume, al lettore;
• autoplay: Specifica se l'audio deve iniziare automaticamente la riproduzione al caricamento della pagina;
• loop: Specifica se l'audio deve essere riprodotto in modo continuo.

Esempio:

<audio controls autoplay loop>
  <!-- Some other tags -->
</audio>

Potresti aver notato che abbiamo solo specificato le caratteristiche del lettore audio, ma non abbiamo indicato da dove proviene l'audio. Abbiamo bisogno del tag <source>.

Sorgente

Il tag <source> viene utilizzato all'interno del tag <audio> per specificare l'URL del file audio e i suoi attributi. Possiamo utilizzare l'attributo src per indicare l'URL del file audio e l'attributo type per specificare il tipo MIME del file audio.
Esempio:

<audio controls autoplay loop>
  <source src="audio-url.mp3" type="audio/mpeg" />
  <source src="audio-url.ogg" type="audio/ogg" />
  Your browser does not support the audio element.
</audio>

Nell'esempio sopra:

• Il tag <audio> include attributi come controls, autoplay e loop;
• I tag <source> specificano gli URL di origine dei file audio e i loro tipi MIME;
• Se il browser non supporta il tag <audio> o i formati audio specificati, viene visualizzato il testo alternativo Your browser does not support the audio element..

Video tutorial