L’Html 5 è il nuovo standard che presto o tardi permetterà un salto di qualità nello sviluppo di siti e applicazioni web. Il linguaggio introduce un serie di nuove funzionalità e tag che permettono la realizzazione di effetti grafici molto interessanti ed avanzati e non solo.
Su questo blog abbiamo approfondito in più occasioni i diversi aspetti di questo nuovo linguaggio. Iniziando dalle basi ci siamo spinti fino alla realizzazione di script più complessi cercando di capirne e sfruttarne al massimo le potenzialità. Di seguito ripercorriamo tutti i tutorial dedicati a questo nuovo standard partendo dall’analisi delle relative specifiche e delle principali novità.
HTML5: la struttura
Inizialmente ci siamo occupati della definizione e delle basi del linguaggio: abbiamo introdotto tutti i nuovi e più rilevanti tag per concentrarci nell’analisi più specifica degli stessi.
Con particolare rilevanza è stato trattato il tag Canvas che permette di gestire le immagini e di disegnare forme geometriche. Le funzionalità di trasformazione ed elaborazione di immagini e di gestione degli stili e dei colori connesse a questo tag sono la base della maggior parte degli script e degli effetti che vederemo tra poco.
HTML5: gli effetti
Grazie a quanto appreso con i post precedenti siamo in grado di sfruttare le potenzialità del linguaggio per la creazione di effetti speciali.
A scopo esemplificativo, ci siamo dedicati agli effetti retrò: un effetto fuoco veramente old style e un effetto psichedelico anni ’60 al di là delle porte della percezione.
Più concretamente sono stati realizzati script per la gestione del colore e della trasparenza di un’immagine con HTML5 o per manipolare un’immagine per effettuare rotazioni e flip. In modo ancora più specicifico abbiamo utilizzato Canvas per la creazione di grafici vettoriali.
HTML5: funzionalità
Di recente, sfruttando l’oggetto XMLHttpRequest2 abbiamo imparato come gestire un upload di file e ad utilizzare le History API per migliorare la navigazione di siti e applicazioni web.
HTML5 e il web semantico
HTML5 implementa alcune novità in termini di web semantico. Il web semantico, in breve, consiste nell’allegare a documenti pubblicati online (pagine html, immagini, file) un corredo di informazioni (i “metadati”) utili a definirne il contenuto da un punto di vista semantico. Questo permetterà, in futuro, di poter meglio indicizzare i contenuti dei siti web rendendo di conseguenza più efficienti le query sui motori di ricerca online.
Esistono diversi metodi e standard per integrare i metadati all’interno dei nostri siti web, fra gli altri abbiamo approfondito due alternative: i Microdata e i Microformats.
HTML5: la compatibilità
Nota dolente: la compatibilità cross-browser. Come spesso (sempre?) accade con i nuovi standard web il più grosso ostacolo alla loro diffusione sta nel diverso supporto che viene garantito dai browser: abbiamo analizzato il grado di compatibilità dei browser con HTML5 soffermandoci in particolare sull’analisi del supporto agli standard di Explorer 9 (con un post che ha generato parecchio dibattito… Buona Lettura!)
