SVG

Slides

Resources

Scalable Vector Graphics

• Medium: “How Designers Should Think About SVG” by Peter Nowell
• MDN: SVG Tutorial
• W3C: SVG 1.1 Spec (1st Edition, 2003–2009)
• W3C: SVG 1.1 Spec (2nd Edition, 2011)
• W3C: SVG 2 Spec (currently a Candidate Recommendation)
• Wikipedia: Scalable Vector Graphics

Shapes, Fills, and Strokes

• MDN: <rect>
• W3C: SVG Painting
• W3C: SVG Painting: Fill Properties
• W3C: SVG Painting: Stroke Properties
• MDN: SVG Tutorial: Fills and Strokes

SVG + CSS

• CSS-Tricks: Presentation Attributes vs Inline Styles
• CSS-Tricks: Cascading SVG Fill Color

SVG Sizing

• W3C: CSS Intrinsic Size Determination
• W3C: Inline, replaced elements

Optimization

• ImageAlpha
• ImageOptim
• SVGO
• SVGOMG
• CodePen: “Optimizing SVGs in data URIs” by Taylor Hunt

Credits