SVG For older browser's

[horace1]

Hi,

Is there a way to allow older browsers to view SVG images, Some sort of fallback method?

[Victor Font]

You could reference a PNG or JPG from your src attribute and use a srcset attribute to reference the SVG. Only supporting browsers will load the SVG — older browsers will load the PNG instead:

<img src="equilateral.png" alt="triangle with equal sides" srcset="equilateral.svg">

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[horace1]

Thanks so much, is there one which you could use from a background image as it was more for the logo i was trying to make a svg and then make a png in in the fallback.

[Victor Font]

It depends in the image's subject. Try them both and then pick the one that looks the best at scale.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[horace1]

Thanks,

I found a fallback from Bill Erickson

SVG Logo with PNG Fallback

but I just ended up putting it like this

background: url(images/logo.png) no-repeat;
background-image: url(images/logo.svg), none;

[Author]

Posts