Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Usability

Web Design Reference Guide

Hosted by

Scalable Vector Graphics: SVG

Last updated Oct 17, 2003.

Another possible up-and-comer to the world of graphics is SVG, Scalable Vector Graphics. SVG uses XML and mathematical instructions to create any one of three graphic objects. These objects include images, text, and vector graphics shapes, which have paths with straight lines and curves). Unlike other objects, SVG-based objects are created using text, making it faster to download, easier to search, and simple to modify. Because it uses XML, SVG graphics are easily integrated with other Web technologies.

SVG has the capability to be styled using CSS and scripted with any language and respond to user actions. It has the XML DOM, which means developers don't have to learn another programming interface to use SVG. To view SVG graphics requires downloading and installing the free viewer from Adobe. There are also development tools for creating SVG.

Because of its small file size and vector capabilities (using text), SVG is likely to become hot in the portable industry working with wireless and portable devices. Because SVG objects can be defined as clipping paths, they can be used to create special effects. Masks, gradients, filters, animation, and transformations are all possible with SVG. Because it's relatively new to many and lacks browser support, it'll take time for adoption.