Hello and welcome to Up and Running with SVG from Mijingo. I’m Ryan Irelan, your author, instructor, and host. This is a condensed text version of the full SVG video course available at Mijingo.com.
Table of Contents
- What is SVG?
- Why Should You Use SVG?
- Shortest History Ever of SVG
- Is it safe to use SVG?
- The Tools We’ll Use
- Creating SVGs with Tools
- Creating SVGs with Code
- Important SVG Elements
- Adding SVG to Your Template Code
- Styling SVG with CSS
- SVG Browser Support
- SVG and Performance
- Optimizing SVG with Grunt
- Additional Tools & Resources
- Epilogue & Acknowledgements
Learn by Watching & Doing
The video course companion to this website covers everything you need to know to get up and running with SVG. Over 100 minutes and more than two dozen working code examples, you’ll learn the following:
- Creating SVGs in Adobe Illustrator
- Converting a bitmap image to SVG
- Coding SVG by hand and understanding the attributes
- The SVG
viewBoxattribute and the user coordinate system
- How to create SVG rectangles, circles, ellipses, and more.
- All of the most important SVG elements and their attributes
- The options for adding SVG to your code (the good, the bad, the fallback)
- Considerations about SVG browser support and fallback options
- SVG performance considersations, and how to use
- Additional tools and resources to continue learning and masterings SVG
There’s more about the SVG video course over at Mijingo.
Enjoy learning SVG (oh, and here’s an SVG of my name),