Google's SVGWeb Brings SVG Support to All Browsers

The open graphics format called scalable vector graphics (SVG), and the animation of it, has not seen much use on the web, despite becoming a W3C recommendation about 8 years ago. Why? Lack of support in Internet Explorer (please die!), of course. Did you really have to ask?

Thats right, the latest versions of all major browsers (Firefox, Safari, Chrome, Opera) have a high level of native support for displaying and interacting with SVG, but not Internet Explorer. To make matters worse, the recent Internet Explorer 8 still does not have any native support for it. 

While it is possible to bring SVG support to IE by installing a third party plug-in, but that is never a good idea if your goal is to unobtrusively reach the most amount of users possible. Google, realizing the widespread installed user base of Flash (probably >95% of users), decided to basically implement SVG through Flash so that anyone who has Flash installed will be able to see and interact with SVG content. 

The package, called SVGWeb, consists of some javascript and an SWF (Flash) file. Thankfully, this is not an API, and there is no custom language or function calls to use it . You simply put your SVG content in your page as you would normally would (in a perfect world), and include the JS library which will detect if the browser has native SVG support or not. If it has support, it will essentially do nothing special. If it doesn't (IE), SVGWeb will take over and use Flash.

With SVG, all your drawn objects (circle, line, square, etc.) become part of the document object model (DOM), just like any other HTML element like <div> or <table>. That means that they can be fully styled with CSS, and even better, they can be dynamically changed and respond to DOM events (click, mouseover, mousedown, etc) right in the page! Amazingly, the coders at Google found a way to convert your javascript that you wrote for the SVG objects sitting in the page, to the rendition of your SVG stuff running in the Flash viewport! In other words, your same javascript + SVG code will work in Firefox, Safari, and (finally!) Internet Explorer (provided the IE users have Flash installed). 

Oh yeah, did I mention SVG content is search engine friendly? It is, being pure XML and thus text-based. 

This open source library is fairly new and still in the alpha stage. As a result, there still may be some quirks that have to be worked out. But it looks very promising. You can look at examples or download it now at Google Code and begin using it today. The hope is that developers can begin using SVG with this library and be confident that there will be huge readability support for end users.

Share this article!