Hi everybody, is there any kind of advantage (or disadvantage) in using .svg-files instead of .jpg or .png files in a webpage??
SVG’s are good because they retain sharpness at any display size. As such, a single file can be used for display on all devices, regardless of device resolution. Of course, SVG’s are a vector format so are not suitable for photographic images. Photos require a format such as JPG or PNG and would normally benefit from having multiple sizes for displaying on different devices - something that Sparkle takes care of for you.
I think the primary advantages are:
-
smaller file size - which is great when there are a lot of images, or if you use a lot of icons etc
-
vector images - high quality crispness regardless of display size
-
editable color/styling - you can usually restyle svgs in multiple ways
…along those lines… I’ve also found Lottie files to be a great version for animations. (with similar benefits)
Thanks to all for the dedicated answers.
Regards
Fernando
Just a note to add that the svg has the size and scaling qualities only if it was born as vector. There is no magic “convert to svg” tool that will make a photo lightweight by converting it to svg.
Thanks Duncan for your note.
Kind regards
Fernando