Workshop: Favicon selbst gemacht
Zu den Feinheiten eines Webauftritts gehört auch das Favoriten-Icon, das meist links neben der Webadresse erscheint. Bei vielen Browsern wird es auch in den Tabs sowie den Lesezeichen angezeigt. Es hat also einen hohen Wiedererkennungswert für eine Website. Fast schon schlimmer als kein “Favicon” — so der Fachbegriff aus “favourite” und “icon“– ist das falsche zu verwenden. So erscheint bei vielen Websites an dieser Stelle das Logo einer CMS-Software, eines Konfigurationstools oder des Webproviders.
Da reizt es natürlich, selbst auch ein Favicon für seine Website zu erstellen. Wie immer führen mehrere Wege zum Ziel.
Um mit einigermaßen erträglichem Arbeitsaufwand ein Favicon zu entwickeln, gibt es folgende grundsätzliche Ansätze: Man kann einfach einen (verkleinerten) Bildausschnitt von einem geeignetem Foto oder Grafik verwenden und es im Icon-Format ico speichern. Dies ist mit wenigen Mausklicks mit Irfanview möglich.
Antifavicon: Textbasierte Favicons online erstellen.
Oder man verwendet einen Online-Generator dazu. Mit dem Favicon Generator (http://www.antifavicon.com/) kann man einfache Logos mit Text und Farben zusammenklicken. Wenn man etwas Zeit mitbringt, kann man ein Symbol aber auch Punkt für Punkt zusammensetzen, wobei die Arbeitsfläche in der Regel 16 x 16 Pixel groß ist (http://www.favicon.cc/).
![]()
![]()
![]()
![]()
Mit dem relativ einfachen Tool kann man viel anfangen…
Wenn man auf dem einen oder anderen Weg sein Icon angefertigt hat, muß man es per FTP-Upload noch installieren. Meist ist der richtige Ort bereits das Wurzel-Verzeichnis. Bei Joomla könnte es auch der Ordner “templates” sein, ggf. sogar innerhalb eines Ordners. Bei Drupal bieten manche Templates direkt die Verwaltung des Favicons. Nach einer Gegenprobe im Browser sollte man sich nicht wundern, wenn sich nicht gleich etwas tut. Es muß i. d. R. zuerst der Browser-Cache gelöscht werden (oder es gibt keine Verlinkung in der HTML-Datei).
Mit dem Online-Editor kann man pixelgenau arbeiten.
Die Software Adsen Favicon konvertiert praktisch beliebige JPG-Bilder ins Icon-Format. Wie gut das gelingt hängt dabei natürlich auch vom richtigen “Input” ab. Ein komplexes Foto wird oft zur “Matschfläche” ein eher abstraktes Foto bleibt erstaunlich gut erkennbar. Hat man dagegen eine Grafik schon entsprechend aufs Icon-Dasein vorbereitet, ist der Wiedererkennungswert sehr hoch.
Adsen konvertiert ganze Bilder zu Favicons.
Bei 32 Pixel Größe sind die Bilder erstaunlich gut zu erkennen, allerdings werden sie manchmal auf 16 Pixel herunterskaliert, was dann doch zu erheblichen Veränderungen führen kann. Eventuell sollte man solche Bilder dann doch von Hand nachbearbeiten.![]()
![]()
![]()
Bei selbst programmierten statischen HTML-Seiten darf man allerdings nicht die Links auf das Favicon im <HEAD> vergessen — Plural, weil der Internet Explorer eine andere Einbindung verlangt als die anderen Browser.
