---
title: "Discussion on \"Start simple: using SVGs on web\" | Hashnode"
description: "Discussion on \"Start simple: using SVGs on web\". \"If you don't know SVG you can't call yourself a web developer, Call yourself a web enthusiast\"\n\n- Dmitry Baranovskiy (Creator of Snap.svg)\nSVG has been around for a long, long time but hasn't gained as much popularity as it deserved. Though many pro..."
url: "https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [Start simple: using SVGs on web](https://hashnode.com/post/start-simple-using-svgs-on-web?utm_source=hashnode&utm_medium=feed)

"If you don't know SVG you can't call yourself a web developer, Call yourself a web enthusiast" - Dmitry Baranovskiy (Creator of Snap.svg) SVG has been around for a long, long time but hasn't gained as much popularity as it deserved. Though many pro...

Feb 11, 2016 · hashnode.com  
Updated May 20, 2016  
Read the article

-   [#css](https://hashnode.com/tag/css)
-   [#web-design](https://hashnode.com/tag/web-design)
-   [#design](https://hashnode.com/tag/design)
-   [#svg](https://hashnode.com/tag/svg)

## Written by

[Alkshendra Maurya](https://hashnode.com/@alkshendra)

@alkshendra · Bangalore, India

  
[View profile](https://hashnode.com/@alkshendra)

Frontend Engineer | Hashnode Alumnus

Front-end developer at Hashnode. Reach out to me at alkshendra.m@gmail.com

## Responses 3

Markdown supported · ⌘↵ to post

[Lucas Bento](https://hashnode.com/@lucasbento)

[Feb 12, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56bdf127986a433ab50dc0b7)

Finally a great tutorial on start using SVG, thank you for sharing @alkshendra!

For those who don't know how to draw properly _\- like me -_, this [shared link](http://method.ac/) also by @alkshendra has a collection of tools, games and articles to help you with design.

[Alkshendra Maurya](https://hashnode.com/@alkshendra)

[Feb 13, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56bdf127986a433ab50dc0b7#reply-56beb9003ddee413591693b7)

Glad it was helpful @lukasbento! :)

[Oliver Jones](https://hashnode.com/@OllieJones)

[Feb 15, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56c24406316f8ee15e9e0f7b)

Fine article, thanks. You might also mention that SVG files can contain hyperlinks and all sorts of rollover actions. When they're loaded a page using <object> tags their DOMs integrate with the pages's DOM.

[Feb 16, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56c24406316f8ee15e9e0f7b#reply-56c2ec48316f8ee15e9e0fba)

Thanks for the feedback @OllieJones! The intention behind writing this story was to give a basic overview on how to get started with using SVGs on web. Animations and other advanced features can be a part of a _going advanced_ story maybe. :)

[Hippo](https://hashnode.com/@badrihippo)

[Feb 15, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56c19205fcaf10d65e10d55c)

I've always been wanting to do SVG, but at the last moment I get scared because I hear that some browsers won't support it and just show a blank space instead. So I end up exporting my Inkscapes to PNG and uploading 😛

This post has inspired me again, so let me ask—has the situation changed? Is SVG better supported now? With HTML5 and Canvas I'm guessing it has, but...just to make sure?

[Alkshendra Maurya](https://hashnode.com/@alkshendra)

[Feb 15, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56c19205fcaf10d65e10d55c#reply-56c19a50850906a7da47cd39)

Yup, The support is great!

As mentioned in the story, all modern browsers going till IE9 have support for SVGs. IE8 and older Android native browsers(4.0 and earlier) are a problem right now, you can use the SVG with a .png fallback as a workaround for that.

A detailed support guide can be seen here: [http://caniuse.com/#feat=svg](http://caniuse.com/#feat=svg)

[Hippo](https://hashnode.com/@badrihippo)

[Feb 16, 2016](https://hashnode.com/posts/start-simple-using-svgs-on-web/56bce86ec5074a2fb5cdc38f/comment/56c19205fcaf10d65e10d55c#reply-56c2d0a3fcaf10d65e10d651)

Oh, right. Thanks @alkshendra—I missed that section when reading it the first time 😛