Adobe SVG

by Joe Gillespie — Mar 1, 2000

Wouldn't it be nice to be able to design a Web page where you could use any layout you like, any set of fonts, whatever images or animation takes your fancy and to be certain that they are going to download quickly, look the same in every browser and print just like they appear on the screen?

Pipe dream?

No, it's closer than you think.

Adobe have just launched public betas of their implementation of SVG, or Scaleable Vector Graphics. If you already understand the difference between a bitmap file and an EPS you will appreciate that vector-based graphics are much leaner and meaner and are infinitely scaleable without loss of quality.

"Hey, wait a minute", I hear you say, "Aren't you talking about Macromedia's Flash here?"

Well, it's true, Flash is also based on vectors but the big difference is that Flash is a proprietary format exclusively owned and controlled by Macromedia. SVG is an open-standard vector graphics language based on XML (Extensible Mark-up Language) and has been developed by a working group of the World Wide Web Consortium (W3C) that includes all the big names in the industry.

Although I have referred to 'Adobe SVG' in the heading, and they have undoubtedly played a major part in its development, SVG doesn't belong to any one company. Anyone can develop SVG-based applications to support SVG creation, editing and display - and they will.

SVG allows you to create complete Web pages with scaleable graphics, embedded fonts, gradients, transparency and unbelievable animation and filter effects that can be addressed by plain text commands such as JavaScript. Because they are vector-based, bandwidth requirements are light. SVG and the Web were made for each other!

Adobe has put beta versions of a SVG export module for Illustrator 8.0.1 (it doesn't work with earlier versions) and a plug-in that works in version 4 or better of both Netscape and Explorer. (Although you need a plug-in at the moment, SVG support will be built-in to browsers in the very near future.)

With these two items, you can begin to explore the possibilities of the SVG format. If you use a drawing program other than Illustrator, you will have to be a little more patient. Macromedia (Freehand) and Corel are both members of the SVG working-group, as are Apple, Netscape and Microsoft, so you will get the tools you want in due course.

Drawings or page layouts done in Illustrator, can be exported as .SVG files (with or without compression). When viewed in a browser, they maintain the exact same layout and fonts and you can zoom-in and out to examine details more closely. And, being vector-based, they are resolution independent and print perfectly on any output device - a cheap ink-jet printer, a poster printer or a high-end film-setter.

I'm very excited about the possibilities of SVG. I'd much rather use Illustrator to design a Web page than Dreamweaver or GoLive, but I dare say, we will be seeing programs even more dedicated to SVG creation very soon.

Adobe SVG
Features red bar95%
Ease of Use yellow bar90%
Value for Money green bar95%
'Must Have' Factor blue bar95%
Manufacturer Adobe Systems
Price Free for Mac and PC (but requires Illustrator 8.0.1).
Summary A milestone in the WWW's development.
Del.icio.us Digg Technorati Blinklist Furl reddit Design Float