HTML5 Reference: Tutti i nuovi tag introdotti e una breve spiegazione.
HTML5 introdurrà, al momento, 28 nuovi tag, alcuni già in uso e molto famosi come i tag Video, Canvas il Doctype o come gli elementi di sezione come Header, Nav etc. ma ne esistono molti altri meno conosciuti ma comunque molto interessanti da studiare, in questa lista sono raccolti tutti quanti accompagnati da una breve descrizione del loro scopo.
Article – Questo tag racchiude al suo interno dei contenuti informativi, come per esempio post di blog, articoli di giornali on-line, commenti, può racchiudere al suo interno altri tag come i tag di testata h1-h6 paragrafi p e altri.
Aside – Determina una sezione secondaria o laterale del sito o di un contenuto, come una sidebar di un blog, ma anche porzioni di testo ritenute meno importanti rispetto al contenuto pricipale.
Audio – Specificando al suo interno un file audio verrà creato un player nella pagina web.
Canvas – Definisce un area nella quale è possibile disegnare forme o interagire con immagini.
Command - Definisce un bottone o una zona di azione nella quale specificare cosa fare in seguito ad una azione dell’utente
Datalist – Definisce un elenco di tag option.
Details – Rappresenta un appendice di informazioni che definiscono una serie di informazioni addizionali o contolli rispetto ad un contenuto, per esempio un elenco di informazioni rispetto ad una immagine come dimensione, peso, colori, risoluzione etc.
Embed – Per integrare un contenuto esterno che deve essere incorporato in una pagina web, per esempio un filmato in Flash.
Figcaption – Contiene una didascalia descrittiva del contenuto del tag figure.
Figure – Contenitore di elementi rilevanti per la pagina web come immagini, illustrazioni, codici e script, grafici etc.
Footer – Contiene tutte le informazioni che descrivono il contenuto della pagina o delle informazioni appena consultate, come autori, copyright, fonti, documenti correlati, etc.
Header – Definisce la testata di una pagina o di un contenuto, dove devono essere introdotti e spiegati gli argomenti che si andranno a consultare, può contenere al suo interno i tag h1-h6 e hgroup.
Hgroup - Rappresenta la testata di una sezione, raccoglie al suo interno i tag h1-h6 quando per esempio per un articolo esistono titolo e sottotitolo.
Keygen – Questo tag genera una doppia chiave pubblica/privata e in seguito una richesta di certificazione di questa, che verrà mandata ad una certificate autority (CA) la quale in risposta creerà un certificato che spedirà al browser, il quale, a questo punto potrà usare questa certificazione per l’autenticazione al sito.
Può essere utile per esempio per siti aziendali che vogliono proteggere l’accesso ad alcuni dati sul consultabili tramite il e voglio che ogni accessi debba essere certificato dalla persona.
Questo tag è molto particolare e opera nel campo della sicurezza di livello molto elevato e fa parte dei form.
Mark – Definisce un termine o una porzione di testi di particolare importanza dentro un determinato contesto, oppure può servire per evidenziare i termini cercati all’interno di un contenuto.
Meter – Definisce delle misure.
Nav – Racchiude una serie di link ritenuti importanti per la navigazione interna di un sito o che portano a referenze esterne o ad ancore della stessa pagina.
Output – Rappresenta il risultato di un calcolo.
Progress – Definisce un qualcosa che è in lavorazione, può avere un valore indeterminato per indicare che non si è a conoscenza di quanto lavoro manca al termine e racchiudere al suo interno semplicemente una spiegazione del lavoro in corso, oppure può rappresentare una percenutale di lavoro svolto attraverso l’aggiunta degli attributi value per definire la parte di lavoro completato del lavoro e max. utile per rappresentare barre avanzamento.
Rp – Questo tag entra in gioco quando il browser non è in grado di visualizzare correttamente i caratteri Ruby, come quelli Cinesi e Giapponesi, sostituendo a questa mancanza del browser il contenuto del tag. Da usare in collaborazione con i tag ruby e rt
Rt – Definisce una didascalia esplicativa del contenuto del tag ruby, come la sillabazione o la pronuncia di un ideogramma. Da usare in collaborazione con i tag ruby e rp
Ruby – Rappresenta annotazioni di caratteri Ruby, quindi ideogrammi come quelli Giapponesi e Cinesi, ed è utile usarlo per quei browser che non supportano questi tipi di caratteri. Da usare in collaborazione con i tag rt e rp
Section – Questo tag rappresenta una sezione interna interna di un contenuto, per esempio un articolo, il vantaggio dell’uso del tag section è che dal punto di vista semantico potrai utilizzare al suo interno nuovmente i tag h1-h6 anche se questi sono stati usati nella stessa pagina web fuori dal tag section.
Il tag section non deve essere utilizzato per dividere il layout in diverse sezioni contenenti informazioni generiche, per quello rimane in uso il tag div.
Source – Inserito all’interno di tag Video e Audio definisce il percorso o l’url della risorsa da riprodurre, quindi rispettivamente un video o un file audio.
Summary – Serve come titolo per il tag details, questo titolo dovrà contenere il significato o una legenda degli elementi che proseguono e che sono contenuti nel tag details.
Time – Definisce una data e un orario, serve specialmente per interagire con user agent e segnalarli cose importanti da annotare come compleanni, orari di apertura di negozi etc. mentre non è pensato per conti alla rovescia e simili.
Video – Se inserito al suo interno il collegamento ad un video clip verrà creato un player per riprodurlo.
Wbr - Definisce all’interno di un testo la parola dopo la quale si preferirebbe che il testo andasse a capo, questo entrerà in gioco quindi per evitare che il browser metta a capo un testo in un punto casuale e non definito.
Per questa raccolta di tag ho preso riferimento da fonti ufficiali come il sito W3C e W3Cschool.
1 Risposta per HTML5 Reference: Tutti i nuovi tag introdotti e una breve spiegazione.