The Good Manager  >  Modulo di formazione

100 punti da sapere su...
Eco-Design Web Development

100
punti da sapere su...
Torna al sommario del modulo

Nozione 47

La differenza tra immagini raster e vettoriali.

competenza target

Conoscere i diversi tipi di immagini.

In un approccio sostenibile al vostro web design, è importante considerare l'ottimizzazione delle immagini.
In questo post parleremo dei principali tipi di immagini.

Proprio come il testo, le immagini sono parte integrante di un sito web. Esistono due tipi di immagini:

-Immagine raster, detta anche immagine raster o bitmap. "È un'immagine costituita da una matrice di punti colorati. È una giustapposizione di punti che formano, nel loro insieme, un'immagine". Le sue dimensioni sono caratterizzate solo dal formato di stampa e dipendono principalmente dalle possibilità tecniche e materiali di visualizzazione (qualità dei pixel).
Nel caso in cui un'immagine raster sia destinata alla stampa, la nozione di misura è importante.
Si noti che sono memorizzate in un formato grafico e i principali formati sono BMP, GIF, PNG, JPEG, ecc.

-Un'immagine vettoriale "è un'immagine digitale composta da singoli oggetti geometrici, ciascuno definito da diversi attributi (forma, posizione, colore, ecc.) e a cui possono essere applicate diverse trasformazioni".
In altre parole, vengono memorizzate come espressioni matematiche prima di essere tradotte in immagini sui nostri schermi. La dimensione è relativa: finché l'immagine si trova in un ambiente adatto al suo tipo, si adatta senza perdere qualità.
Se invece l'ambiente non è adatto (stampa, sfondo, ecc.), dovrà essere trasformata in un'immagine raster. In questo caso, è essenziale stabilire una dimensione e regolare la risoluzione.
Si noti che i principali formati in cui vengono salvate le immagini vettoriali sono Postscript, PDF, Illustrator, SVG, ecc.

La differenza principale tra questi due tipi di immagini è che il formato vettoriale può essere ridimensionato senza perdere la qualità dell'immagine, a differenza del formato raster.

Ecco un esempio di come appaiono le due immagini: [canva]https://www.canva.com/design/DAFPe2PVjaI/view[canva]