In questo articolo daremo uno sguardo comparativo ad HTML5 e XHTML cercando di capire dove questi due linguaggi di marcatura si differenziano e come possiamo trarre il massimo beneficio dai due per creare pagine strutturate in modo corretto. Il nostro articolo sarà corredato da una serie di link utili a risorse presenti nel network di Html.it.
Un nuovo DOCTYPE
I DOCTYPE del W3C non sono mai stati il massimo da un punto di vista della mnemonicità. Infatti, essi sono piuttosto lunghi e difficili da ricordare. Per esempio, quello che segue è il DOCTYPE di XHTML 1.0 Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">Quello che gli sviluppatori sono sempre stati costretti a fare e copiare e incollare questi DOCTYPE da documenti esistenti o affidarsi al proprio editor. Con HTML5 queste difficoltà scompaiono, perché tutto quello che serve è:
<!DOCTYPE html>Stupiti? In realtà la riflessione da fare è piuttosto semplice: la lunghezza del DOCTYPE XHTML deriva dal fatto che vi è incluso anche l'URL dove un programma che elabora un documento XHTML dovrebbe reperire la DTD per poter validare le nostre pagine. Ma come si è visto, questa caratteristica viene usata solo dal validatore del W3C, perchè i browser non validano le nostre pagine ma si limitano semplicemente a interpretarle nel modo migliore possibile. Ad esempio, un errore di questo tipo:
<p>
<blockquote>...</blockquote>
</p>Viene rilevato dal validatore, non dal browser, che al limite ci presenterà una pagina dalla formattazione inconsueta. Un paragrafo non può contenere una citazione di blocco perché si tratterebbe di marcatura non valida, ma questo ai browser non importa! Da qui si è deciso che per HTML5 il tipo di DOCTYPE andava semplificato al massimo.
Scrittura degli elementi
HTML5 introduce nuovi elementi ma supporta tutti quelli già presenti in XHTML. In XHTML le regole per la scrittura degli elementi sono ferree: gli elementi vuoti devono comunque avere un tag di chiusura e determinati elementi devono avere necessariamente alcuni attributi di default. Per esempio, un'immagine va sempre inserita in questo modo:
<img src="foo.png" alt="Foo" />Notate come sia presente la stringa ' />' a chiudere il tag. In HTML5, invece, gli elementi vuoti possono essere scritti sia con la vecchia notazione HTML 4 che con la notazione XHTML.
Anche il trattamento degli attributi è cambiato. XHTML vuole che tutti gli attributi abbiano sempre un valore racchiuso tra virgolette, come il seguente:
<input type="text" name="q" id="q" disabled="disabled" />Come si può notare, l'attributo disabled ha sempre espresso il suo valore, anche se in questo caso si limita a ripetere il nome dell'attributo. In HTML5 si può usare invece sia la notazione HTML 4 che XHTML. Quindi si può anche scrivere:
<input type="text" name="q" id="q" disabled>Notate come in HTML5 non sia necessario neanche il tag di chiusura (slash preceduto da uno spazio).
Inoltre, in HTML5 è possibile omettere alcuni attributi di alcuni elementi, come script e style. Per cui se prima avevamo:
<style type="text/css"></style>
<script type="text/javascript" src="script.js"></script>Ora abbiamo semplicemente:
<style></style>
<script src="script.js"></script>La spiegazione di questa scelta sta nel fatto che i browser sono già in grado di identificare il contenuto di alcuni elementi senza dover necessariamente specificare attributi aggiuntivi. Comunque, come si è già detto, in HTML5 è possibile usare entrambe le notazioni.
Un ultimo esempio di questa semplificazione è l'uso del tag meta per specificare la codifica del documento. In XHTML si ha:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />HTML5 accetta invece anche:
<meta charsEt="utf-8"/>Per chi volesse approfondire il discorso sulle differenze tra HTML e XHTML rimando alla Guida HTML di Wolfgang Cecchin e alla Guida XHTML di Cesare Lamanna. Altra risorsa da segnalare è "Da HTML a XHTML in tre passi" di Andrea Chiarelli, utile se volete ulteriormente chiarire dei dubbi sulle differenze sintattiche accennate sopra.
Il ritorno di embed
In XHTML l'elemento embed era stato dichiarato deprecato e in questo linguaggio lo è a tutti gli effetti. Perché ne parliamo ancora oggi? Perché questo elemento si rende ancora necessario per visualizzare dei file multimediali in modo compatibile con i diversi browser. Il W3C aveva proposto di sostituire questo elemento con l'elemento object e di affidarne il controllo all'elemento param. Ad oggi, un risultato pieno si ottiene solo con Internet Explorer, che supporta tutti i valori assegnati all'elemento param. Gli altri browser si riconoscono param e object, ma non interpretano i loro valori allo stesso modo. Invece, essi supportano pienamente embed e i suoi attributi.
La buona notizia è che ora possiamo usare embed in HTML5. Comunque sia, è sempre bene aver chiara la semantica degli elementi utilizzati in qualsiasi linguaggio di marcatura al fine di poterli utilizzare al meglio. A tal proposito rimando a "L'importanza del codice semantico" di Laura Gargiulo.
Uso XHTML o HTML5?
L'implementazione di HTML5 è lontana dall'essere completa (il W3C parla addirittura del 2022 come deadline) e per questo la scelta di usarlo dipende dalle esigenze di sviluppo. Per prima cosa, l'utilizzo di un DOCTYPE HTML5 non causa nessun effetto collaterale nei browser che non lo riconoscono, quindi la modalità di rendering non cambia affatto. Discorso diverso per i nuovi elementi introdotti da HTML5. In questo caso occorre usare molta cautela, anche perché gli effetti di questi elementi sui software assistivi per persone disabili non sono chiari, e quindi si rischia di causare problemi di accessibilità del documento.
Esistono poi delle esigenze legali che fanno pendere l'ago della bilancia dalla parte di XHTML. Infatti, se si sta realizzando un sito istituzionale, si deve usare uno standard stabile e ufficialmente consolidato, cosa che al momento HTML5 non può garantire visti i limiti e le lacune delle specifiche che sono ancora tutte da definire.
Il consiglio è questo: se volete usare HTML5 limitatevi al momento ad utilizzare il DOCTYPE e le regole di scrittura di elementi e attributi comuni anche a XHTML, ma limitate al massimo l'utilizzo dei nuovi elementi in quei contesti in cui non sapete per certo quale sarà il target di destinazione del vostro lavoro. Per esempio, se state realizzando un sito mobile e avete come target gli utenti di iPhone, potete sperimentare più soluzioni con HTML5, come per esempio audio e video. Viceversa, se state realizzando un sito aziendale standard sarà bene ponderare attentamente le vostre scelte, anche basandovi sul tipo di pubblico e sulle statistiche di accesso dei vari browser.
