formato SVG

El SVG es un formato de imagen para gráficos vectoriales. Literalmente significa Graficos Vectoriales Escalables por sus siglas en ingles (Scalable Vector Graphics).

A diferencia de los formatos mas comunes de imagenes (Jpg, png, gif, etc.), el SVG es un gráfico que puede ampliar a cualquier tamaño sin perder la claridad (con excepción de muy pequeño).



Este formato se consigue al trabajar con un programa que trabaje en vectores como Adobe Illustrator, otro software popular para editar archivos SVG es Inkscape. Es gratuito y de código abierto, se puede descargar en inkscape.org.

Este formato de imágenes se puede utilizar SVG en la web con bastante facilidad.

¿Por qué utilizar SVG en el diseño web?


Los pequeños tamaños del archivo si se comprime bien, se puede ampliar a cualquier tamaño sin perder la claridad, luce muy bien en las pantallas de retina,  diseño de control como la interactividad y filtros (por ejemplo).

Compatibilidad con navegadores

El uso de esta forma tiene su propio conjunto de soporte de navegador específico. En esencia: funciona en todas partes excepto IE 8 y anteriores y Android 2.3 y anteriores. Para ver que otros navegadores soportan el uso de SVG mira esta tabla

Este es una comparación del mismo gráfico en algunos formatos de imágenes  para notar la diferencia puedes oprimir ctrl + y verás como las otras imágenes se pixelan mientras el SVG no pierde calidad.
JPG
jhon jpg

PNG
jhon png

SVG
formato SVG