Favicon und .ico Dateien: Unterschied zwischen den Versionen
Aus Wikizone
Steff (Diskussion | Beiträge) |
|||
| Zeile 1: | Zeile 1: | ||
| − | + | == Erstellen == | |
| + | === Webtools === | ||
| + | http://realfavicongenerator.net/ macht auch andere Icons. Sieht gut aus. | ||
| + | === Photoshop Plugin === | ||
http://www.telegraphics.com.au/sw/ | http://www.telegraphics.com.au/sw/ | ||
http://wiki.zone30.info/wikizone/images/8/87/ICO_Photoshop_Plugin.zip | http://wiki.zone30.info/wikizone/images/8/87/ICO_Photoshop_Plugin.zip | ||
| − | + | === Mit Terminal und ImageMagick === | |
https://github.com/sparanoid/automator-workflows#create-faviconico | 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"> | ||
Aktuelle Version vom 19. Januar 2017, 10:45 Uhr
Erstellen[Bearbeiten]
Webtools[Bearbeiten]
http://realfavicongenerator.net/ macht auch andere Icons. Sieht gut aus.
Photoshop Plugin[Bearbeiten]
http://www.telegraphics.com.au/sw/
http://wiki.zone30.info/wikizone/images/8/87/ICO_Photoshop_Plugin.zip
Mit Terminal und ImageMagick[Bearbeiten]
https://github.com/sparanoid/automator-workflows#create-faviconico
Formate für Favicon und Touch Icons[Bearbeiten]
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">
