SEO for SVG – what is the best way to code SVG for SEO?

In this article we will research, discuss and action industry standards for SVG and SEO

SVG is the future

Whether designers, web developers or SEO pro’s like it or not: SVG is coming. We will start to see more and more websites with animates SVG logos. Replacing their old static and clunky .jpg or .png files. Scalable Vector Graphics (SVGs) have may advantages over the archaic .jpg or .png:

  • Scalability and Responsiveness

  • Programmability and Interactivity

  • Accessibility

  • Performance

SVG can be used to build interactive HTML5 elements, animate a logo and be used to create and display attractive, informative and powerful info graphics. The button on the home page of this website has it’s background colours animated with SVG code. A an excerpt of that code can be seen here:

Copy to Clipboard

Are SVG’s really that important for SEO?

Yes. Did you know that Google Image Search is in fact the 2nd most used search engine behind Google? Most people assume it is YouTube but it is in fact the image search function offered by Google themselves! This means that a lot of websites are missing out on SEO opportunity. SVGs can be seen by Google website crawlers and it will become more and more common to see SVG images show up in the results.

How do I SVG for SEO

Ensuring your SVG is SEO ready is absolutely crucial. It’s all very well having a nice pretty SVG sitting on the page BUT does Google know what it is for/of?