Favicon,

das kleine Aushängeschild einer Webseite

Favicons gelten seit geraumer Zeit als das beliebteste Aushängeschild für eine Webseite. Die Verwendung dieser kleinen Icons sind für Webmaster bereits unabdingbar und verkörpern damit einen entsprechenden Wiedererkennungswert der jeweiligen Webseite. Sehr oft steht ein Favicon in engen Zusammenhang mit einem Webdesign oder auch dem verwendeten Logo und dient so als kleines Highlight in den Lesezeichen und Tabs eines Browsers.

Favicons werden vorzugsweise in den Größen 16x16 oder 32x32 Pixel erstellt und liegen häufig im ICO Format vor. Nahezu alle neuartigen Browser unterstützen zudem die Bildformate GIF und PNG wodurch selbst kleine animierte Favicons möglich werden. Mit unserem Favicon-Generator auf der Startseite bieten wir diese Möglichkeit in Form von animierten Favicons mit Text an.

Folgende Vorgehensweisen für das einbinden in eine Webseite und eine erfolgreiche Darstellung von Favicons sind zu beachten:

Laden Sie ihre jeweilige Datei favicon.ico in das Hauptverzeichnis ihrer Webseite hoch und beachten Sie dabei die eventuelle Groß-/Kleinschreibweise von Webservern. In der oft genutzten Standardversion für das ICO Format wird folgender Code im Headbereich der Webseite eingefügt:

HTML Code für ICO-Dateien im Hauptverzeichnis:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />



Liegt das Favicon nicht im Hauptverzeichnis oder soll beispielsweise auf jeder Unterseite ein anderes Favicon angezeigt werden, so wird dieser Code für eine externe Verlinkung empfohlen:


Folgender HTML Code für eine externe Verlinkung wird empfohlen:


<head>
...
<link rel="icon" href="http://www.deine-domain.de/ordner_name/favicon.ico" type="image/x-icon" />
...
</head>



Für die Dateitypen GIF & PNG stehen jeweils ebenfalls verschiedene Codes zur Verfügung die abgewandelt von der Standardtversion auf das jeweilige Bildformat angewandt werden und hier für ein Favicon im Hauptverzeichnis gelten und dementsprechend im Headbereich eingefügt werden:



Allgemeiner HTML Code für GIF-Dateien im Hauptverzeichnis:


<link rel="icon" type="image/gif" href="favicon.gif" />



Allgemeiner HTML Code für animierte GIF-Dateien im Hauptverzeichnis:


<link rel="icon" type="image/gif" href="favicon_ani.gif" />



Allgemeiner HTML Code für PNG-Dateien im Hauptverzeichnis:

<link rel="icon" type="image/png" href="favicon.png" />



Einbinden eines Favicon im Wordpress Blog:



Die Datei favicon.ico oder favicon_ani.gif kopiert man ins Hauptverzeichnis des Wordpress - Systems. Danach muss man die header.php im Template Verzeichnis öffnen (/wp-content/themes/euertemplate/…) und folgende zwei Zeilen, getrennt jeweils für die herkömmliche oder animierte Version im Head-Bereich hinzufügen und anschließend neu hochladen. Das Favicon sollte nun angezeigt werden.


<link rel=”shortcut icon” href=”<?php bloginfo(’url’); ?>/favicon.ico” type=”image/x-icon” />

<link rel=”icon” href=”<?php bloginfo(’url’); ?>/animated_favicon.gif” type=”image/gif” />



Mit diesen zwei Zeilen können Sie natürlich auch ein Template bei Drupal, Joomla oder Magento verändern, um Favicons einzubinden, die Sie mit unserem Favicon Generator ertellt haben. Im Grunde funktioniert der oben genannte HTML Code bei allen CMS-Systemen und Online-Shops gleich, so dass man hier wenig beachten muss.

Sollten wichtige Informationen hier fehlen oder sogar fehlerhaft sein, so kontaktieren Sie uns unverzüglich. Das Team von favinator.de wünscht viel Spaß mit ihrem neuen Favicon.