The benefits of using Scalable Vector Graphics (SVG) are vast and exciting: scalability, DOM accessibility, searchability, accessible text and descriptions, strong browser support, plays well with CSS, amazing interactive abilities, and easy to edit effects. This workshop will look specifically at these benefits and how they pertain to a web designer’s workflow.
Together we will go over the basics of SVG to develop a foundation, review some program options, walk through the structure of a document, bring an SVG to a site as an image, inline, and as a background image, and edit these graphics with CSS. If you aren’t sure how to even get started with SVG then this is the workshop for you.
We will wrap up this workshop by touching on some things to keeps in mind while working with SVG on the web (a head’s up on potential “gotchas!”) and where to go moving forward with your newfound, overwhelming love of these graphics; animation! gradients! patterns! light source effects!
Let’s take on this complex language and make it less intimidating through practical examples and exercises that you will find beneficial in your daily work.
Requirements: You will need knowledge of HTML and CSS and a computer to get the most out of this class. Prior familiarity with CodePen is also recommended.