icon metadata

Declare icon metadata to link to a small image that browsers and other software such as search engines should associate with your webpage. The image, also known as favicon, should be square. It is typically displayed alongside your website title in browser bookmarks or in search results.

Example

@ icon: ->/coolracoon.svg

Mind the arrow -> before the address.

Tip

Support for different file formats varies from browser to browser. The pixel graphics formats ICO, PNG and GIF are widely supported. JPEGs are possible, but usually not the best choice for an icon which typically shows a logo.

SVG is supported by most browsers as of 2022, but not yet by all. SVGs have a big advantage though: they scale very well, so images do not become pixelated or blurred when upsized. This is particularly beneficial for favicons, because you can not control at which size a browser or other software displays it.

We recommend to link to an SVG image in the icon metadata declaration … and to save your icon in the traditional ICO format at https://your.domain/favicon.ico as well. Most browsers automatically look for an icon with this filename and use it as a fallback, if they do not recognize your SVG icon.

For developers

If icon metadata is declared, the Aneamal Translator adds a link element with an icon value for the rel attribute to the HTML output. So the example above becomes:

<link rel='icon' href='/coolracoon.svg'>