Malgrado lo standard non sia stato ancora ultimato, quasi tutti i browser più moderni già oggi integrano molte delle specifiche relative a HTML5 e CSS3. Ognuno con un diverso grado di compatibilità e supporto, ma in generale tutti abbastanza rispettosi degli standard.
Ma quali opportunità offrirà HTML5 agli sviluppatori nel momento in cui inizierà a essere utilizzato su larga scala nella realizzazione di siti web? Un buon esempio di cosa possiamo aspettarci ci viene da Apple che ha realizzato una galleria di esempi molto indicativi. HTML5 probabilmente non ucciderà Flash di Adobe, ma cambierà in meglio l'utilizzo quotidiano del web per milioni di persone, non soppianterà le migliaia di giochini che spopolano sul web al giorno d'oggi, ma ricostruirà le basi del web per permettere ai siti internet del futuro di offrire molte nuove funzionalità in maniera semplice e immediata.
Ad esempio, HTML5 permetterà di capire da dove un utente si stia collegando in quel preciso momento (magari da uno smartphone) e tramite le funzioni di geolocalizzazione sarà in grado di offrire dei servizi mirati per quel territorio, come identificare il punto vendita o il ristorante più vicini. Oppure immagazzinerà le nostre preferenze relative a un sito in locale sul nostro computer, per esempio una serie di appunti e note presi mentre si studia su una ben nota enciclopedia online. Soprattutto renderà il web un posto più sicuro, più efficiente e più adattabile.
HTML5 ci libererà infatti completamente, o almeno in larga parte, dalla dipendenza da plugin proprietari che recentemente sono assurti fin troppo spesso agli onori della cronaca come principali responsabili di possibili attacchi da parte di hacker o virus.
Proprio grazie all’uso ridotto di plugin proprietari HTML5 favorirà la convergenza e la compatibilità tra i nuovi dispositivi in arrivo nei prossimi anni come tablet, televisori intelligenti, perfino forni a microonde e frigoriferi!
Un altro vantaggio apportato sarà anche quello di plasmare un web più semantico, aggiungendo alle pagine web una serie di elementi come “article, section, header, footer e nav” rendendone più chiara la struttura e l'organizzazione. Google sarà il primo ad avvantaggiarsi di questa rivoluzione, perché sarà in grado di capire e analizzare meglio i contenuti di un sito web, fornendo risultati di ricerca migliori e in definitiva saranno gli utenti a giovare di ricerche più mirate ed efficaci.
Grazie ad iPhone e soprattutto iPad molti grandi attori del web stanno lentamente aggiornando i loro siti per renderli fin da subito in grado di offrire contenuti attraverso HTML5 per questi dispositivi, Youtube, Vimeo, Flickr, la CNN, Nike, National Geographic.
La domanda che tutti i web-developer al mondo si stanno facendo in questo momento è: "cosa potrò fare con HTML5 quando inizierò a implementarlo sui miei siti?”. La buona notizia è che si potrà fare tantissimo grazie all'HTML5, ma quello che più stupisce è che con HTML5 si può fare tanto, già oggi, iniziandolo a implementare fin da subito.
Una premessa però è d'obbligo, conoscere la propria audience è fondamentale. Se ad esempio ci si rivolge a un pubblico business, formato da aziende che utilizzano ancora, loro malgrado, Internet Explorer 6, allora forse potete lasciare l'innovazione in un cassetto ancora per qualche anno (tanto i vostri utenti saranno abituati a questo). Se al contrario i vostri navigatori utilizzano per la maggior parte Firefox, Chrome o meglio ancora Safari con iPhone o iPad, allora non c'è tempo da perdere.
Ma se il vostro audience si trova da qualche parte nel mezzo di questi due scenari – come la maggior parte dei siti Internet al momento – ci sono comunque alcune linee guida da poter seguire per implementare al meglio HTML5 già da adesso.
Nonostante le specifiche dell'HTML5 siano ancora considerate solo come un draft dal W3C – la prima bozza è del gennaio 2008 – come già detto tutte le ultime release dei browser supportano, a diversi livelli di compatibilità, le nuove specifiche. L'unico browser che attualmente non supporta a nessun livello HTML5 è IE8, ma non è una novità, e l'arrivo del nuovo Internet Explorer 9 comunque fa ben sperare anche sul fronte Microsoft.
È notizia recente poi che la quota di utilizzo di IE sia scesa sotto al 50% aprendo scenari ben diversi dai tempi in cui era il browser con il 95% dello share. Si fa strada la possibilità di concepire un web a due vie, offrendo “innovazione” a un buon numero di navigatori del web e rimanendo comunque compatibili con chi utilizza ancora Internet Explorer.
HTML5 (e CSS3) infatti sono in buona parte scalabili, cioè se un browser non li supporta si limiterà a ignorare le specifiche. Il sito di ComPart è già una dimostrazione pratica di questo concetto, basterà aprilo con IE e Chrome per accorgersi delle differenze di visualizzazione dovute in questo caso principalmente alle specifiche CSS3.
Come usare HTML5? Iniziamo dalla testa.
Prima di tutto già da oggi si può iniziare a usare il DOCTYPE di HTML5, non esiste nessuna ragione pratica per non farlo, il vostro browser continuerà a renderizzare il sito in maniera rispettosa degli standard. Per esempio invece di una dichiarazione standard come questa:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
si può scrivere:
<!DOCTYPE html>
<html>
Il codice della vostra pagina risulterà più pulito e pronto per i tag HTML5 che vorrete implementare e il bello è che tutti i browser tenteranno di interpretare la pagina nella maniera migliore possibile.
Il famoso e famigerato TAG <video> è un'altra cosa facilmente implementabile. Anche se non è ancora ben chiaro quale sarà il formato standard del futuro per i contenuti audio e video, dato che diverse forze in campo cercano di imporre il proprio, come h.264, Ogg Theora o WebM, il bello di HTML5 è appunto quello di essere scalabile.
Quindi si potrà inserire il tag con la source a un h.264 per iPad o iPhone e prevedere un fallback a Theora per Firefox e Opera fino a scendere a un player in flash per Explorer o addirittura una semplice jpg.
<video>
<source src="/video.m4v" type="video/mp4" /> <!-- h.264 per Safari -->
<source src="/video.ogg" type="video/ogg" /> <!-- Ogg Theora per Firefox -->
<p>Spiacente, il tuo browser non supporta i tag video, leggiti un buon libro...</p>
</video>
In contatto con HTML5
Anche nelle <form> ci sono notevoli passi avanti che possono essere apportati. A oggi l'unico modo per poter validare, ad esempio, un campo di una form destinato a una email è quello di produrre un file Javascript che si occupi di questo.
Con HTML5 non sarà più necessario basterà inserire un type corretto come negli esempi riportati qui sotto: