Meta Refresh 2018

The web in your pocket

Journey towards SVG Ninja Land

Submitted by Prashant (@prashantsani) on Saturday, 30 September 2017

videocam_off

Technical level

Beginner

Section

Full talk

Status

Submitted

Vote on this proposal

Login to vote

Total votes:  +2

Abstract

SVG is one of the most powerful but under-utilised tool of the modern web. This talk would focus on utilising the power of SVGs beyond using them as static images and background images.

Outline

Outline:

  1. SVG Very Very Basics
  2. Shapes/Tags Available (eg. circle, polyline, line, etc)
  3. Fills and strokes
  4. Icon Fonts Vs SVG and SVG Spriting
  5. SVG Scaling: SVG Viewport and values for preserveAspectRatio
  6. SVG Animation using CSS
  7. SVG Filters
  8. Using SVG Creatively in your project
  9. SVG optimisation techniques at design level

Slides to be updated soon!

Requirements

  1. Basic HTML & CSS knowledge
  2. An Open Mind.

Speaker bio

Prashant Sani is a freelance front-end developer with an experience of over 5 years. He primarily works on utilising the power of HTML, CSS, SVG and JavaScript to create responsive and interactive website experiences.

Links

Comments

  • 1
    Zainab Bawa (@zainabbawa) Reviewer 6 months ago

    We have had SVG talks at Meta Refresh earlier. This talk is very introductory and hence, not interesting for Meta Refresh.

Login with Twitter or Google to leave a comment