SVG is text-based
Resolution Independent
Reducing HTTP Request
Styling and Scripting
Can be animated and Edited
Smaller File Size
SVG is XML and works within other language formats
SVG is easily edited
2. Introduction :
ScalableVector Graphics (SVG) is an XML-based vector
image format for two-dimensional graphics that has support
for interactivity and animation.The SVG specification is an
open standard developed by the WorldWideWeb
Consortium (W3C) since 1999. SVG allows three types of
graphic objects: vector graphics, raster graphics, and
text.
3/25/20142
3. About SVG :
3/25/20143
? Filename extension : .svg, .svgz
? Internet media type : image/svg+xml
? Type code : "svg ", "svgz"
? UniformType Identifier : public.svg-image
? UTI conforms to : public.image and public.xml
? Developed by : W3C
? Initial release : 4 September 2001; 12 years ago
? Latest release : 1.1 (Second Edition) / 16August 2011; 2 years ago
? Type of format : Vector image format
? Extended from : XML
4. Why use SVG?
? SVG is text-based
? Resolution Independent
? Reducing HTTP Request
? Styling and Scripting
? Can be animated and Edited
? Smaller File Size
? SVG is XML and works within other language
formats
? SVG is easily edited
3/25/20144
5. Advantages of SRG over SVG:
3/25/2014
?This image illustrates the difference between Raster(bitmap) and
Vector images.
?The Raster image is composed of a fixed set of dots, while the
vector image is composed of a fixed set of shapes.
?In the picture, scaling the bitmap reveals the dots while scaling the
vector image preserves the shapes.
5
6. SVG on the web :
3/25/20146
? Google announced on 31August 2010 that it had started to
index SVG content on the web, whether it is in standalone
files or embedded in HTML, and that users would begin to
see such content listed among their search results. It was
announced on 8 December 2010 that Google Image Search
would also begin indexing SVG files .On 28 January 2011, it
was discovered that Google was allowing Image Search
results to be restricted exclusively to SVG files.
7. SVG(1.1) supported browsers:
3/25/20147
? Flock
? Firefox
? Camino
? Konqueror
? SeaMonkey
? Apple's Safari
? Google Chrome
? The Omni Group's OmniWeb
? Internet Explorer 9,Amaya(partially supports SVG)
8. Example of an ellipse SVG image with code :
3/25/20148
9. Example of an ellipse SVG image with code
and within text :
3/25/20149