El formato SVG: Gráficos vectoriales para la web

 

Formato SVG

El formato SVG (siglas de Scalable Vector Graphics) es un formato gráfico no muy conocido en el entorno de desarrollo web, sobre todo si lo comparamos con otros formatos gráficos mucho más populares como son el JPG, el PNG e incluso el GIF. Sin embargo el formato SVG te puede resultar de gran utilidad ya que posee todas las ventajas de cualquier otro formato gráfico vectorial y algunas más específicas para la web:

  • El SVG, al ser vectorial, es escalable sin perdida de calidad manteniendo su definición tanto en tamaños de imágenes grandes como pequeños.
  • El formato SVG ofrece gráficos con transparencias y contornos siempre suaves.
  • Posibilita la animación, así como efectos visuales y sonoros.
  • Su contenido es indexable por los buscadores.
  • El SVG es un formato gráfico abierto basado en XML.
  • El peso de estos archivos es bastante reducido si nuevamente lo comparamos con los formatos gráficos de mapas de bits.
  • El formato SVG es un estándar que funciona en todos los navegadores web actuales.
  • El SVG es el formato ideal para realizar diseños responsive.
  • Este formato permite incluir tipografías TrueType y Tipo 1 dentro del propio archivo así como imágenes de mapa de bits.
  • Se pueden incluir scripts y acciones, además de permitir ser modificado con javascript (mira algunos ejemplos de Snap.svg).
  • El SVG soporta estilos CSS, así que si cambiamos el estilo de nuestra página, también cambiaremos el estilo de nuestro gráfico.

Si con esta pequeña introducción te ha parecido interesante el formato SVG y quieres profundizar un poco más en el, puedes consultar este tutorial SVG para HTML 5, o bien ver el siguiente video de la gente de DesarrolloWeb.com:

Deja un comentario