HTML Tag Novità HTML5: Audio e Video

Tag 2  Il tag viene utilizzato per inserire oggetti (immagini, audio, video, Java applets, ActiveX, filmati flash, …) all’interno di una pagina HTML  Per l’inserimento delle immagini è preferibile il tag  Per l’inserimento di audio e video si utilizzano i tag e  E’ supportato da tutti i principali browser  Può essere utilizzato per inserire una pagina HTML all’interno di un’altra Alice Pavarani <object type=“text/html” height=“500” width=“500” data=“

Attributi principali di Alice Pavarani3  data specifica l’URL della risorsa da usare come oggetto  form specifica uno o più form a cui l’oggetto appartiene  height, width altezza e larghezza dell’oggetto nella pagina  name nome identificativo dell’oggetto  type MIME della risorsa specificata nell’attributo data  Almeno uno tra gli attributi data e type deve essere definito

MIME Alice Pavarani4  Multipurpose Internet Mail Extension  E’ uno standard di Internet che specifica il tipo di dati che vengono trasferiti attraverso i protocolli di comunicazione HTTP o SMTP (il protocollo di trasmissione delle )  La versione MIME è formalmente rimasta la 1.0 dal 1992… (  I tipi di contenuto predefiniti sono sette:  text  audio  image  video  application (rappresenta il tipo di dati generato o utilizzato da un particolare applicativo)  message  multipart  Ogni tipo ha dei sottotipi Riferimento MIME tipi elementari tipi composti

MIME: esempi Alice Pavarani5  text  text/html  text/vcard  text/plain (.c/.c++)  audio  audio/mpeg  audio/vnd.rn-realaudio  image  image/gif  image/jpg  image/vnd.adobe.photoshop  video  video/quicktime  video/mp4  video/x-flv (flash video.flv)  video/avi  application  application/zip  application/pdf  application/java (.class)  application/x-latex (.tex)  application/x-shockwave-flash  message  message/http  multipart  multipart/form-data

Audio e Video in HTML5 Alice Pavarani6  In HTML5 audio e video vengono incorporati in una pagina Web mediante tag specifici:   Entrambi possono contenere (tra tag di apertura e tag di chiusura) il tag per definire una (o più) risorse audio/video da eseguire nell’elemento incorporato  Il browser sceglie poi la risorsa in base ai codec installati  Entrambi possono contenere (tra tag di apertura e tag di chiusura) il tag per definire un testo relativo ai media (es. sottotitoli)

Tag,, Alice Pavarani7  Attributi del tag :  src URL del file della risorsa  type MIME della risorsa specificata nell’attributo src  Attributi del tag :  controls inserisce i controlli nel player  Attributi del tag :  height, width altezza e larghezza del video nella pagina  controls inserisce i controlli nel player Il browser non supporta l’elemento audio Il browser non supporta l’elemento video

Formati supportati dai Browser Alice Pavarani8  Audio  Video MIME types audio/mpegaudio/wavaudio/ogg BrowserMP3WavOgg Internet Explorer YESNO ChromeYES FirefoxNO Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP3 YES SafariYES NO OperaNOYES MIME types video/mp4video/webmvideo/ogg BrowserMP4WebMOgg Internet Explorer YESNO ChromeYES FirefoxNO Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP4 YES SafariYESNO OperaNOYES