Adjust type size
Larger | Smaller


Karen Vagts: XML Portfolio

[ XML Course Web Page ] [ XML Portfolio Home ]
[ XML Resources ]

Assignment 6

Practice creating .svg pages.

Scalable Vector Graphics (SVG) are the XML approach to, or "flavor of", graphics. What is nifty about SVG is that you don't need an expensive, proprietary graphics software package to create vector-based images. You can create SVG graphics in any basic text editor, just as you can any other XML document. What is tough about SVG, however, is that trying to drawing in text is not very easy unless you are doing something simple and remember your high-school coordinate geometry.

The links here are to two different approaches to create SVG. Note that they will appear differently in different browsers and platforms (and they may require a plug-in like the Adobe SVG Viewer to be viewable) and the functionality will differ (Microsoft Explorer 6 offers the most reliable functionality).

SVG Illustration 1

This is a basic SVG built from scratch in NotePad and edited in Amaya (a free HTML/XML tool from the W3C). It includes a tiny ECMAscript and some transformations in addition to basic SVG default shapes.

SVG Illustration 2

This is an SVG drawn in Adobe Illustrator CS. With Illustrator, SVGs are graphically easy to draw and you can apply SVG filters and scripts. But if you check the source code for the SVG file, you will see a lot of proprietary Adobe content and you are rather committed to the software if you want easy control over future revisions.

More on SVG >>