HTML

1. HTML I tag HTML (parte 2)

2. Elenchi • Organizzare il testo in elenchi • Elenchi puntati <ul> • Elenchi numerati <ol> <ul> <li>Elemento 1</li> <li>Elemento 2</li> <li>Elemento 3</li> </ul> <ol> <li>Elemento 1</li> <li>Elemento 2</li> <li>Elemento 3</li> </ol> Alice Pavarani

3. Tabelle: <table> • Organizzare il testo per righe e colonne • Struttura gerarchica del tag<table> • tag<tr> (tablerow), righe di celle • tag<td> (table data), celle • tag<th>(tableheader), celle di intestazione • Sempre lo stesso numero di celle inserite in ogni riga (essendo il numero di colonne) • Le righe procedono dall’alto verso il basso • Le celle procedono da sinistra verso destra • Ogni cella può contenere qualsiasi cosa (testo, immagini, link, liste, altre tabelle…) <table> <tr> <th>Titolo colonna 1</th> <th>Titolo colonna 2</th> </tr> <tr> <td>Cella 1,1</td> <td>Cella 1,2</td> </tr> <tr> <td>Cella 2,1</td> <td>Cella 2,2</td> </tr> </table> Alice Pavarani

4. Tag <object> • Inserire oggetti (immagini, audio, video, Java applets, ActiveX, filmati flash, …) all’interno di una pagina HTML • Per l’inserimento delle immagini è preferibile il tag<img> • Per l’inserimento di audio e video si utilizzano i tag<audio> e <video> • Può essere utilizzato per inserire una pagina HTML all’interno di un’altra HTML 5 <objecttype=“text/html” height=“500” width=“500” data=“http://www.itis.pr.it”> </object> Alice Pavarani

5. Tag <object> Attributi principali: • data URL della risorsa usata come oggetto • height, width altezza e larghezza dell’oggetto nella pagina • namenome identificativo dell’oggetto • typeMIME della risorsa specificata nell’attributo data • Almeno uno tra gli attributi data e type deve essere definito Alice Pavarani

6. MIME • 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 email) • La versione MIME è formalmente rimasta la 1.0 dal 1992… (http://en.wikipedia.org/wiki/Internet_media_type) • Esempi Riferimento MIME http://www.iana.org/assignments/media-types/media-types.xhtml • text • text/html • text/plain(.c/.c++) • audio • audio/mpeg • 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) Alice Pavarani

7. Audio e Video in HTML5 HTML 5 • Tag specifici in HTML5 per incorporare audio e video • <audio> • <video> • Contengono (tra tag di apertura e tag di chiusura) il tag<source> • Definisce una (o più) risorse da eseguire nell’elemento incorporato • Il browser sceglie la risorsa in base ai codec installati • Contengono (tra tag di apertura e tag di chiusura) il tag<track> • Definisce un testo relativo al media (es. sottotitoli) Alice Pavarani

8. Tag <source> , <audio> , <video> HTML 5 • Attributi del tag<source>: • src URL del file della risorsa • typeMIME della risorsa specificata nell’attributo src • Attributi del tag<audio>: http://www.w3schools.com/tags/tag_audio.asp • controlsinserisce i controlli nel player • Attributi del tag<video>: http://www.w3schools.com/tags/tag_video.asp • height, widthaltezza e larghezza del video nella pagina • controlsinserisce i controlli nel player <audio controls> <source src=“audio.mp3” type=“audio/mpeg> Il browser non supporta l’elemento audio </audio> <video height=“320” width=“240” controls> <source src=“video.mp4” type=“video/mp4> Il browser non supporta l’elemento video </video> Alice Pavarani

9. Formati supportati dai Browser • Audio • Video http://www.w3schools.com/html/html5_intro.asp Alice Pavarani