Creating Web Icons with SVG
With Morten Rand-Hendriksen
Liked by 178 users
Duration: 1h 44m
Skill level: Intermediate
Released: 8/4/2016
Course details
As designers and developers of the web, we want graphics to look sharp, but we need to keep file sizes down for performance. How do you get the best of both worlds? There is pretty much only one way to go: SVG.
SVG is an XML-based method for instructing the browser to draw scalable vector graphics based on defined shapes and coordinates. The challenge with SVGs is they are not like other graphic files: Rather than a grid of pixels, they are code instructions interpreted by the browser on the fly. This poses some unique challenges and unique opportunities when it comes to implementation. In this course, you'll learn various methods to deploy SVG icons in webpages, each with its own use cases, benefits, and drawbacks. Morten Rand-Hendriksen shows how to insert individual SVG images, add SVGs as inline elements and SVG sprites via the command line, and automate SVGs with Grunticon. Plus, get tips on making your graphics backward-compatible and accessible, and using SVG icons in WordPress.
SVG is an XML-based method for instructing the browser to draw scalable vector graphics based on defined shapes and coordinates. The challenge with SVGs is they are not like other graphic files: Rather than a grid of pixels, they are code instructions interpreted by the browser on the fly. This poses some unique challenges and unique opportunities when it comes to implementation. In this course, you'll learn various methods to deploy SVG icons in webpages, each with its own use cases, benefits, and drawbacks. Morten Rand-Hendriksen shows how to insert individual SVG images, add SVGs as inline elements and SVG sprites via the command line, and automate SVGs with Grunticon. Plus, get tips on making your graphics backward-compatible and accessible, and using SVG icons in WordPress.
Skills you’ll gain
Earn a sharable certificate
Share what you’ve learned, and be a standout professional in your desired industry with a certificate showcasing your knowledge gained from the course.
-
Showcase on your LinkedIn profile under “Licenses and Certificate” section
-
Download or print out as PDF to share with others
-
Share as image online to demonstrate your skill
Meet the instructor
Learner reviews
Contents
What’s included
- Practice while you learn 1 exercise file
- Learn on the go Access on tablet and phone
Similar courses
Download courses
Use your iOS or Android LinkedIn Learning app, and watch courses on your mobile device without an internet connection.