Los últimos tutoriales de desarrollo web
 

SVG Tutorial


SVG es sinónimo de gráficos vectoriales escalables.

SVG define gráficos basados ​​en vectores en formato XML.


Ejemplos de cada capítulo

Con nuestro "Inténtelo usted" editor, puede editar el SVG, y haga clic en un botón para ver el resultado.

Ejemplo SVG

<html>
<body>

<h1>My first SVG</h1>

<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>

</body>
</html>
Inténtalo tú mismo "

Lo que usted debe saber ya

Antes de continuar, debe tener algún conocimiento básico de los siguientes:

  • HTML
  • XML básico

Si quieres estudiar estos temas en primer lugar, encontrar las clases particulares en nuestra página de inicio .


¿Cuál es SVG?

  • SVG significa Scalable Vector Graphics
  • SVG se utiliza para definir los gráficos basados ​​en vectores para la Web
  • SVG define los gráficos en formato XML
  • gráficos SVG no se pierde ninguna calidad si el efecto de zoom o cambiar el tamaño
  • Cada elemento y cada atributo en archivos SVG pueden ser animados
  • SVG es una recomendación W3C
  • SVG se integra con otros estándares del W3C como el DOM y XSL

SVG es una Recomendación del W3C

SVG 1.0 se convirtió en una recomendación de la W3C el 4 de septiembre de 2001.

SVG 1.1 se convirtió en una recomendación de la W3C el 14 de enero de 2003.

SVG 1.1 (Second Edition) se convirtió en una recomendación de la W3C el 16 de agosto de 2011.


Ventajas SVG

Ventajas del uso de SVG sobre otros formatos de imagen (como JPEG y GIF) son:

  • Las imágenes SVG pueden ser creados y editados con cualquier editor de texto
  • Las imágenes SVG se pueden buscar, indexar, secuencias de comandos, y se comprimen
  • Las imágenes SVG son escalables
  • Las imágenes SVG pueden ser impresos con alta calidad en cualquier resolución
  • Las imágenes SVG son zoomable (and the image can be zoomed without degradation)
  • SVG es un estándar abierto
  • archivos SVG son puros XML

El principal competidor de SVG es flash.

La mayor ventaja SVG tiene sobre Flash es el cumplimiento de otras normas (eg XSL and the DOM) . Flash se basa en la tecnología patentada que no es de código abierto.


La creación de imágenes SVG

Las imágenes SVG se pueden crear con cualquier editor de texto, pero a menudo es más conveniente para crear imágenes SVG con un programa de dibujo, como Inkscape .