
SVG
by Ellen Pearlman
Start the free chapterVirtual Training Company author Ellen Pearlman teaches users the power of Scalable Vector Graphics (SVG), a modularized language for describing two-dimensional vector and mixed vector/raster graphics in Extensible Markup Language (XML). SVG is essentially a subset of XML, allowing for three types of graphic objects: vector graphic shapes, images and text. Unlike Flash ActionScript, SVG is text based, allowing search engines to index based on graphics. Graphical objects can be grouped, styled, transformed and composited into previously rendered objects. Click on a movie topic below to begin learning!
Course content
Introduction to SVG6 lessons
SVG Document Structure12 lessons
- Well Formed Document4:121 credit or ad
- Valid Document3:341 credit or ad
- SVG Text Statements7:071 credit or ad
- SVG Viewport5:261 credit or ad
- Viewbox4:471 credit or ad
- Preserve Aspect Ratio Attribute3:051 credit or ad
- Meet and Slice Ratios Attribute2:281 credit or ad
- Container Elements5:031 credit or ad
- Use Element3:271 credit or ad
- Streamlining Code2:301 credit or ad
- Defs Element2:001 credit or ad
- Symbol Element3:321 credit or ad
The SVG Coordinate System6 lessons
Basic Shapes10 lessons
- Rounded Rectangle3:431 credit or ad
- Filled Rectangle / Circle / Ellipse4:251 credit or ad
- Polygon Element5:231 credit or ad
- Polyline Element0:321 credit or ad
- Line Element1:471 credit or ad
- Text in SVG3:221 credit or ad
- DX and DY Attributes1:481 credit or ad
- Tspan and Tref Elements2:061 credit or ad
- Fonts / Kerning / Baseline Shift4:031 credit or ad
- Internationalization2:531 credit or ad
Paths6 lessons
Gradients and Fills and Patterns8 lessons
- Color / Color Fill and Stroke Order5:181 credit or ad
- Linear Gradients pt. 13:171 credit or ad
- Linear Gradients pt. 25:551 credit or ad
- Spread Method Attribute3:111 credit or ad
- Radial Gradients pt. 15:581 credit or ad
- Radial Gradients pt. 22:261 credit or ad
- Patterns pt. 13:151 credit or ad
- Patterns pt. 24:331 credit or ad
Filters13 lessons
- Intro Filter Elements pt. 15:191 credit or ad
- Intro Filter Elements pt. 22:481 credit or ad
- Diffuse and Specular Light pt. 14:311 credit or ad
- Diffuse and Specular Light pt. 22:321 credit or ad
- feComposite pt. 16:221 credit or ad
- feComposite pt. 25:231 credit or ad
- feImage / feFlood / feTile4:561 credit or ad
- feMorphology4:261 credit or ad
- feDisplacementMap / feTurbulance6:341 credit or ad
- feColorMatrix5:351 credit or ad
- feCompononentTransfer pt. 15:271 credit or ad
- feCompononentTransfer pt. 21:561 credit or ad
- feConvolveMatrix6:331 credit or ad
Clipping and Masking6 lessons
Cascading Style Sheets3 lessons
Animation and Interactivity11 lessons
- Intro to SVG Animation5:191 credit or ad
- Animate4:411 credit or ad
- Set Animate Color3:221 credit or ad
- Animate Motion pt. 12:441 credit or ad
- Animate Motion pt. 24:231 credit or ad
- Timing pt. 15:371 credit or ad
- Timing pt. 23:561 credit or ad
- Chaining and Repeating4:241 credit or ad
- Radial Gradients3:281 credit or ad
- Interactive Events6:341 credit or ad
- A Brief Look at Scripting5:561 credit or ad