Quali novità offre l’HTML 5.1?

Senza HTML, acronimo per “HyperText Markup Language”, l’Internet sarebbe un luogo diverso: il linguaggio di markup crea la struttura per testi, immagini o link e costituisce così la base del world wide web. Quest’ultimo, tuttavia, ha subìto molti cambiamenti con il passare del tempo; i contenuti multimediali sono diventati un fattore fondamentale per i web designer: elementi audio e video e la possibilità, in generale, di rappresentazione dei contenuti su dispositivi mobili acquistano, infatti, un’importanza sempre maggiore.

Per rendere giustizia sia alle esigenze dei web designer sia a quelle degli utenti, entrambe mutate con il tempo, dopo tanti anni di stallo il linguaggio di markup è stato sviluppato ulteriormente dal World Wide Web Consortium (W3C) e dal Web Hypertext Application Technology Working Group (WHATWG). E così, dall’autunno del 2014 esiste un nuovo HTML: grazie all’HTML5, illustrato già nell’articolo , è più semplice inserire contenuti, mentre molti procedimenti e plug-in sono invece diventati obsoleti. Ora, con l’HTML 5.1, è pronto anche il prossimo piccolo aggiornamento. Ma come funziona la procedura per la pubblicazione di una nuova versione del linguaggio di markup? E quali sono le novità dell’aggiornamento attuale? Infine, quali funzioni saranno presto probabilmente elette a nuovo standard e come influenzerà ciò la gestione dei siti web?

L’ultima volta ci sono voluti ben 15 anni perché, dopo la versione 4.01, venisse finalmente introdotto un nuovo HTML. Questa volta, invece, l’aggiornamento è arrivato molto prima: neanche due anni dopo l’HTML5, adesso segue il primo adattamento con l’HTML 5.1. In questo modo il W3C e il WHATWG hanno tentato di recuperare il lungo intervallo che si era creato tra un aggiornamento e l’altro. In tempi di sviluppi accelerati di Internet, è una conseguenza non solo logica ma anche importante. Per l’aggiornamento sono state dapprima elaborate delle bozze, i cosiddetti “working drafts”, all’interno di gruppi di lavoro e, successivamente, le features dell’HTML programmate sono state nominate inserendole in una lista di candidati, ovvero la “candidate recommendation”. Nell’ambito di una fase di test dettagliata, la trasposizione di questi elementi deve essere messa alla prova. Una volta conclusa la fase di prova, si arriva alla pubblicazione di una raccomandazione ufficiale dello standard: quella che si chiama “recommendation”.

Nel caso dell’HTML 5.1, questo processo avviene anche a stretto contatto con la community: perciò il W3C ha pubblicato lo sviluppo del nuovo HTML su GitHub. In questo modo, la comunità ha più che mai la possibilità, prima di chiunque altro, di prendere ampiamente confidenza con il nuovo standard, esprimendo poi il proprio prezioso feedback a riguardo nella community. GitHub è un servizio di hosting per progetti software, dove è possibile trovare molteplici progetti open source e fare sì che i lavori di numerosi sviluppatori possano essere ricongiunti tra loro automaticamente a un software accessibile liberamente: proprio come è avvenuto nel caso dell’HTML 5.1.

Nell’HTML 5.1 c’è una varietà di elementi nuovi: la maggior parte di questi è già supportata da tutti i correnti browser. Al centro della novità c’è un’altra volta l’adattamento dei contenuti multimediali nel web design responsivo. Finora era problematica la rappresentazione di più immagini con una risoluzione variabile. A questo scopo, il contenitore <picture> avrebbe dovuto diventare standard già nell’HTML5, ma per motivi di tempo la standardizzazione non è stata portata a termine. Tuttavia gli sviluppatori web fanno uso dell’elemento comunque, malgrado non sia stato inserito nello standard ufficiale dell’HTML5 e nel frattempo tutti i browser in uso riescono a interpretare l’elemento <picture>: del resto, la standardizzazione tramite il nuovo HTML lo ha reso ufficiale.

Per quanto riguarda l’elemento <picture>, si tratta di un contenitore: tramite diversi elementi sorgente è possibile inserire file immagine. Tramite ciò vengono caricate solamente le immagini sorgente adatte alla dimensione dello schermo e della risoluzione: questa soluzione fa risparmiare tempo di trasmissione e va a vantaggio dell’allestimento Mobile di un sito web. Proteggendo la banda larga, per i display con un’elevata risoluzione possono essere messi a disposizione dei contenuti alternativi. Eppure per fare ciò è necessario l’attributo <srcset>, anch’esso introdotto con l’HTML 5.1: questo infatti mette le immagini e le differenti dimensioni in relazione tra loro. Il sito web W3Schools.com mostra nel seguente esempio come l’inserimento può apparire alla fine:

<picture>

<source media="(min-width: 650px)" srcset="https://www.ionos.it/digitalguide/img_pink_flowers.jpg">

<source media="(min-width: 465px)" srcset="https://www.ionos.it/digitalguide/img_white_flower.jpg">

<img src="https://www.ionos.it/digitalguide/img_orange_flowers.jpg" alt="Flowers" style="width:auto">

</picture>

L’elemento <picture> e <srcset> vanno in un certo senso di pari passo. Anche se le versioni dei browser più recenti in uso al momento supportano già entrambi gli attributi, per quanto riguarda i browser più vecchi esiste l’elemento “fallback”, il quale assicura che la grafica venga visualizzata sempre correttamente. Infine, all’interno degli elementi sorgente vengono definite le richieste alle caratteristiche degli schermi come larghezza e densità di pixel.

Già con l’uscita dell’HTML5 sono stati introdotti nuovi elementi per l’attributo <input>, tra cui si contano ad esempio: “email”, “url” o “date”, per rendere possibile l’inserimento di indirizzi e-mail, di URL o della data. La tipologia del campo di inserimento viene sempre definita con gli attributi “type”. Tramite type = “month” e type = “week”, ora è possibile scegliere, oltre ai giorni e agli orari, anche i mesi e le settimane. Anche questa funzione viene già supportata dalla maggior parte dei browser. In questo modo la standardizzazione con l’HTML 5.1 può venire considerata una conseguenza logica.

Siccome per ottenere una raccomandazione da parte del W3C, ogni nuova feature dell’HTML deve essere implementata in fase di test da almeno due browser indipendenti tra loro, alcuni candidati per la raccomandazione sono in bilico. Questi, infatti, al momento della nomina per la raccomandazione sono stati definiti “at risk”, in pericolo, poiché non sono ancora stati accettati dai browser o dagli sviluppatori per essere adattati alla standardizzazione.

Meno diffuso dell’elemento <picture> è, ad esempio, il tag <dialog>: allo stato attuale, questo viene supportato solamente dai browser su base Chromium come Chrome e Opera. Per questo, poco prima della pubblicazione dell’HTML 5.1, le comunicazioni riguardanti il tag erano divergenti: in alcuni articoli si parlava di una standardizzazione, mentre invece in altri articoli si sosteneva che l’elemento <dialog> era già stato eliminato. Tecnicamente tramite questo attributo dovrebbe essere reso molto più semplice l’inserimento di finestre pop-up o di finestre di dialogo, visto che normalmente a questo scopo è necessario ricorrere al codice JavaScript. Le complicazioni finora riguardavano l’apertura e la chiusura degli elementi: i browser che non supportano ancora <dialog>, riescono sì a fare visualizzare la finestra, ma non riescono a chiuderla. All’interno di un elemento <dialog> è possibile realizzare ogni tipo di contenuto: dal mero testo, passando per moduli di contatto fino ad arrivare ad immagini.

Oltre all’elemento <dialog>, anche <keygen> e <menu> erano presenti nell’elenco degli elementi at risk del nuovo HTML. Questi ultimi due elementi, però, su disposizione del W3C sono stati mantenuti. A questi appartengono anche <menuitem> e l’attributo “contextmenu”. Con questi elementi e attributi è possibile realizzare toolbar e menu contestuali, come accade nelle applicazioni desktop. Ciò che è stato realmente eliminato è la proprietà “toolbar-type” per l’elemento <menu>, che metteva a disposizione un set di comandi per i menu.

Un destino altrettanto vario lo vive anche l’elemento <keygen>: il generatore di coppie di chiavi crittografate fu originariamente sviluppato da Mozilla. La Microsoft, però, non nutriva alcun interesse a implementarlo, e Google, addirittura, nel 2015 ne ha pubblicato un ordine di esclusione dallo standard. Per questo la marchiatura “at-risk” non è arrivata inaspettata. La raccomandazione proposta dal W3C per l’HTML 5.1 a settembre 2016 l’ha comunque mantenuta provvisoriamente. Tuttavia con l’avviso che si trova nell’area di rimozione, condizione che permarrà ancora molti anni, presto o tardi esso verrà sicuramente eliminato dallo standard. Non è quindi consigliabile l’utilizzo di questo elemento.

I gestori di siti web possono senz’altro applicare gli elementi e gli attributi del nuovo HTML. Come già accennato in precedenza, molti lo fanno già. Oltre alle standardizzazioni ufficiali, anche l’elenco “at-risk” e le eliminazioni valgono la pena di essere esaminate più da vicino: difatti, se nel progetto web sono stati utilizzati degli elementi o attributi presenti sulla lista, sarebbe il caso di rivedere come trasporli diversamente. Oggi più che mai, una elevata compatibilità con il numero più grande di browser e dispositivi dovrebbe essere lo scopo di ogni gestore di siti web.

In una prospettiva futura, per i webmaster vale sicuramente la pena di dare un’occhiata di tanto in tanto alla pagina ufficiale del W3C per rimanere aggiornati sulle novità: sull’onda del completamento dell’HTML 5.1, è stata fornita anche un’anteprima sulla versione successiva, la 5.2. A quanto pare il ritmo degli aggiornamenti si è decisamente velocizzato dopo l’uscita del nuovo HTML. Per i gestori dei siti web significa che si cercherà di risolvere i bug il più velocemente possibile e che si presenteranno rapidi adattamenti alle richieste che vivono un continuo mutamento. Con la pubblicazione dell’HTML 5.1 tramite GitHub esiste inoltre la possibilità di partecipare attivamente come sviluppatore ai processi di miglioramento.