My heart beats for design. We want good design to be visually attractive and useable. No arguing about that. And now that the time has come where fancy web applications are increasingly taking over the desktop applications we get problems with websites looking like websites and not applications. So what do we counter?
Bitmap graphics is the answer. But as our websites are morphing into applications we are really fighting with those little graphics. And we are discovering the limits. Hovering menus with transparent desktops, rounded corners and blurry shadows, that’s the eye candy we are used to. And if the whole new glorified “having all applications online instead of installing them locally” thing is SO cool, it at least has to have the same looks. Or better, that’s understood!
So what do we do now? Dismiss HTML completely? Gosh, wouldn’t it be great to have a simple something, whereby we could draw, animate and manipulate images right into our browsers? …Wait there was something … wasn’t that called SVG and introduced by the W3C in 1999? Damn sure it was!
SVG today?
Surprisingly most of the current browsers DO support SVG, sadly most of them not the full possible spectrum. But if you only use it for drawing like shapes, gradients and clipping masks you’ll have it supported by about 90% of the users. That relates to the current browser usage statistics of the W3c Schools.
So what’s the problem, then?
I actually wonder why SVG is used that little. And yes, there is a problem. Text rendering. For example Firefox doesn’t support letter-spacing in their current releases. And if they don’t support it, no one’s gonna use it. But if no one’s gonna use it, they won’t support it in future versions. That’s really lame.
I tend to think SVG is a forgotten technology using very interesting concepts including the possibilities like updating the whole graphic at runtime via JavaScript in its own DOM Tree, animating the whole graphic with the same DOM Tree, Zooming and Panning, .. etc.
Additionally Thiam Kian Chiew from the Glasgow University stated in his Web Page Performance Analysis that the most important impact on good performance is keeping the HTTP – requests to a minimum. He also found out that the average count of objects loaded for one website, each in its own requests is 50. If you simply calculate a round trip- and rendering it all together time of 0.2 seconds for every request you end up with 10 seconds for a site! That is slow and miles away from responsive desktop applications. Using SVG to draw the graphics of a website the whole graphics information would be included in the first HTTP – request. Add a few bitmap photos and we could calculate with about 1 second a site including 5 photos. That’s about 10 times faster!
But HTML5 Canvas will be the knight in the shining armor, right?
Not really. No doubt, canvas is good since it was developed by Apple for the WebKit Framework and btw. legally still belongs to Apple. They only wrote a disposal, assuring it to be free if the W3C uses canvas in their drafts.
The one thing missing is a proper DOM tree. I think we currently developed so much frameworks around JavaScript manipulating a DOM tree. SVG really is exactly the same. Those frameworks can be adapted in no time to get stunning open source graphic manipulation frameworks. Low and high level. I really think we should give it a second chance. Because the web is going to evolve from displaying documents to displaying applications, don’t you think?
Further Reading
By the way, this whole website design is made with SVG, did you see it?
One Response to “SVG rules the world – not!?”
Oct 25, 2009
SVG is not forgotten, but certainly went through tough times. But there’s quite a renaissance happening. Read about how great SVG Open 2009 was? And i can tell you Mozilla keeps implementing more and more. You can always file a bug, or even better, code a patch. See http://planetsvg.com ?
Post a Comment