scale-a-vector.de - to homepage
 
search



Scalable Vector Graphics  




















Definition and example
 
SVG (Scalable Vector Graphics) has so many advantages and offers so many possibilities, I feel like doing somersaults of joy.

Definition 



Latest update: 2005 
 What is SVG?
   
 SVG is an XML-language for the creation of two-dimensional vector graphics for the internet (amongst others). As opposed to Flash they can be created in any simple and free text editor (instead of an expensive software like Flash).
Keywords: ASCII-code instead of a binary format.
 
 On 4th September 2001 SVG has become a W3C standard.
Keywords: Free standard instead of proprietary features.
 
 Since SVG files are text-based, they have a much lower filesize than raster images (JPGs, GIFs etc.).
 
 Furthermore the filesize can even be decreased by using both internal as well as external stylesheets (CSS).
 
 Really big SVG files can be further compressed by using GZIP (suffix .svgz). The saving potential is immense.
 
 Also filter effects - known from raster images - like e.g. shadow, lightning, Gaussian blur or distortion can be applied.
 
 You can, however, make use of raster images in SVG files, e.g. by embedding a beautiful landscape as background.
 
 You can embed SVG files in your HTML-file or create whole websites in the SVG-format.
 
 There are more layout opportunities as opposed to HTML-files. When designing you can follow your impulses instead of bothering with those HTML-file-restrictions.
 
 You don't have to do without animations, dynamical elements or interactivity, either.
Many effects, like e.g. mouseOver, can be realized with pure declarative SVG-code.
You can, however, combine SVG with JavaScript/ECMA-script.
Furthermore, whole SVG files or single elements can dynamically be created serverside (using PHP, Perl, ASP, JSP, Ruby...).
 
 If you have a problem with the fontsize you can zoom into (and out of) an SVG-file.
Zooming is also quite advantageous in SVG-maps.
 
 SVG files can be printed in all resolutions with best quality, they never get pixely or jagged.
 
 You can search for text in SVG files, e.g. for a street name in a map.
Also search engines can index SVG files, Google does it since March 2005 :-)
 
 Soundfiles (MP3 and WAV) can be embedded in SVG files (streaming sound is, however, not possible yet).
 
 Futhermore SVG is perfectly suited for applications on mobile devices like cell phones and PDAs!
 
But that's not all by far!
In short: let's hope for a further continuing spreading of SVG!
 
 

 Example
   
This simple graphic has been made with the code below (you can see it without an SVG Viewer, because it is only a screenshot).
 
Example
 
SVG-code of the example
 
 
You can see further examples amongst others here, but you will need an SVG Viewer.
 
A list of all SVG files on this site is here.
 
 



© 2001-2005 Petra Kukofka E-Mail symbol  kukofka@scale-a-vector.de back to topback to top