Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

zoran

macrumors 601
Original poster
Jun 30, 2005
4,819
135
What are the advantages that is offered by the use of an svg file when designing a website?
 
It's a vector graphic format, widely supported. Its size is tiny, you can modify it on the fly.

Change the visible part of it, change its dimensions, colorings or effects. You can animate it. You can do all listed modification by code.

What else do you need? :)
 
Inlined SVG has the nice property that each SVG object is exposed as part of its page's DOM (Domain Object Model). That means that one can manipulate SVG objects with JavaScript, like what one can do with other page contents. It's an alternative to HTML Canvas. Here are some examples that I've written:

2D Point-Group Demo
Organism-Symmetry Demo

Firefox can apply SVG filters to webpage contents, and I've created a color-blindness simulator that operates on webpages: Color-Blindness Simulator for Webpages
 
I use them a lot to manipulate objects since there's many adjustments we need to make in order to function properly.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.