SlideShare uma empresa Scribd logo
1 de 6
20001549402000200660SVGCARACTERÍSTICAS Y FUNCIONES6900096000SVGCARACTERÍSTICAS Y FUNCIONES730005673725center2420096000<br />SVG<br />Scalable Vector Graphics (SVG) es un lenguaje para describir gráficos vectoriales bidimensionales, tanto estáticos como animados (estos últimos con ayuda de SMIL), en XML. <br />SVG se convirtió en una Recomendación del W3C en Septiembre de 2001, por lo que ya ha sido incluido de forma nativa en el navegador web del W3C Amaya. Otros navegadores web, necesitan un conector o plug-in, para lo que se puede utilizar el Visualizador SVG de Adobe.<br />SVG permite tres tipos de objetos gráficos:<br />figuras de gráficos vectoriales (e.g., paths, que consisten en líneas rectas y curvas), <br />imagenes y <br />texto. <br />Los objetos gráficos se pueden agrupar, estilizar, transformar y componer en objetos previamente renderizados. El texto puede estar en cualquier espacio para nombres XML adecuado para la aplicación, lo que extiende la buscabilidad y accesibilidad de los gráficos SVG . El conjunto de características incluye transformaciones anidadas, truncamiento de rutas, máscaras alfama, efectos de filtro, objetos de plantillas y extensibilidad. Los dibujos SVG pueden ser dinámicos e interactivos. El Modelo de Objetos Documentales (DOM) para SVG, que incluye el DOM de XML completo, permite la animación directa y eficiente de los gráficos vectoriales vía scripting . Se puede asignar un rico conjunto de manipuladores de eventos como onmouseover y onclick a cualquier objeto gráfico SVG. Debido a su compatibilidad y potenciamiento de otros estándares web, se pueden hacer en elementos de SVG y otros elementos de XML de diversos espacios de nombres, características como el scripting simultáneo dentro de la misma página web.<br />SVG rivaliza con Macromedia Flash en terminos de potencial y poder, con la diferencia de que el primero es un estándar abierto.<br />La versión 1.5 de Mozilla Firefox soporta gráficos hechos con SVG. También, desde su versión 8, el navegador Opera ha implementado SVG 1.1 Tiny en su núcleo, por lo que ya no es necesario instalar un plug-in.<br />MOTIVACIÓN PARA CONOCER Y UTILIZAR EL SVG<br />Muchos webmasters opinan que Dios creó el Universo usando la tecnología Flash, propiedad de Macromedia, pero mucho me temo que eso no es del todo cierto. Al margen de las exquisiteces dinámicas e interactivas de la famosa extensión .swf, existen otros formatos que hacen de los sitios on—line lugares más divertidos y estimulantes de cara al usuario. Para empezar, el lenguaje javascript, combinado con opciones más convencionales y simples, puede convertir un sitio estático y aburrido en un lugar donde el navegante encuentra respuestas muy imaginativas a sus acciones en cada página que visita. La tecnología java también es útil, aunque a veces se emplea de forma innecesaria, consiguiendo que el usuario se irrite y se lo piense dos veces antes de volver al sitio. <br />Incluso las viejas páginas en html pueden ser un precioso paisaje de gráficos bien diseñados, bonitos y efectivos. Y de esto hay muchos ejemplos, ¿no es cierto? Al fin y al cabo, todo se puede reducir a una cuestión de creatividad o, dicho de otro modo, de cómo calibrar y combinar los valores de la belleza de nuestros sitios, y el peso que cada navegante está dispuesto a soportar antes de largarse a otro lugar. Antes de describir algunas de las nociones tecnológicas que dan sentido a SVG, quizás sea necesario hacer referencia a una de las cuestiones que normalmente se debaten entre aficionados y profesionales del diseño web. De un modo simple, la idea es ésta: ¿realmente merece la pena el SVG? Muchos desarrolladores opinan que ya hay suficientes formatos gráficos y de animación para trabajar y ser creativos, de modo que, tal vez, inventar algo nuevo sea una pérdida de tiempo. Para cuando se haya pulido lo sufiente, dicen, ya no tendrá sentido, porque Internet habrá avanzado, la banda ancha estará más difundida, y las viejas aspiraciones de archivos con bajo peso habrán perdido toda su vigencia. A fin de cuentas, ¡podremos transferir ballenas enteras, dato a dato, a través de la Red! Es sin duda una cuestión interesante, pero debemos tener en cuenta todas y cada una de las características de SVG. Visto globalmente, es una gran idea. Pequeño y veloz, ingenioso y gratuito, con un firme soporte científico y el generoso apoyo de muchos expertos. Todo ello hace pensar que, en efecto, intentarlo merece la pena.<br />Este formato está basado en XML y su desarrollo está a cargo del consorcio W3C (World Wide Web Consortium). La dirección de la página del consorcio donde se puede encontrar toda la información de su desarrollo es www.w3.org/Graphics/SVG/Overview.htm8, sin embargo, nosotros os aconsejamos leer este manual antes de adentraros en otras informaciones más técnicas, ya que aquí podremos ofreceros una visión general mucho más prosaica y digerible.En esta serie de artículos vamos a conocer algunas características de SVG y vamos a compararlo con otro formato para gráficos vectoriales mucho más conocido, propietario de Macromedia: Flash. Además, haremos referencia y analizaremos algunos programas para el diseño en SVG.<br />CARACTERÍSTICAS DE SVG<br />Está basado en XML, de modo que es un lenguaje extensible y su fuente no sólo queda a la vista de nuestros ojos, sino que también es editable. La principal ventaja de aquel primer aspecto es que las compañías de software pueden ampliarlo y aplicarlo de forma más ceñida a sus necesidades, sin que se pierda la comprensión prototípica y elemental entre todos ellos; es decir, siempre queda algo de entendimiento básico. La ventaja de la editabilidad en modo texto es muy evidente: el control sobre el modelado de formas es absoluto, incluso cuando nuestra herramienta WYSIWYG no disfruta de todas las opciones de desarrollo posibles. Además, podemos incluir código javascript y referencias a hojas de estilo en cascada. Dicho de otra manera, el flujo de trabajo en diseño podría ejecutarse desde una sola aplicación, ya que se trataría de intercambiar los códigos. ¿Se imaginan? Sería como jugar a los dados con un único cubo y sacar a la vez un dos y un cinco... Al margen de su naturaleza tecnológica, el formato SVG cuenta con numerosas ventajas que deberíamos tener en cuenta. En primer lugar, está auspiciado por el sonoro consorcio de las 3W; esto quiere decir que, siendo la gratuidad una de sus mejores bazas, las compañías pueden usarlo como formato nativo y de exportación sin costes específicos de patente. Incluso programas freeware pueden incluirlo entre sus opciones. ¿Son capaces de imaginar un programa gratuito exportando a flash? Bien, yo no. En segundo lugar, SVG es el medio ideal para diseñar bonitos gráficos vectoriales con un peso altamente asequible. ¿Merece la pena? Ok; pensamos con frecuencia que todo lo vectorial es simple, pero en realidad esto dista mucho de ser cierto. Se trata más bien de un asunto de talento. Además, el formato SVG faculta al diseñador para embeber imágenes de mapa de bits, superponiendo vectores que incluso puede animar a voluntad, o como respuestas a las acciones del usuario. Una vez más, dotamos a nuestros sitios del valioso factor interactivo. Pero todavía hay más. ¿Se imaginan aplicaciones de servidor generando gráficos claros, con rapidez y eficacia, sin la agresividad de otros formatos, a partir de los datos introducidos por el usuario, o como representación de informaciones que cambian constantemente, como por ejemplo cotizaciones bursátiles? SVG se encargará del trabajo sucio, ¡nosotros pensemos en cuánto dinero hemos ganado con la subida de nuestras acciones! En todo caso, éstas son tan solo algunas de las ventajas que podemos citar.<br />VISORES PARA EL FORMATO SVG<br />En todo caso, es de suponer que el usuario doméstico no siente un interés desmedido por las reglas que dan forma a SVG, de modo que entonces la pregunta más importante es: ¿debo pagar para disfrutar del nuevo estándar? Adobe SVG Viewer Ya que no hay muchos navegantes dispuestos a pagar por ello, hay un visor gratuito y sencillo. Se trata del plugin desarrollado por Adobe, que actualmente se encuentra en su versión 3 y está disponible en www.adobe.com/svg. <br />Nota: conviene apuntar aquí que, en el caso de navegadores Netscape, el plugin debe ser conducido de manera manual a la carpeta correcta, aunque de poco sirve a día de hoy. Netscape 7 sufre un bug que lo bloquea cuando debe interpretar un gráfico escalable embebido en la página, aunque ésta es una pequeña tara que sin duda será corregida en muy poco tiempo. <br />Otros visores Adicionalmente, existen otros visores, entre los que podemos señalar como ejemplos: <br />Batik SVG browser, de la fundación Apache. Un navegador SVG que funciona bajo plataforma Java. <br />SdVG viewer, de Bitflash, que incluye soporte para dispositivos móviles como los organizadores personales, como las Palm. <br />SVG in Mozilla project, para dotar compatibilidad con el formato en navegadores de la familia Mozilla. <br />La información completa sobre estos visores y otros está expuesta en la página SVG Viewers, dentro de la web oficial del formato SVG del World Wide Web Consortium.<br />
Svg
Svg
Svg
Svg
Svg

Mais conteúdo relacionado

Destaque

Bachiller artístico 13-14
Bachiller  artístico 13-14Bachiller  artístico 13-14
Bachiller artístico 13-14Maite Adbeitia
 
Bedienungsanleitung classic 01-2014
Bedienungsanleitung classic 01-2014Bedienungsanleitung classic 01-2014
Bedienungsanleitung classic 01-2014EHRICHTER
 
Praxis-Ratgeber: So finden Sie den passenden Stiftungsverwalter
Praxis-Ratgeber: So finden Sie den passenden StiftungsverwalterPraxis-Ratgeber: So finden Sie den passenden Stiftungsverwalter
Praxis-Ratgeber: So finden Sie den passenden StiftungsverwalterPHINEO gemeinnützige AG
 
C.P.Condomina Octubre 2010
C.P.Condomina Octubre 2010C.P.Condomina Octubre 2010
C.P.Condomina Octubre 2010APAlicante
 
Diseño visual j2
Diseño visual j2Diseño visual j2
Diseño visual j2enner20
 
Método de separación de mezclas
Método de separación de mezclasMétodo de separación de mezclas
Método de separación de mezclasIvan Ortiz Valdes
 
Presentación wiki como usar nuestra wki2
Presentación wiki como usar nuestra wki2Presentación wiki como usar nuestra wki2
Presentación wiki como usar nuestra wki2Edgar0622
 
Manual modulo de registro de fichas catastrales
Manual modulo de registro de fichas catastrales Manual modulo de registro de fichas catastrales
Manual modulo de registro de fichas catastrales Glenan Gora Porras
 
Presentacion trabajo
Presentacion trabajoPresentacion trabajo
Presentacion trabajoJesus
 
Innovación impulsada por la comunidad @ CityCampBA
Innovación impulsada por la comunidad @ CityCampBAInnovación impulsada por la comunidad @ CityCampBA
Innovación impulsada por la comunidad @ CityCampBAValentín Muro
 
Ejercicios 2 operadores
Ejercicios 2 operadoresEjercicios 2 operadores
Ejercicios 2 operadoresEdgar0622
 
Miss dich selbst - Fitnessstudio - Abschlusspräsentation
Miss dich selbst - Fitnessstudio - AbschlusspräsentationMiss dich selbst - Fitnessstudio - Abschlusspräsentation
Miss dich selbst - Fitnessstudio - Abschlusspräsentationdbbrg
 

Destaque (20)

Bachiller artístico 13-14
Bachiller  artístico 13-14Bachiller  artístico 13-14
Bachiller artístico 13-14
 
Neurologische Reha
Neurologische RehaNeurologische Reha
Neurologische Reha
 
Bedienungsanleitung classic 01-2014
Bedienungsanleitung classic 01-2014Bedienungsanleitung classic 01-2014
Bedienungsanleitung classic 01-2014
 
Praxis-Ratgeber: So finden Sie den passenden Stiftungsverwalter
Praxis-Ratgeber: So finden Sie den passenden StiftungsverwalterPraxis-Ratgeber: So finden Sie den passenden Stiftungsverwalter
Praxis-Ratgeber: So finden Sie den passenden Stiftungsverwalter
 
C.P.Condomina Octubre 2010
C.P.Condomina Octubre 2010C.P.Condomina Octubre 2010
C.P.Condomina Octubre 2010
 
Diseño visual j2
Diseño visual j2Diseño visual j2
Diseño visual j2
 
El computador
El computadorEl computador
El computador
 
Método de separación de mezclas
Método de separación de mezclasMétodo de separación de mezclas
Método de separación de mezclas
 
Salud ocupacional
Salud ocupacionalSalud ocupacional
Salud ocupacional
 
progManual
progManualprogManual
progManual
 
Recuperacion de la Red Maule luego del terremoto
Recuperacion de la Red Maule luego del terremotoRecuperacion de la Red Maule luego del terremoto
Recuperacion de la Red Maule luego del terremoto
 
Hück august 13
Hück   august 13Hück   august 13
Hück august 13
 
Presentación wiki como usar nuestra wki2
Presentación wiki como usar nuestra wki2Presentación wiki como usar nuestra wki2
Presentación wiki como usar nuestra wki2
 
Manual modulo de registro de fichas catastrales
Manual modulo de registro de fichas catastrales Manual modulo de registro de fichas catastrales
Manual modulo de registro de fichas catastrales
 
Presentacion trabajo
Presentacion trabajoPresentacion trabajo
Presentacion trabajo
 
Innovación impulsada por la comunidad @ CityCampBA
Innovación impulsada por la comunidad @ CityCampBAInnovación impulsada por la comunidad @ CityCampBA
Innovación impulsada por la comunidad @ CityCampBA
 
Compendio 4º
Compendio 4ºCompendio 4º
Compendio 4º
 
Photos
PhotosPhotos
Photos
 
Ejercicios 2 operadores
Ejercicios 2 operadoresEjercicios 2 operadores
Ejercicios 2 operadores
 
Miss dich selbst - Fitnessstudio - Abschlusspräsentation
Miss dich selbst - Fitnessstudio - AbschlusspräsentationMiss dich selbst - Fitnessstudio - Abschlusspräsentation
Miss dich selbst - Fitnessstudio - Abschlusspräsentation
 

Semelhante a Svg

Semelhante a Svg (20)

Diseñando con chamilo lms
Diseñando con chamilo lmsDiseñando con chamilo lms
Diseñando con chamilo lms
 
ESTUDIANTE
ESTUDIANTEESTUDIANTE
ESTUDIANTE
 
Manual de instalación
Manual de instalación Manual de instalación
Manual de instalación
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !Programación Reactiva, Javascript Isomorfo y Meteorjs !
Programación Reactiva, Javascript Isomorfo y Meteorjs !
 
Diseñando en Chamilo LMS
Diseñando en Chamilo LMSDiseñando en Chamilo LMS
Diseñando en Chamilo LMS
 
Aprendiendo a Programas en 4 horas JavaScript
Aprendiendo a Programas en 4 horas JavaScriptAprendiendo a Programas en 4 horas JavaScript
Aprendiendo a Programas en 4 horas JavaScript
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Pinargote quiroz jennifer
Pinargote quiroz jenniferPinargote quiroz jennifer
Pinargote quiroz jennifer
 
final
finalfinal
final
 
Edwin salazar
Edwin salazarEdwin salazar
Edwin salazar
 
Java Scripts
Java ScriptsJava Scripts
Java Scripts
 
Juegos html5
Juegos html5Juegos html5
Juegos html5
 
Historia del flash carlos moya 2 b2
Historia del flash carlos moya 2 b2Historia del flash carlos moya 2 b2
Historia del flash carlos moya 2 b2
 
Info
InfoInfo
Info
 
Info
InfoInfo
Info
 
Info
InfoInfo
Info
 
Todo sobre dreamweaver
Todo sobre dreamweaverTodo sobre dreamweaver
Todo sobre dreamweaver
 
Dreamwaver[1]
Dreamwaver[1]Dreamwaver[1]
Dreamwaver[1]
 

Último

EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveFagnerLisboa3
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21mariacbr99
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.FlorenciaCattelani
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxAlan779941
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfAnnimoUno1
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanamcerpam
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...JohnRamos830530
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfvladimiroflores1
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxMiguelAtencio10
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estossgonzalezp1
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITMaricarmen Sánchez Ruiz
 

Último (11)

EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21Innovaciones tecnologicas en el siglo 21
Innovaciones tecnologicas en el siglo 21
 
How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.How to use Redis with MuleSoft. A quick start presentation.
How to use Redis with MuleSoft. A quick start presentation.
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
Resistencia extrema al cobre por un consorcio bacteriano conformado por Sulfo...
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 

Svg

  • 1. 20001549402000200660SVGCARACTERÍSTICAS Y FUNCIONES6900096000SVGCARACTERÍSTICAS Y FUNCIONES730005673725center2420096000<br />SVG<br />Scalable Vector Graphics (SVG) es un lenguaje para describir gráficos vectoriales bidimensionales, tanto estáticos como animados (estos últimos con ayuda de SMIL), en XML. <br />SVG se convirtió en una Recomendación del W3C en Septiembre de 2001, por lo que ya ha sido incluido de forma nativa en el navegador web del W3C Amaya. Otros navegadores web, necesitan un conector o plug-in, para lo que se puede utilizar el Visualizador SVG de Adobe.<br />SVG permite tres tipos de objetos gráficos:<br />figuras de gráficos vectoriales (e.g., paths, que consisten en líneas rectas y curvas), <br />imagenes y <br />texto. <br />Los objetos gráficos se pueden agrupar, estilizar, transformar y componer en objetos previamente renderizados. El texto puede estar en cualquier espacio para nombres XML adecuado para la aplicación, lo que extiende la buscabilidad y accesibilidad de los gráficos SVG . El conjunto de características incluye transformaciones anidadas, truncamiento de rutas, máscaras alfama, efectos de filtro, objetos de plantillas y extensibilidad. Los dibujos SVG pueden ser dinámicos e interactivos. El Modelo de Objetos Documentales (DOM) para SVG, que incluye el DOM de XML completo, permite la animación directa y eficiente de los gráficos vectoriales vía scripting . Se puede asignar un rico conjunto de manipuladores de eventos como onmouseover y onclick a cualquier objeto gráfico SVG. Debido a su compatibilidad y potenciamiento de otros estándares web, se pueden hacer en elementos de SVG y otros elementos de XML de diversos espacios de nombres, características como el scripting simultáneo dentro de la misma página web.<br />SVG rivaliza con Macromedia Flash en terminos de potencial y poder, con la diferencia de que el primero es un estándar abierto.<br />La versión 1.5 de Mozilla Firefox soporta gráficos hechos con SVG. También, desde su versión 8, el navegador Opera ha implementado SVG 1.1 Tiny en su núcleo, por lo que ya no es necesario instalar un plug-in.<br />MOTIVACIÓN PARA CONOCER Y UTILIZAR EL SVG<br />Muchos webmasters opinan que Dios creó el Universo usando la tecnología Flash, propiedad de Macromedia, pero mucho me temo que eso no es del todo cierto. Al margen de las exquisiteces dinámicas e interactivas de la famosa extensión .swf, existen otros formatos que hacen de los sitios on—line lugares más divertidos y estimulantes de cara al usuario. Para empezar, el lenguaje javascript, combinado con opciones más convencionales y simples, puede convertir un sitio estático y aburrido en un lugar donde el navegante encuentra respuestas muy imaginativas a sus acciones en cada página que visita. La tecnología java también es útil, aunque a veces se emplea de forma innecesaria, consiguiendo que el usuario se irrite y se lo piense dos veces antes de volver al sitio. <br />Incluso las viejas páginas en html pueden ser un precioso paisaje de gráficos bien diseñados, bonitos y efectivos. Y de esto hay muchos ejemplos, ¿no es cierto? Al fin y al cabo, todo se puede reducir a una cuestión de creatividad o, dicho de otro modo, de cómo calibrar y combinar los valores de la belleza de nuestros sitios, y el peso que cada navegante está dispuesto a soportar antes de largarse a otro lugar. Antes de describir algunas de las nociones tecnológicas que dan sentido a SVG, quizás sea necesario hacer referencia a una de las cuestiones que normalmente se debaten entre aficionados y profesionales del diseño web. De un modo simple, la idea es ésta: ¿realmente merece la pena el SVG? Muchos desarrolladores opinan que ya hay suficientes formatos gráficos y de animación para trabajar y ser creativos, de modo que, tal vez, inventar algo nuevo sea una pérdida de tiempo. Para cuando se haya pulido lo sufiente, dicen, ya no tendrá sentido, porque Internet habrá avanzado, la banda ancha estará más difundida, y las viejas aspiraciones de archivos con bajo peso habrán perdido toda su vigencia. A fin de cuentas, ¡podremos transferir ballenas enteras, dato a dato, a través de la Red! Es sin duda una cuestión interesante, pero debemos tener en cuenta todas y cada una de las características de SVG. Visto globalmente, es una gran idea. Pequeño y veloz, ingenioso y gratuito, con un firme soporte científico y el generoso apoyo de muchos expertos. Todo ello hace pensar que, en efecto, intentarlo merece la pena.<br />Este formato está basado en XML y su desarrollo está a cargo del consorcio W3C (World Wide Web Consortium). La dirección de la página del consorcio donde se puede encontrar toda la información de su desarrollo es www.w3.org/Graphics/SVG/Overview.htm8, sin embargo, nosotros os aconsejamos leer este manual antes de adentraros en otras informaciones más técnicas, ya que aquí podremos ofreceros una visión general mucho más prosaica y digerible.En esta serie de artículos vamos a conocer algunas características de SVG y vamos a compararlo con otro formato para gráficos vectoriales mucho más conocido, propietario de Macromedia: Flash. Además, haremos referencia y analizaremos algunos programas para el diseño en SVG.<br />CARACTERÍSTICAS DE SVG<br />Está basado en XML, de modo que es un lenguaje extensible y su fuente no sólo queda a la vista de nuestros ojos, sino que también es editable. La principal ventaja de aquel primer aspecto es que las compañías de software pueden ampliarlo y aplicarlo de forma más ceñida a sus necesidades, sin que se pierda la comprensión prototípica y elemental entre todos ellos; es decir, siempre queda algo de entendimiento básico. La ventaja de la editabilidad en modo texto es muy evidente: el control sobre el modelado de formas es absoluto, incluso cuando nuestra herramienta WYSIWYG no disfruta de todas las opciones de desarrollo posibles. Además, podemos incluir código javascript y referencias a hojas de estilo en cascada. Dicho de otra manera, el flujo de trabajo en diseño podría ejecutarse desde una sola aplicación, ya que se trataría de intercambiar los códigos. ¿Se imaginan? Sería como jugar a los dados con un único cubo y sacar a la vez un dos y un cinco... Al margen de su naturaleza tecnológica, el formato SVG cuenta con numerosas ventajas que deberíamos tener en cuenta. En primer lugar, está auspiciado por el sonoro consorcio de las 3W; esto quiere decir que, siendo la gratuidad una de sus mejores bazas, las compañías pueden usarlo como formato nativo y de exportación sin costes específicos de patente. Incluso programas freeware pueden incluirlo entre sus opciones. ¿Son capaces de imaginar un programa gratuito exportando a flash? Bien, yo no. En segundo lugar, SVG es el medio ideal para diseñar bonitos gráficos vectoriales con un peso altamente asequible. ¿Merece la pena? Ok; pensamos con frecuencia que todo lo vectorial es simple, pero en realidad esto dista mucho de ser cierto. Se trata más bien de un asunto de talento. Además, el formato SVG faculta al diseñador para embeber imágenes de mapa de bits, superponiendo vectores que incluso puede animar a voluntad, o como respuestas a las acciones del usuario. Una vez más, dotamos a nuestros sitios del valioso factor interactivo. Pero todavía hay más. ¿Se imaginan aplicaciones de servidor generando gráficos claros, con rapidez y eficacia, sin la agresividad de otros formatos, a partir de los datos introducidos por el usuario, o como representación de informaciones que cambian constantemente, como por ejemplo cotizaciones bursátiles? SVG se encargará del trabajo sucio, ¡nosotros pensemos en cuánto dinero hemos ganado con la subida de nuestras acciones! En todo caso, éstas son tan solo algunas de las ventajas que podemos citar.<br />VISORES PARA EL FORMATO SVG<br />En todo caso, es de suponer que el usuario doméstico no siente un interés desmedido por las reglas que dan forma a SVG, de modo que entonces la pregunta más importante es: ¿debo pagar para disfrutar del nuevo estándar? Adobe SVG Viewer Ya que no hay muchos navegantes dispuestos a pagar por ello, hay un visor gratuito y sencillo. Se trata del plugin desarrollado por Adobe, que actualmente se encuentra en su versión 3 y está disponible en www.adobe.com/svg. <br />Nota: conviene apuntar aquí que, en el caso de navegadores Netscape, el plugin debe ser conducido de manera manual a la carpeta correcta, aunque de poco sirve a día de hoy. Netscape 7 sufre un bug que lo bloquea cuando debe interpretar un gráfico escalable embebido en la página, aunque ésta es una pequeña tara que sin duda será corregida en muy poco tiempo. <br />Otros visores Adicionalmente, existen otros visores, entre los que podemos señalar como ejemplos: <br />Batik SVG browser, de la fundación Apache. Un navegador SVG que funciona bajo plataforma Java. <br />SdVG viewer, de Bitflash, que incluye soporte para dispositivos móviles como los organizadores personales, como las Palm. <br />SVG in Mozilla project, para dotar compatibilidad con el formato en navegadores de la familia Mozilla. <br />La información completa sobre estos visores y otros está expuesta en la página SVG Viewers, dentro de la web oficial del formato SVG del World Wide Web Consortium.<br />