SVG Lessons I Learned The Hard Way

Even though SVG is not difficult to learn if you come from an HTML-CSS-y background, working with SVG is not as straightforward as working with HTML because they are fundamentally different in many aspects.

We tend to work with SVG and expect it to behave similar to the way HTML does, or maybe expect the tools, properties, functions, etc. that we use to work with SVG just like they would work with HTML. But, unfortunately, our expectations are not always met, and we are stuck trying to figure out what went wrong and why what we expected to work simply didn't. Why isn't the element translated as I expect it to? Why are those coordinates wrong? Why aren't my styles applied? why isn't the script working?

Sara has had a lot of these moments while working with SVG, got a few headaches in the process, and learned a few lessons. In this talk, she wants to share some lessons with you that I have learned from working with SVG for some time, hopefully saving you some of those moments in the future.