Scalable Vector Graphics (SVG) are a promising technology. We've all known for years that vector graphics are, scalable as they tend to be, a great thing and often more useful than raster-based image formats. SVG in particular is nice because it's
- all text
- an XML-based format, and thus hip in the industry
- an open format
- an open XML-based format, and thus portable and good with stuff like XSL-T.
Web browsers like to boast about their SVG support, it being a hip technology pushed as a web standard by the W3C, and the support isn't bad. Recent versions of Gecko (Firefox etc), Opera, KHTML and WebKit have all implemented a working subset of SVG and are able to display simple images correctly. Some browsers (at least Firefox and Opera) have decent support for XSL-T style sheets, allowing you to display an XML data sheet graphically in a browser by linking a suitable style sheet at the top — I never expected this, but I was pleasantly surprised when I discovered that last year. Also interesting is the support of ECMAScript within SVG, making it possible to play tetris in a vanilla IceWeasel.
What was this stuff called again?
We're talking about scalable vector graphics within a WWW context. The fact that these things are scalable could be used to our advantage, n'est-ce pas ? Let's say you have a website styled with only ems for measuring distance, no pixels or other absolute stuff. Being nice and accessible, having the whole website scale when you hit Ctrl++ or Ctrl+-. Something like
<img src="foo.svgz" alt="An illustration of bar" style="width:20em"/> should be just what you need. So, which browser supports that ? Bingo, not a single one !
There is a standard, portable way to include SVG in websites: you use the
<object> tag, like so:
<object type="image/svg+xml" data="foo.svgz" ...>. This works in pretty much all modern browsers (if you don't count IE7, but why would anyone call that bastard “modern” ?), but it doesn't do what I want it to do: it doesn't scale the graphic. At all. It stubbornly uses the size in the SVG file. If you're lucky, zooming with change the font size in the image, but only the font. What's the point of that, I ask you ? Why bother with scalable vector graphics support if you can't scale them ? Maybe we should call them scriptable vector graphics when using them on the web...