Favicons erstellen

Favicons sind die kleinen Bildchen, die im Browser neben der Webseitenadresse erscheinen. Hier einige Beispiele: favicon28ca492e0-d794-4954-8792-23b9e3afd227-165a2074db-8618-4aca-b605-82af8b0eee87-160b6ae3f4-2712-42c0-947e-9f257a44ed56-1648bb61a7-7737-4526-96a5-a0c856256893-16

Stellt man eine Bilddatei favicon.ico auf den Webserver, wird sie automatisch vom Browser des Betrachters übernommen.Man kann aber auch festlegen, welche Datei verwendet wird, indem man der Webseite im Quelltext im <head>-Bereich folgende Zeilen hinzufügt:

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

https://beispiel.de/favicon.ico kann dabei auch jeder andere Pfad zur entsprechenden Datei sein. Man ist auch nicht mehr zwingend an den Dateityp .ico gebunden. Moderne Browser können auch .gif-Dateien oder .png-Dateien verarbeiten. Dazu wird wie in den oberen Beispielen der Typ der Datei gesetzt

  • für ICO: „image/x-icon“ oder „image/vnd.microsoft.icon“
  • für GIF: „image/gif“
  • für PNG: „image/png“

Außerdem müssen die Größe und Farbtiefe stimmen:

  • für ICO: 16×16 oder 32×32 und 16 bis 16 Millionen Farben.
  • für GIF: 16×16 und 256 Farben
  • für PNG: 16×16 und 256 Farben

Wie erstellt man nun eine .ico-Datei?

Das professionelle Grafikprogramm Photoshop bietet zum Beispiel keine Möglichkeit, Dateien mit der Endung .ico zu schreiben. Natürlich gibt es hier Möglichkeiten. Einfacher geht es aber mit der Webseite Favicon Generator, die kostenlos aus Bildern, die man hochladen kann, Favicons macht. Auch Favicons von Hand zu malen ist möglich.

Kommentare sind geschlossen.