HTML and CSS Reference
In-Depth Information
In questo capitolo abbiamo affrontato un tema che va oltre la descrizione delle informazioni
tipica dell'HTML e si spinge fino alla creazione di grafica avanzata.
SVG e
canvas
sono due strumenti simili nella logica di disegno, ma molto differenti
nell'utilizzo e nelle potenzialità. Il primo permette di descrivere con markup figure vetto-
riali, che godono quindi di una definizione infinita superando i limiti delle bitmap, mentre
il secondo fornisce una superficie di disegno sulla quale interagire con API di scripting.
Quindi, con SVG, abbiamo visto le principali caratteristiche per il disegno degli shape e
per l'inserimento di elementi testuali. Con il raggruppamento e le definizioni abbiamo il-
lustrato come organizzare le figure e come possiamo anche definire gradienti o pattern di
colorazione delle figure stesse.
Siamo poi passati a funzionalità più avanzate, come le trasformazioni, per vedere come
SVG, essendo basato su markup, possa essere conciliato con l'uso di CSS e di linguaggi di
scripting.
Per capire invece l'utilità del canvas, abbiamo realizzato un piccolo gioco che mette
in campo la logica basata sui frame per il disegno delle animazioni. Infine, abbiamo visto
come, col contesto 2d ottenibile dal
canvas
, possiamo disegnare attraverso le API e rap-
presentare gli elementi di cui possiamo aver bisogno: shape, immagini e testo.
Nel prossimo capitolo, l'ultimo, vedremo quali sono i framework per il Web e come
possono aiutarci nello sviluppo.
