Impara Incorporare Audio e Video per Contenuti Multimediali Ricchi

Incorporazione Audio

Puoi utilizzare l'elemento <audio> per includere file audio su una pagina web. Consideriamo un esempio:

index.html

In questo esempio:

L'elemento <audio> contiene un elemento <source>, che specifica l'URL e il tipo di file dell'audio. I formati comunemente supportati sono MP3 e OGG;
L'attributo controls visualizza i controlli di riproduzione standard come play, pausa e volume;
Se il browser dell'utente non supporta l'elemento audio, verrà visualizzato un messaggio di fallback.

Gli attributi aggiuntivi comunemente usati con l'elemento audio HTML includono:

autoplay: avvia la riproduzione del file audio non appena la pagina viene caricata;
loop: fa sì che il file audio si ripeta continuamente;
muted: disattiva l'audio per impostazione predefinita;
volume: specifica il livello di volume predefinito per il file audio, variando da 0.0 (silenzioso) a 1.0 (volume massimo).

Ecco un esempio che dimostra l'uso di tutti questi attributi:

index.html

Incorporazione di Video

Puoi incorporare file video su una pagina web utilizzando l'elemento <video>. Considera il seguente esempio:

index.html

In questo esempio:

L'elemento <video> contiene un elemento <source>, che specifica l'URL e il tipo di file del video. I formati comunemente supportati sono WebM, MP4 e OGG;
L'attributo controls visualizza i controlli di riproduzione standard;
Se il browser dell'utente non supporta l'elemento video, verrà visualizzato un messaggio di fallback.

Gli attributi comunemente usati per l'elemento video HTML includono:

autoplay: avvia la riproduzione del file video non appena la pagina viene caricata;
loop: fa sì che il file video si ripeta continuamente;
muted: disattiva l'audio per impostazione predefinita;
volume: specifica il livello di volume predefinito per il file audio, variando da 0.0 (silenzioso) a 1.0 (volume massimo);
poster: specifica l'URL di un'immagine da visualizzare come miniatura del video prima che il video venga riprodotto;
width e height: specifica la larghezza e l'altezza del lettore video in pixel.

Ecco un esempio che dimostra l'uso di tutti questi attributi:

index.html

Nota

Inoltre, ci sono molte librerie JavaScript e API disponibili che forniscono funzionalità aggiuntive per la riproduzione e la manipolazione di contenuti video sul web.

Tutto è chiaro?

Grazie per i tuoi commenti!

Sezione 4. Capitolo 5

Chieda ad AI

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

Suggested prompts:

Can you show me a complete example of embedding both audio and video on a web page?

What are some best practices for using audio and video elements in HTML?

Can you explain how to use JavaScript to control audio or video playback?

Scorri per mostrare il menu

Incorporazione Audio

Puoi utilizzare l'elemento <audio> per includere file audio su una pagina web. Consideriamo un esempio:

index.html

In questo esempio:

L'elemento <audio> contiene un elemento <source>, che specifica l'URL e il tipo di file dell'audio. I formati comunemente supportati sono MP3 e OGG;
L'attributo controls visualizza i controlli di riproduzione standard come play, pausa e volume;
Se il browser dell'utente non supporta l'elemento audio, verrà visualizzato un messaggio di fallback.

Gli attributi aggiuntivi comunemente usati con l'elemento audio HTML includono:

autoplay: avvia la riproduzione del file audio non appena la pagina viene caricata;
loop: fa sì che il file audio si ripeta continuamente;
muted: disattiva l'audio per impostazione predefinita;
volume: specifica il livello di volume predefinito per il file audio, variando da 0.0 (silenzioso) a 1.0 (volume massimo).

Ecco un esempio che dimostra l'uso di tutti questi attributi:

index.html

Incorporazione di Video

Puoi incorporare file video su una pagina web utilizzando l'elemento <video>. Considera il seguente esempio:

index.html

In questo esempio:

L'elemento <video> contiene un elemento <source>, che specifica l'URL e il tipo di file del video. I formati comunemente supportati sono WebM, MP4 e OGG;
L'attributo controls visualizza i controlli di riproduzione standard;
Se il browser dell'utente non supporta l'elemento video, verrà visualizzato un messaggio di fallback.

Gli attributi comunemente usati per l'elemento video HTML includono:

autoplay: avvia la riproduzione del file video non appena la pagina viene caricata;
loop: fa sì che il file video si ripeta continuamente;
muted: disattiva l'audio per impostazione predefinita;
volume: specifica il livello di volume predefinito per il file audio, variando da 0.0 (silenzioso) a 1.0 (volume massimo);
poster: specifica l'URL di un'immagine da visualizzare come miniatura del video prima che il video venga riprodotto;
width e height: specifica la larghezza e l'altezza del lettore video in pixel.

Ecco un esempio che dimostra l'uso di tutti questi attributi:

index.html

Nota

Inoltre, ci sono molte librerie JavaScript e API disponibili che forniscono funzionalità aggiuntive per la riproduzione e la manipolazione di contenuti video sul web.

Tutto è chiaro?

Grazie per i tuoi commenti!

Sezione 4. Capitolo 5

Incorporare Audio e Video per Contenuti Multimediali Ricchi

Incorporazione Audio

Incorporazione di Video

Awesome!

Incorporare Audio e Video per Contenuti Multimediali Ricchi

Incorporazione Audio

Incorporazione di Video