Audio e video con HTML 5

---
---

html 5 tag per video foto

-----

Quali sono i tag per inserire video e foto in pagine di siti web realizzati con l’html 5

L’HTML 5 è entrato nella vita degli sviluppatori web, semplificando molte delle procedure classiche, in particolare sui mezzi per l’inclusione di elementi speciali. Una delle caratteristiche più innovative ed interessanti è la possibilità di integrazione di elementi audio e video con HTML 5, grazie all’ausilio di semplici tag, senza necessariamente ricorrere al Flash.

inserire audio mp3 html 5

Audio

Con il tag <audio> i programmatori che sfruttano le potenzialità dell’ HTML5 sono in grado di integrare facilmente e rapidamente file audio, e di gestire un flash player di ripiego nel caso in cui l’utente non supporti il nuovo elemento audio. L’utilizzo di questo tag è molto semplice e funziona nello stesso modo del tag <img> che, con l’ausilio dell’attributo “src”, consente di caricare file specifici.

---
---

L’elemento audio fornito dall’HTML5 consente all’amministratore di gestire alcune opzioni interessanti, tra cui l’autoplay, da utilizzare con estrema cautela per non risultare invasivi durante la navigazione; la funzionalità di loop che consente di ripetere il file audio all’infinito; l’attivazione della modalità preload che permette al browser di iniziare il buffering prima che il visitatore faccia effettivamente partire l’audio; infine la possibilità di attivare l’uso dei controlli per lasciare maggior autonomia ai visitatori.

video html5

Video

La sintassi dell’elemento <video> è la stessa dell’elemento <audio>. Ancora una volta è necessario che il programmatore utilizzi più fonti e differenti tipi di file per la codifica del medesimo video, al fine di assicurarsi il supporto su tutti i browser.

Gli attributi di autoplay, loop e preload del tag video funzionano allo stesso modo del tag audio. Esistono, però, attributi aggiuntivi specifici, come la possibilità di ridimensionare l’altezza e la larghezza del player per la visualizzazione ottimale del video.

Quando il video non è in riproduzione, poi, è possibile utilizzare l’attributo poster in grado di mostrare un’immagine specifica piuttosto che il classico primo fotogramma del video.

[fonte immagine in alto:     tutorialdock.altervista.org ]

GD Star Rating
loading...