Favicon und .ico Dateien

Erstellen

Webtools

http://realfavicongenerator.net/ macht auch andere Icons. Sieht gut aus.

Photoshop Plugin

http://www.telegraphics.com.au/sw/

http://wiki.zone30.info/wikizone/images/8/87/ICO_Photoshop_Plugin.zip

Mit Terminal und ImageMagick

https://github.com/sparanoid/automator-workflows#create-faviconico

Formate für Favicon und Touch Icons

W3C: 16x16 oder 32 x 32 Heute wird z.T. mehr eingesetzt (2017) z.B. Wikipedia 48x48

Für ICO: image/vnd.microsoft.icon (weit verbreitete falsche Angabe: image/x-icon[2])
Für GIF: image/gif
Für PNG: image/png

Beispiel:

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="theme-color" content="#ffffff">