Knowledge, Terminology and Conventions
Necessary Knowledge
The SVG standard is built upon other open standards from the W3C and ECMA standards organizations. XML, CSS (Cascading Style Sheets), DOM (Document Object Model), ECMAScript (aka JavaScript) and SMIL (Synchronized Multimedia Integration Language) all contribute to the standard. At least some knowledge of XML is necessary to write SVG documents (as they are written in XML). If you've never worked with XML then go read up on at least the basics before you proceed.
CSS is integrated into SVG to provide the same styling template function it performs with HTML. The basics of CSS are not terribly complex and will be explained alongside SVG. Only in the creation of highly complex SVG documents will a deep knowledge of CSS be of benefit. ECMAScript and SMIL are only necessary once you start creating animated and live documents. See: CSS Styling
Terminology and Conventions
Unless a version number is specifically stated then 'SVG' refers to SVG version 1.1.
When a SVG element example is given the attributes of the corresponding XML tag will be coded using the following conventions.
Legend
BOLD means the attribute is required.
Green means the attribute is optional.
Italics denotes a presentation attribute of the shape like 'fill' which is both optional and shared with other SVG elements.
Example: (Rectangle)
This implies without 'width="..." height="..."' the rect element will not be valid and must always appear in a rectangle declaration. The rest of the attributes are optional and the default for missing attributes will be used.
Attributes like stroke-width are written in a monospace font.
Hi there. This is a comment from the author. Yep, SVG builds upon a number of different technologies. This tutorial provides numerous examples to allow you to focus on creating the image that you want. Don't worry if you don't know many of the technologies above. A basic knowledge of XML is the most necessary skill. Hopefully, just working your way through this tutorial will brush up your XML.