Lezione 10 - Corso Avanzato Html

Novità dell'Html5 e l'attributo Title


Novità dell'Html5

In html5 abbiamo quattro modi diversi per dichiarare gli attributi e i loro valori.

Il primo modo è quello di usare gli apici, in particolare i doppi apici.

Il secondo modo è quello di utilizzare gli apici singoli.

Il terzo modo, per html5, è quello di non usare per niente gli apici, però senza apici basta una piccola imperfezione, come spazi nel percorso, e il codice potrebbe non funzionare.

Il quarto metodo riguarda gli attributi che nell'html5 possono essere senza valore, ad esempio: l'attributo hidden (nascosto) che serve per nascondere un elemento, prima si è sempre scritto così: hidden="hidden" ora si può scrivere semplicemente hidden.

Altra novità è che in html5 i tag, gli attributi, e i valori degli attributi si possono scrivere indifferentemente sia in maiuscolo sia in minuscolo. Noi per avere una maggior pulizia del codice preferiamo scrivere tutto in minuscolo come si è fatto sempre.


Sempre nell'ultima versione di html5 si possono omettere le chiusure dei tag, il codice funzionerebbe lo stesso, ma per avere una forma più professionale noi preferiamo usare mettere sempre la chiusura dei tag.

Ancora con html5 possiamo utilizzare gli spazi come meglio crediamo, ma noi degli spazi ne faremo buon uso.

Infine, per concludere, per una migliore leggibilità del codice sorgente, consiglio di ricorrere il meno possibile all’utilizzo di elementi impliciti, scrivendo sempre tutti i tag necessari nella loro forma completa, proprio come si è sempre fatto.

Per cercare di controllare e verificare il lavoro che stiamo svolgendo, ci sono diversi siti che ci permettono di verificare se il nostro codice è valido e conforme con html5.

Questo sito è molto utile quando siamo indecisi sulla compatibilità del nostro codice: http://html5.validator.nu/

Dopo aver fatto una panoramica delle novità dell'ultima versione di Html5, riprendiamo il nostro percorso introducendo un'attributo molto simpatico.

L'attributo title in Html

Ora, parliamo per un momento dell’attributo title, da non confondere con il tag <title></title> che troviamo nell'<head></head>.

L'attributo title, è molto importante, e serve per specificare un testo esplicativo per l’elemento a cui l’attributo è riferito (l'attributo title si può infatti utilizzare anche per elementi differenti dalle ancore).

Quest'attributo favorisce l’accessibilità del sito anche ai disabili, alle persone, per esempio, che hanno disturbi alla vista.

La particolarità di dell'attributo title è che se lasciate il cursore del mouse per qualche secondo su un collegamento dotato di title, vedrete comparire una specie di etichetta con il testo che noi abbiamo specificato nel title.

Vediamolo in pratica:
<!DOCTYPE html>
<html lang="it">                     
 <head>			    
  <title>Novità dell'Html5 e l'attributo Title</title>
  <meta charset="utf-8">
 </head>
 <body>			    
  <h2>Novità dell'html5 e l'attributo title</h2>
  <p title="Descrizione dell'attibuto title ">Paragrafo 1 - parliamo dell'attributo title che......</p>
  <p title="Descrizione novità html5">Paragrafo 2 - Le novità dell'HTML5 sono.....</p>
 </body>                
</html>                    

Novità dell'html5 e l'attributo title

Paragrafo 1 - parliamo dell'attributo title che......

Paragrafo 2 - Le novità dell'HTML5 sono.....



Se passate con il mause sul Paragrafo 1 o sul Paragrafo 2 e vi soffermate per qualche secondo, vi apparira una piccola etichetta esplicativa che in molti casi può essere di vero aiuto.