04: De ce SVG? Mic. - CSS-Tricks

Anonim

Dimensiunea unui fișier SVG depinde de cât de complex este, nu de cât de „mare” este. Amintiți-vă că SVG-urilor nu le pasă cu adevărat la ce dimensiune sunt redate, sunt flexibile și clare indiferent de ce.

Imaginați-vă o imagine raster de 100 × 100 pixeli. Asta înseamnă 10.000 de pixeli de informații. SVG este doar instrucțiuni despre cum să desenezi ceva, deci dacă aceste instrucțiuni sunt suficient de simple, pot fi destul de mici decât să stochezi date pe fiecare pixel. Este un pic mai complex de atât, deoarece compresia intră în joc de ambele părți, dar ideea generală este acolo.

Totuși, nu este la fel de simplu ca „SVG este mai mic” - și nu există o formulă stabilită pentru a decide ce format să utilizați, care este întotdeauna corect. Uneori este foarte evident. O formă solidă a siglei Apple? Vectorul va fi mai mic pentru aproape orice dimensiune. O ilustrare a unui stejar cu multe frunze? Vectorul poate fi prea complicat și un format de imagine raster va fi mai mic.

Imagine dintr-o prezentare de Todd Parker.

Este posibil să trebuiască doar să salvați o copie în ambele sensuri, să optimizați ambele și să testați dimensiunea fișierului.

SVG este de obicei minunat pentru lucruri precum:

  • Logos
  • Icoane
  • Ilustrații simple
  • Diagramele
  • Hărți

Pariez că aveți deja o intuiție destul de bună cu privire la ce fel de grafică are sens să fie vector.

Dosare

  • 04-icon_62532.png.webp
  • 04-icon_62532.svg