Was ist ein Favicon?

Die Ursprünge des Favicons

Das Favicon wurde ursprünglich 1995 von Microsoft als Teil der ersten Version des Internet Explorers eingeführt. Das damals als ‚Favoriten-Icon‘ bezeichnete, war eine kleine 16×16 Pixel große Bilddatei, die neben dem Titel einer Website in der Lesezeichenliste des Browsers angezeigt wurde. Seit seiner ersten Einführung ist das Favicon zu einem unschätzbaren Vermögen für die Wiedererkennung und Markenbildung von Websites geworden.

Wo Favicons Erscheinen

Favicons sind wichtig, weil sie visuelle Wiedererkennung und Branding für Webseiten bieten. Favicons erscheinen am häufigsten im Browser-Tab, in der Adressleiste der Website, bei Lesezeichen und auf mobilen Geräten. Sie können auch in Suchmaschinenergebnissen auftauchen und helfen dabei, eine Webseite von der Konkurrenz abzuheben.

Wie man ein Favicon erstellt

Ein Favicon Mit Einem Online-Generator Erstellen

Die Verwendung eines Online-Favicon-Generators ist der einfachste Weg, ein Favicon zu erstellen. Du musst nur dein Bild hochladen, und es werden die richtigen Dateien für dich erstellt. Dies ist wahrscheinlich die schnellste Methode, ein Favicon zu erstellen.

Ein Favicon mit HTML & CSS Code Erstellen

Wenn Du Dich beim Programmieren mit HTML und CSS wohlfühlst, könnte dies eine Option für Dich sein. Du kannst ein Favicon erstellen, indem Du Code wie <link rel=”shortcut icon” type=”image/x-icon” href=”myfavicon.ico”> verwendest und die richtigen Größen von PNG-Bildern zu Deinen Webseitendateien hinzufügst.

Ein Favicon von Grund auf erstellen

Der schwierigste, aber auch belohnendste Weg, ein Favicon zu erstellen, ist es von Grund auf neu zu gestalten. Die beliebtesten Programme für das Design sind Photoshop oder Illustrator. Wenn Du eines von Grund auf neu erstellst, stelle sicher, dass es in verschiedenen Größen und Auflösungen gut aussieht, damit es auf allen Geräten korrekt angezeigt wird.

Favicon-Dateiformate

Beim Erstellen eines Favicons ist der erste Schritt, das Dateiformat zu entscheiden. Die gängigsten und am weitesten verbreiteten Dateiformate sind .png, .gif und .ico. Jedes dieser Formate hat seine eigenen einzigartigen Vorteile und Nachteile.

PNG-Favicons

PNG-Dateien eignen sich hervorragend zur Erstellung von Favicons, die hochwertige Bilder mit einem transparenten Hintergrund aufweisen. Sie unterstützen auch eine Farbtiefe von 8 Bit, die interessante Effekte in deinem Icon-Design ermöglichen kann. Allerdings sind PNG-Dateien oft größer als andere Formate und können daher länger zum Laden auf Webseiten benötigen.

GIF-Favicons

GIF-Dateien sind eine großartige Wahl, wenn Du ein leicht komprimierbares Bild suchst, das auch in kleinen Größen gut aussieht. GIFs haben außerdem den Vorteil, dass sie animiert werden können, was Dir ermöglicht, dynamische Favicons zu erstellen, die die Aufmerksamkeit der Besucher auf sich ziehen, wenn sie Deine Website besuchen.

ICO-Favicons

Das ICO-Format wird hauptsächlich für Windows-Anwendungen verwendet, kann aber auch zur Erstellung von Favicons für Webseiten genutzt werden. Sie bieten in der Regel eine bessere Kompression als PNG- oder GIF-Dateien und sind am besten geeignet, wenn Du mehrere Größen eines Bildes aus einer Quelle erzeugen möchtest (häufig als „Skalierung“ bezeichnet).

Favicon-Größen

Die Größe deines Favicons variiert je nach Gerät und Bildschärfe. Für Smartphones solltest du ein quadratisches Bild erstellen, das mindestens 144 x 144 Pixel hat; für Tablets ist eine Größe von 192 x 192 Pixeln gut geeignet.

Du solltest auch hochauflösende Displays wie Retina-Displays in Betracht ziehen, bei denen ein größeres Bild (mindestens 512 x 512) benötigt wird. Für Computer mit Desktop-Monitoren reicht normalerweise ein Bild mit 16×16 oder 32×32 Pixeln aus.