Anche per chi lavora da anni nel mondo del web è spesso vittima di miti e leggende che lo riguardano. Un esempio? Il tag <html> è facoltativo! E non solo lui, anche head e body! E' totalmente facoltativa anche la chiusura di questi tag! E non è una novità dell'html5: il parser di qualsiasi browser ricrea questi elementi nel DOM senza alcun problema! Se trova un elemento mancante lo 'falsifica' (HTMLTreeBuilder.cpp :: processFakeStartTag(), la funzione che svolge questo ruolo in Chromium) inserendolo nel DOM.
Stesso discorso vale anche per i tag com <p>, <li>, <tr>, <td> e così via
<ul> <li>elemento uno <li>elemento due <li>elemento tre </ul>
<p>ciao io sono un elemento di testo dentro p
Sono tutti perfettamente leciti! Facciamo un esempio.
<!doctype html> <meta charset=utf-8> <title>htmltest</title> <pre></pre> <h1>RM Design</h1> <script> document.querySelector('h1').innerHTML += '<em>!!!</em>' document.body.firstChild .textContent = document.documentElement.outerHTML </script>
Possiamo fare uso senza problemi di tag non esplicitati (body), e, andando ad inserire dentro il tag <pre> il DOM della pagina stessa (preso con outerHTML) , magicamente vediamo come il browser ha inserito i tag mancanti e chiuso quelli lasciati aperti. Vediamo un'altra cosa:l'attributo id. Che caratteri possiamo usare? Dal punto di vista dello standard HTML (si, anche 4.01), tutti! Il problema si presenta quando, andando a leggere le specifiche del CSS 2.1, leggiamo che devono essere caratteri Unicode. Questo comunque ci lascia una certa libertà! Questi esempi,
<div id="♥"> <p id="☺"> <a id="٩๏̯͡๏)۶">
funzioneranno perfettamente in qualsiasi browser!
E indovinate cos'altro è totalmente facoltativo? Le virgolette! A patto che nel nome dell'attributo non ci siano caratteri quali " ' ` = < >possiamo smettere di usarle in qualunque tag.
<a href=http://riccardomastellone.com>ciao io sono un tag a</a>
Con l'avvento dell'HTML5 una delle novità più rivoluzionarie è la standardizzazione del parser: questo vuol dire che anche se ci sono errori nel markup, se la pagina viene visualizzata in un certo modo in Chrome, sarà esattamente così anche in Opera, Firefox e.... IE (dalla versione 10)!
Un consiglio: nonostante l'approccio per comprendere il funzionamento dell'HTML sia provare, sbagliare, adattare e riprovare, il W3C ci ha regalato delle specifiche redatte apposta per gli sviluppatori web (quindi senza le specifiche tecniche per i browser) che spiegano chiaramente tutto! http://dev.w3.org/html5/spec-author-view/