HTML and CSS Reference
you to complete complex, interactive SVG presentations.
Leveraging sVG drawing Tools
If you have gotten this far then you have realized that drawing
with SVG is complex. There are, unfortunately, very few illustra-
tion tools you can use to create SVG drawings. Fortunately, the
few tools that are on the market just happen to be very good.
Adobe's Illustrator has supported, since CSS2, the ability to
export any illustration in SVG format. This is great news, as you
can take complex drawings and import them directly to SVG.
While Illustrator will export to SVG, the Open Source project
InkSpace will save and edit SVG files directly. InkSpace is not as
easy to use as Illustrator, but it is free, and it is certainly easier to
create SVG illustrations with InkSpace than by scratch.
Sketsa is a Java-based SVG drawing tool. The tool itself is quite
basic, but, again, it is better than nothing.
Finally, if you use Google's Docs to create documents online
then you will be interested to know that the “Insert Image” fea-
ture uses SVG to create the images. Additionally, if you use a text,
then Google uses the complex Glyph editor to embed the fonts
The good news is that there are tools you can use to create
SVG illustrations. The bad news is that there are few tools you
can use to visually apply interactivity to your SVG drawings. With
SVG becoming more popular for sites such as Google Maps and
Wikipedia and now as a first-class citizen in HTML5, we should
expect SVG authoring tools to become more common.
adding the CaNVas Element to Your
There is a royal battle happening in the Web-o-sphere between
technologies that enable you to create cool, interactive anima-
tions online. The current “king” is Adobe's Flash, with Microsoft's
SilverLight coming in guns blazing. The “black horse” contender
is the emerging HTML5 standard. Baked into HTML5 is a new