#btconf Düsseldorf, Germany 11 - 13 May 2015

Sara Soueidan

Sara is a freelance front-end web developer from Lebanon — focusing on HTML5, SVG, CSS and Javascript. She loves taking deep dives into various topics and breaking down complex subjects into simple, easy-to-understand bits. Next to this she does a lot of teaching and writing, and writes tutorials and articles on front-end development on her blog and for various online magazines. She also tweets @SaraSoueidan on Twitter.

Want to watch this video on YouTube directly? This way, please.

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.