sabato 1 Agosto 2020

Download in corso

Softwareone.it

11-01-2019

Html5

HTML5 è una collaborazione tra il World Wide Web Consortium W3C e l’Hypertext Application Technology Group Web Working WHATWG. Nel 2006, hanno deciso di collaborare e creare una nuova versione di HTML. 

Pubblicità

Sono state stabilite alcune regole per HTML5

  • Le nuove funzionalità dovrebbero essere basate su HTML, CSS, DOM e JavaScript
  • Ridurre la necessità di plugin esterni (come Flash)
  • Migliore gestione degli errori
  • Più markup per sostituire lo scripting
  • HTML5 dovrebbe essere indipendente dal dispositivo
  • Il processo di sviluppo deve essere visibile al pubblico

In HTML5 c’è solo una dichiarazione, ed è molto semplice:

<!DOCTYPE html>

Le novità introdotte dall’HTML5 rispetto all’HTML 4 sono finalizzate soprattutto a migliorare il disaccoppiamento tra struttura, definita dal markup, caratteristiche di resa (tipo di carattere, colori, eccetera).

Una cosa interessante e che l’HTML5 prevede il supporto per la memorizzazione locale di grosse quantità di dati scaricati dal browser localstorage e webstorage, per consentire l’utilizzo di applicazioni basate sul web come per esempio le caselle di posta di Google o altri servizi analoghi anche in assenza di collegamento a Internet. 

Possiamo dire che HTML5 è un insieme di tecnologie, sostanzialmente ragruppa tutte le più recenti novità relative allo sviluppo web e alla creazione di web applications. 

La maggior parte dei web designers utilizzano con più frequenza alcuni nomi di classi quali “header“, “footer“, “nav“, “article” per identificare più o meno sempre gli stessi <div>. 
Si è dunque pensato che sarebbe stato utile introdurre dei nuovi tag per identificare questi elementi comuni e ricorrenti. 

Sono stati introdotti i nuovi tag <audio> e <video> per agevolare il controllo di contenuti multimediali e consentire al browser di mostrare l’interfaccia per interagire con essi (come play, pausa, stop e volume). 

Il tag <canvas> che viene utilizzato per disegnare elementi grafici, su una pagina web tramite javascript. 

Esempio

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
 
ctx.font = "20px Georgia";
ctx.strokeText("Hello World!", 10, 50);
 
ctx.font = "30px Verdana";
 
// Create gradient
var gradient = ctx.createLinearGradient(0, 0, c.width, 0);
gradient.addColorStop("0", "magenta");
gradient.addColorStop("0.5", "blue");
gradient.addColorStop("1.0", "red");
 
// Fill with gradient
ctx.strokeStyle = gradient;
ctx.strokeText("Big smile!", 10, 90);
</script>
Your browser does not support the HTML5 canvas tag.
Pubblicità

Ma ci sono ancora tanti altri tag del tipo

Tag Descrizione
<article>/Definisce un articolo contenuto autonomo/
<aside>/Definisce i contenuti a parte il contenuto della pagina/
<command>/Definisce un pulsante di comando che un utente può invocare/
<datalist>/Specifica un elenco di opzioni predefinite per i controlli di input/
<details>/Definisce i dettagli aggiuntivi che l’utente può visualizzare o nascondere/
<dialog> /Definisce una finestra di dialogo o una finestra/
<figcaption> /Definisce una didascalia per un elemento/
<figure> /Specifica contenuto autonomo/
<footer>/Definisce un piè di pagina di un documento o di una sezione/
<keygen>/Definisce un campo generatore di chiavi a coppia (per le forme)/

Ricapitolando HTML5 offre :

Adesso combinate queste tecnologie e vediamo cosa ne esce fuori. (da ricordare che ancora non tutti browser si sono adeguati ad supportare HTML5).

I commenti sono chiusi.

Pubblicità