Retrocompatibilita HTML5: quando cominciare ad usarlo
HTML5 rivoluzionerà internet ma non è stato ancora ufficialmente lanciato: quando e come utilizzarlo?
È un periodo davvero eccitante per i web designer che si vedono aprire le porte a nuovi orizzonti e potenzialità portate dal nuovo linguaggio HTML5. I browser più evoluti come Chrome e Firefox hanno dei cicli molto brevi di rilascio di nuove versione e la compatibilità col nuovo linguaggio è affidabile. La nota dolente viene soprattutto da Internet Explorer per il quale andranno usati alcuni trucchi.
Scoprire che browser ci sta visitando
Sapere quale browser sta utilizzando un utente che ci sta visitando è semplice, con qualsiasi linguaggio lato server si può far richiesta del user agent dal quale si può sapere il sistema operativo e il browser completo di versione.
Ma scrivere del codice in base al browser dell'utente non è consigliabile: prima di tutto questa strategia non è scalabile e sarà necessario riscrivere il codice al rilascio di ogni nuova versione di browser; inoltre esistono delle semplici applicazioni, add-ons per i browser per mascherare la propria vera identità e "spacciarsi per altri browser".
Identificazione dalle funzionalità con javascript
Invece di usare l'identificazione del browser è consigliabile testare direttamente le funzionalità del linguaggio attraverso i suoi oggetti. Per esempio potremmo testare il supporto all'elemento <video> con questo script javascipt
function isTagVideoSupported() {
return !!document.createElement("video").canPlayType;
}
</script>
In base alla risposta di questa funzione possiamo pubblicare il video con HTML5 altrimenti usare strategie alternative.
Librerie Javascript per la compatibilità
In questo periodo di transizione prima del rilascio ed il supporto definitivo di HTML5 possiamo usare delle librerie Javascript per sopperire all'eventuale mancato supporto. La promessa di queste soluzione è di poter utilizzare da subito le funzioni di HTML5 senza dover revisionare il codice in futuro: quando il supporto sarà definitivo basterà disabilitare le librerie.
- Modernizr verifica il riconoscimento di specifiche funzioni come nel precedente esempio del video
- Excanvas abilita Internet Explorere all'utilizzo delle funzionalità di <canvas>; anche se sembra ancora da verificare al sua efficacia la segnalo comunque.
- Close-pixelate consente particolari soluzione artistiche
- popcorn aggiunge sottotitoli ad un filmato
Con modernizr per esempio il precedente esempio di funzione test per suppporto video diventerebbe così:
if(Modernizr.video) {
/* codicecon video supportato */
} else {
/* codice alternativo per mancato supporto */
</script>
Guida pratica When I Can Use
Una guida pratica sulla compatibilità e sulle funzionalità HTML5, CSS3 e altre tecnologie web la trovate su When I Can Use.