SVG favicon should get png-ified in the faviconMetaTags field

Hi! I uploaded a SVG favicon to the site settings, but when I get it through the _site.faviconMetaTags query, the tags refer to resized SVG URLs.

This has problems:

  1. “Resizing” an SVG doesn’t make any sense (and indeed the returned SVG is the exact same). Having different URLs limits caching without any benefit.
  2. SVG icons are not that well supported (SVG favicons | Can I use... Support tables for HTML5, CSS3, etc). Crucially, Safari doesn’t support it. These browsers will not show a favicon then.
  3. apple-touch-icon are outright not supported at all if they’re not PNGs (Configuring Web Applications)
  4. I haven’t tried msApplication icons, but I wouldn’t be surprised if they’re also not supported

How could it be solved?

  1. Convert the SVGs to PNGs when serving them.
  2. Return the favicon tags with different sizes pointing to these PNGs, and then add a single tag pointing to SVG for browsers that support it.
  3. (Extra) Could a tag be added pointing to an .ICO file?

Thanks!

Also facing the same problem.

Working on it! :smiley: I’ll update you soon!

done! SVG images on faviconMetaTags and _seoMetaTags are now converted with auto=format to the most suitable, rasterized version of the image!

2 Likes