6

While reading an article on the internet I read that SVG is better for SEO than other image formats. How true is that? Also, when adding an SVG image to a website should it be added as <svg> or <img>?

9

In the vast majority of use cases, SVG does not gain any special benefits over the other image formats in terms of SEO. However, SVG images are often smaller than their counterparts in other image formats, improving page load times which benefits SEO indirectly.

One thing that SVGs are not that much better at is letting search crawlers index non-image content embedded within them. While crawlers may index textual content, they do not follow links, and they cannot otherwise make sense of an SVG document's structure.

The question of whether to use <img> or <svg> is mostly equivalent to the question of whether it makes more sense to link your images externally by using <img>, or to inline them by using <svg> (you can also inline them by using <img> with a data URI, but it's not recommended as it increases file size and defeats the purpose of SVG's text-based format). 90% of the time it makes the most sense to link your website's images externally by using the <img> tag.

Also note that inlined SVG images are not eligible for inclusion into Google Image Search, only images with their own path on the server are eligible. So if you want your SVG images to show up in image search, be sure to link them externally using img tags.

There is also a third option for embedding which is to use an <object> tag, but that should be used only for SVGs that have scripting or interactive content, and is beyond the scope of this answer.

2

To expand on Maximillian's excellent answer, it's important to note the following:

The smaller size of SVG's only holds for illustrations, like logo's and other images that consist of a comparably small amount of shapes and colors. It is utterly unsuitable and consumes a rediculous amount of resources when used for photographic imagery. (Or it will simply embed the bitmap thus negating the benefits of SVG altogether).

The reason for this is the difference between vector based images and bitmap based images, witch is way too large a subject for an SE answer but well worth educating yourself about if you haven't already.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.