HTML5: le principali differenze da HTML4

Differenze tra html5 e html4In questo articolo vedremo le differenze fondamentali tra il linguaggio HTML4 e il linguaggio HTML5!

La prima differenza importante consiste nella scomparsa dei frame a vantaggio dei box. Il box-model viene definito come suddivisione di una pagina web in sei blocchi predefiniti:

  • <header></header>: Il tag header serve a contenere la “testata” di una pagina web. Esso solitamente contiene un titolo, un sottotitolo (utilizzato come descrizione), la barra di navigazione e, volendo, una foto.
  • <nav></nav>Il tag nav contiene link riguardanti la navigazione del sito.
  • <article></article>Il tag article è il “contenitore” degli articoli. Esso infatti definisce solo la posizione del blocco,in cui verranno visualizzate le notizie, e la formattazione generale.
  • <section></section>Il tag section, invece, contiene l’articolo vero e proprio. Su di esso può essere anche fatta una formattazione interna.
  • <aside></aside>Il tag aside indica il box che si trova a lato della pagina e contiene solitamente una barra di navigazione(nav). La sua posizione può essere definita da codice css.
  • <footer></footer>Il tag footer riconosce come box quello che si trova in fondo alla pagina web e che contiene informazioni, ad esempio dati di chi ha scritto, i collegamenti, il copyright, etc..

Questi blocchi possono essere suddivisi a loro volta in sotto-box tramite il tag <div>.

header

Qui sotto viene mostrata la normale sintassi di una pagina web creata con un box-model.

<body>
<header>
    <nav>
        <ul>
        <li><a href="..">[...]</a></li>
        <li><a href="..">[...]</a></li>
        </ul>
    </nav>
</header>
<article>
        <section>[...]</section>
        <div="..">[...]
</article>
<aside>[...]</aside>
<footer>[...]</footer>
</body>

Insieme al file HTML5 deve essere chiaramente associato un file CSS3 (Cascading Style Sheets) che formatti i box affinché vengano posizione come in precedenza mostrato.

La seconda differenza consiste nell’adozione di un nuovo DOCTYPE. Il DOCTYPE è uno standard che permette al browser di capire il tipo di documento che sta trattando. L’HTML4 aveva diversi DOCTYPE, definiti con stringhe lunghe e notevolmente complesse. HTML5 si è liberato di tutto ciò introducendo il tag <!DOCTYPE html> che deve essere inserito come prima istruzione di un documento HTML5.
Oltre al DOCTYPE è necessario aggiungere il set di caratteri da utilizzare in un TAG META: <meta charset=”UTF-8″>

<!DOCTYPE html>
<html>
<head>
     <title>..</title>
     <meta charset="UTF-8" />
</head>
[..]
</html>

Lascia un commento