About the Tutorial Welcome to the SVG Tutorial. SVG (Scalable Vector Graphics) is the recently released W3C open standard for creating two-dimensional (2D), dynamic, and interactive graphics to be delivered over the Web.

Course Description

This tutorial introduces you the fundamentals of SVG from the ground up. In this tutorial, you'll learn

• the key concepts and functionality in SVG,
• the structure, organization and syntax of an SVG document,
• the major SVG graphic elements and their attributes, and
• how to create graphical objects, animated and interactive graphics using SVG

Each session in this tutorial builds on the concepts learned in earlier sessions. Each drawing lesson contains coding examples to demonstrate you how the SVG graphics or painting effects are created. The quiz at the end of each session helps you test your knowledge of the materials you have just learned.

Target Audience

This tutorial is for SVG beginners. No prior experience with SVG is necessary.

Recommended Skills

XML experience is not required, but a familiarity with at least one tagging language (such as HTML) will be useful.

Tools

The tutorial demonstrates the building of SVG documents. To follow along, you will need an editor and a viewer:

• A plain text editor, such as Notepad, is all you need to create SVG files.

• An SVG viewer: The most up-to-date SVG viewer as of the time of this writing is Adobe's SVG Viewer, version 3.0, available free from Adobe.
  • 
• System Requirement of Adobe SVG viewer for windows and Macintosh
• Tips for using the Adobe viewer
• A browser: The Adobe viewer works with most current browsers, such as Netscape Navigator 4.x (Netscape 6 is not supported) and Microsoft Internet Explorer 5.x and above.