Como ya hemos resaltado, GIF y JPEG son formatos gráficos de mapa de bits, es decir, que su estructura se basa en una matriz de puntos, cada punto correspondiente a un punto virtual del gráfico, y cada uno de ellos incorporando la información correspondiente al color que le acompaña.
Evidentemente, las desventajas de este tipo de gráficos son palpables, ya que ofrecen muchas dificultades a la hora de hacer modificaciones sobre el gráfico original (cambiar texto, color, etc.), o simplemente a la hora de redimensionar la imagen, ya que se redimensionan los pixeles y no los elemento independientes, haciendo que estos pierdan definición y calidad (elementos de la imagen menos nítidos, bordes pixelizados, ilegibilidad de textos, etc.).
Todos estos inconvenientes se solucionan con otro tipo de imágenes, las imágenes vectoriales.
Las imágenes vectoriales, al contrario que los mapas de bits, no almacenan la imagen como una matriz de puntos con su correspondiente color, sino como un conjunto de los elementos independientes que la forman. En realidad una imagen vectorial está formada por las instrucciones que definen cada uno de los elementos de la imagen.
La ventaja de las imágenes vectoriales es doble, ya que a la posibilidad de rediseño posterior de la imagen hay que sumar que muchas veces el tamaño de estos gráficos puede ser muchísimo menor.
Por ejemplo, imaginemos una imagen de 800x600 pixeles en donde sólo halla un texto sobre un fondo de color. En un mapa de imágenes esto ocuparía mucha memoria, ya que tendríamos que almacenar la matriz de puntos completa, en cambio, en una imagen vectorial esto se solucionaría con unas pocas instrucciones. Y ya sabemos lo importante que es la optimización a la hora de construir nuestra web, ya que el tiempo de descarga es un factor importante.
Como todo, las imágenes vectoriales, a la hora de hablar de páginas web, tiene sus ventajas y sus inconvenientes. Sus ventajas ya las hemos citado: fácil rediseño y minimización del peso gráfico (en algunas ocasiones). Los inconvenientes, hoy por hoy, por desgracia, son más que las ventajas, ya que el soporte es mínimo y es ahora cuando se está empezando a utilizar este tipo de tecnología, aunque siempre con el riesgo de la incompatibilidad.
De cualquiera de las formas, los formatos de gráficos vectoriales para la web se pueden dividir en 2 tipos: los soportados mediante el plug-in correspondiente y los basados en lenguajes de marcado (todos ellos con el consabido riesgo de la incompatibilidad).
Los primeros son los gráficos vectoriales "clásicos", que necesitan del plug-in correspondiente para poder ser visualizados en un navegador web.
El segundo tipo, los basados en lenguajes de marcado, son la última alternativa en la implantación de imágenes vectoriales. Vamos a verlos con mayor detenimiento:
Imágenes vectoriales basadas en lenguajes de marcado
El lenguaje de marcado utiliza texto (sin formato) para definir etiquetas y otros elementos. El ejemplo más claro de lenguaje de marcado es el HTML, en donde cada etiqueta escrita se traduce en un elemento legible a través de un navegador web.
En nuestro caso, las imágenes vectoriales basadas en lenguajes de marcado, los elementos de esas imágenes se definen igualmente con texto, que después es interpretado por el navegador web, al igual que un archivo HTML es interpretado por un navegador.
Los estándares más “populares” son: DrawML, PGML, VML, Web Schematics y SVG.
DrawML es un estándar de imágenes vectoriales para web orientado a la creación de organigramas y gráficos esquemáticos.
DrawML es una aplicación de XML (eXtensible Markup Language : lenguaje de marcado extensible) y hace uso del lenguaje Java para definir los gráficos que después se presentan en la ventana del navegador.
Mediante DrawML podemos definir complejos organigramas gráficos con necesidad de pocas instrucciones.
PGML (Precision Graphics Markup Language : lenguaje de marcado de gráficos de precisión) es una aplicación de XML que permite la creación de gráficos complejos y de calidad, ya que permite la posibilidad de renderizado.
VML (Vector Markup Language : lenguaje de marcado vectorial) es un estándar desarrollado por la empresa Microsoft que intenta hacer sencillo el desarrollo de este tipo de gráficos, mediante atributos y etiquetas cortas y descriptivas.
VML es una aplicación de XML que utiliza CSS2 (Cascade Style Sheets, level 2 : hojas de estilo en cascada, nivel 2).
El estándar VML permite la creación de imágenes complejas y de precisión, animación, renderizado, transparencia, corrección gamma y cromaticidad.
Web Schematics, al igual que el estándar DrawML, está diseñado para el fácil diseño de organigramas y gráficos de esquemas. Para trabajar utiliza las funciones de HTML y CSS1, con lo que se pueden diseñar fácilmente figuras geométricas, como círculos, rectas, polígonos, etc.
SVG (Scalable Vector Graphics : gráficos vectoriales dimensionables) es un formato desarrollado por el W3C para la creación de gráficos vectoriales.
SVG es una aplicación XML que soporta, entre otras, tecnología CSS2. Permite corrección gamma, cromaticidad y otros efectos.
Como vemos, hay variedad y calidad. El problema: la no compatibilidad con todos los navegadores web. El futuro: esperanzador.
Autor: David Gutiérrez Verdura
No hay comentarios:
Publicar un comentario