Your favicon serves as the centerpiece of your logo, encapsulating the essence of your business and its purpose. This small icon is closely linked to your website and appears wherever your site needs to be visually identified. In our advertising interface, we display it in various locations. Icons are especially effective when they enhance visual appeal and attract the user's attention. They also help our users navigate through publishers, providing guidance and direction along the way.
An extra short explanation:
Source reference: https://evilmartians.com/
It's this simple. Add five icons and one JSON file.
For the browser using HTML:
<link rel="icon" href="/favicon.ico" sizes="any"><!-- 32×32 -->
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- 180×180 -->
<link rel="manifest" href="/manifest.webmanifest">And in your web app manifest:
// manifest.webmanifest
{
"icons": [
{ "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
{ "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
]
}Need more explanation to setup? Go to this blog on the Evilmartians.com website.