Favicon: das kleinste Detail mit der größten Reichweite

Im Browser-Tab Ihrer Website steht ein graues Weltkugel-Symbol oder ein verpixelter Fleck, und in den Google-Ergebnissen auf dem Handy sieht Ihr Eintrag neben den anderen seltsam leer aus. Das liegt fast immer am Favicon, dem kleinen Bildchen, das Browser und Suchmaschinen neben Ihrer Adresse zeigen.

Das Favicon ist das kleinste Bild Ihrer Website, und trotzdem sieht es fast jeder Besucher. Es steht im Tab, in den Lesezeichen, auf dem Startbildschirm des Handys und neben Ihrem Eintrag in der Google-Suche. Wer es einmal sauber einrichtet, hat für Jahre Ruhe. Wer es vergisst, wirkt an genau den Stellen unfertig, an denen der erste Eindruck entsteht.

Stand: Oktober 2026

Das Wichtigste in Kürze

• Das Favicon erscheint im Browser-Tab, in Lesezeichen, auf dem Handy-Startbildschirm und neben Ihrem Eintrag in den Google-Suchergebnissen.

• Google verlangt ein quadratisches Bild, dessen Seitenlänge ein Vielfaches von 48 Pixeln ist, also zum Beispiel 48 × 48 oder 96 × 96.

• Ihr vollständiges Logo taugt selten als Favicon, besser ist ein einzelnes Zeichen oder Symbol daraus mit kräftigem Kontrast.

• Für die meisten Websites genügen drei Dateien: eine ICO- oder PNG-Datei, ein Apple-Touch-Icon mit 180 × 180 Pixeln und zwei Symbole für das Web-App-Manifest.

• Ein neues Favicon erscheint in der Google-Suche nicht sofort, weil Google es erst beim nächsten Besuch der Startseite abholt.

Wo das Favicon überall auftaucht

Die meisten Inhaber denken beim Favicon an den Browser-Tab am Computer. Das ist die harmloseste Stelle. Wichtiger sind die Orte, an denen Ihr Betrieb neben anderen steht und verglichen wird.

• Google-Suchergebnisse: Auf dem Handy und inzwischen auch am Computer steht das Favicon links neben dem Namen Ihrer Website.

• Browser-Tabs: Wer zehn Tabs offen hat, findet Ihre Seite über das Symbol, nicht über den abgeschnittenen Titel.

• Lesezeichen und Verlauf: Hier entscheidet das Symbol darüber, ob jemand Ihre Seite wiederfindet.

• Startbildschirm: Legt jemand Ihre Seite auf dem iPhone oder Android-Gerät als Verknüpfung ab, wird ein größeres Symbol daraus.

• Geteilte Links: Manche Messenger und Programme zeigen das Favicon neben der Linkvorschau.

Fehlt das Favicon, zeigen Browser ein neutrales Ersatzsymbol und Google ein graues Weltkugel-Zeichen. Das ist kein Fehler, der Besucher verjagt. Es ist aber ein kleines Signal, dass sich an dieser Website niemand um Details kümmert.

Warum Ihr Logo selten ein gutes Favicon ist

Ein Favicon im Browser-Tab ist 16 × 16 Pixel groß. Auf dieser Fläche passt kein Schriftzug, kein Slogan und keine feine Linie. Ein Logo mit Firmenname, Bildmarke und Zusatz „Meisterbetrieb seit 1987“ wird dort zu einem farbigen Brei.

Besser funktioniert ein Ausschnitt: der Anfangsbuchstabe, die Bildmarke ohne Schrift oder ein einfaches Symbol in Ihrer Hausfarbe. Wenn Sie ein Logo haben, das aus Zeichen und Schriftzug besteht, ist das Zeichen allein meist das Favicon. Haben Sie nur einen Schriftzug, nehmen Sie den ersten Buchstaben in der Logoschrift auf einer Fläche in Ihrer Hauptfarbe.

Praxistipp: Prüfen Sie den Entwurf, indem Sie ihn auf 16 Pixel verkleinern und vom Schreibtisch zurücktreten. Erkennen Sie ihn dann noch, taugt er.

Welche Dateien und Größen Sie wirklich brauchen

Im Netz kursieren Listen mit zwanzig und mehr Favicon-Größen. Die meisten davon stammen aus Zeiten, in denen jedes Gerät sein eigenes Format wollte. Heute kommen Sie mit wenigen Dateien aus, solange die Ausgangsdatei groß und sauber ist.

Die Ausgangsdatei sollte mindestens 512 × 512 Pixel groß sein oder als Vektordatei vorliegen. Daraus lassen sich alle kleineren Fassungen erzeugen. Umgekehrt geht es nicht: Ein 32-Pixel-Bild auf 180 Pixel hochzurechnen ergibt ein verschwommenes Symbol auf dem Startbildschirm.

Wie Google entscheidet, ob Ihr Favicon erscheint

Google zeigt nicht jedes Favicon an. In der offiziellen Anleitung nennt Google einige Bedingungen: Das Favicon muss auf der Startseite mit einem link-Element im Kopfbereich eingebunden sein, Google muss sowohl die Startseite als auch die Bilddatei abrufen dürfen, und das Bild muss quadratisch sein. Die Seitenlänge soll ein Vielfaches von 48 Pixeln betragen.

Dazu kommt eine inhaltliche Regel: Das Symbol soll Ihre Marke darstellen. Anstößige oder irreführende Bilder ersetzt Google durch das Standardsymbol. Wer zum Beispiel ein fremdes Logo oder ein Warnzeichen verwendet, riskiert, dass gar nichts angezeigt wird.

• Favicon auf der Startseite eingebunden, nicht nur auf Unterseiten

• Bilddatei nicht per robots.txt gesperrt

• Quadratisch, Seitenlänge 48 Pixel oder ein Vielfaches davon

• Adresse des Favicons bleibt dauerhaft gleich

Praxistipp: Wenn Sie das Favicon austauschen, behalten Sie den Dateinamen nicht zwingend bei, aber ändern Sie ihn auch nicht jede Woche. Häufige Wechsel bremsen die Übernahme in die Suchergebnisse.

So richten Sie das Favicon in zehn Minuten ein

Wenn das Symbol fertig gestaltet ist, ist der Rest Handarbeit, die selten länger als zehn Minuten dauert. Der Weg hängt davon ab, womit Ihre Website gebaut ist.

1. Erstellen Sie eine quadratische PNG-Datei mit mindestens 512 × 512 Pixeln und einfarbigem oder transparentem Hintergrund.

2. Öffnen Sie die Einstellungen Ihres Systems. In WordPress liegt das Feld unter Design, Customizer, Website-Informationen, dort heißt es „Website-Icon“. In Framer finden Sie es in den Site Settings, bei den meisten Baukästen in den allgemeinen Einstellungen.

3. Laden Sie die Datei hoch. Die gängigen Systeme erzeugen die kleineren Größen selbst.

4. Betreut eine Agentur die Seite oder ist sie selbst programmiert, werden die Dateien in den Kopfbereich der Seite eingetragen. Das ist eine Sache von wenigen Zeilen.

5. Öffnen Sie die Seite in einem privaten Browserfenster und prüfen Sie den Tab. Legen Sie die Seite auf dem Handy auf den Startbildschirm und schauen Sie, ob das Symbol scharf ist.

Browser speichern Favicons hartnäckig zwischen. Sehen Sie nach dem Hochladen noch das alte Symbol, liegt das meist an Ihrem eigenen Browser und nicht an der Website. Ein privates Fenster oder ein anderes Gerät zeigt den tatsächlichen Stand.

Was beim Hintergrund und im Dunkelmodus schiefgeht

Ein Favicon mit transparentem Hintergrund sieht in der Vorschau oft gut aus und verschwindet dann im Dunkelmodus. Ein schwarzes Zeichen ohne Fläche dahinter ist auf einem dunklen Browser-Tab nicht zu sehen. Dasselbe gilt umgekehrt für helle Zeichen auf hellem Grund.

Die einfachste Lösung ist eine eigene Fläche: ein Quadrat oder ein Kreis in Ihrer Hauptfarbe, darauf das Zeichen in Weiß. Das funktioniert auf hellen und dunklen Oberflächen gleich gut. Wer es feiner möchte, kann eine SVG-Datei mit einer eigenen Farbvariante für den Dunkelmodus anlegen. Für einen lokalen Betrieb ist das selten nötig.

Woran Sie ein gelungenes Favicon erkennen

Ein gutes Favicon besteht aus höchstens zwei Farben, hat einen klaren Umriss und erinnert an Ihr Logo, ohne es nachzubauen. Es ist nach einer Sekunde wiederzuerkennen, auch neben zwanzig anderen Tabs.

Ein schlechtes Favicon erkennen Sie daran, dass Sie selbst nicht sicher sind, was darauf zu sehen ist. Feine Linien, Verläufe, Fotos und Schrift unter einer gewissen Größe gehen auf 16 Pixeln verloren. Auch ein Favicon, das noch vom Website-Baukasten stammt, etwa das Symbol des Anbieters, fällt in diese Kategorie.

Wichtige Erkenntnisse

Was das in der Praxis heißt

Für die meisten Betriebe heißt das: einmal eine saubere quadratische Datei anlegen, im System hochladen, auf zwei Geräten prüfen. Danach muss das Favicon nur angefasst werden, wenn sich das Logo ändert. Es ist eine der wenigen Aufgaben an einer Website, die tatsächlich erledigt ist, wenn sie erledigt ist.

Was Sie nicht beeinflussen können: wann Google das neue Symbol übernimmt. Das kann Tage dauern, manchmal Wochen, je nachdem, wie oft Google Ihre Startseite besucht. Ob Google das Favicon überhaupt anzeigt, entscheidet am Ende Google selbst. Und ein schönes Favicon bringt keine einzige zusätzliche Anfrage, wenn Titel, Beschreibung und Inhalt Ihrer Seite nicht überzeugen. Es ist ein Detail, das Vertrauen stützt, kein Hebel, der Platzierungen verschiebt.

Wenn Sie es nicht selbst machen möchten

Bei den Websites, die wir bauen, gehören Favicon, Apple-Touch-Icon und Manifest zur Grundausstattung. Bei bestehenden Seiten prüfen wir das im Rahmen des Pakets Sichtbar für 150 € im Monat netto mit, zusammen mit Google-Profil, Titeln und den übrigen Kleinigkeiten, die sich sonst niemand ansieht.

Wenn Sie wissen möchten, wie Ihre Seite an diesen Stellen dasteht, sprechen Sie mit uns. Das Erstgespräch dauert fünfzehn Minuten und ist kein Verkaufsgespräch.

Nützliche Quellen

• Google Search Central: Favicon in den Suchergebnissen festlegen

• MDN Web Docs: Symbole im Web-App-Manifest

• web.dev: Web-App-Manifest hinzufügen

Häufige Fragen

Was ist ein Favicon?

Das Favicon ist das kleine Symbol, das ein Browser neben dem Namen Ihrer Website zeigt. Es erscheint im Tab, in Lesezeichen, auf dem Handy-Startbildschirm und neben Ihrem Eintrag in den Google-Suchergebnissen.

Welche Größe muss ein Favicon haben?

Für Browser-Tabs reichen 32 × 32 Pixel. Google verlangt ein quadratisches Bild mit einer Seitenlänge, die ein Vielfaches von 48 Pixeln ist. Für Startbildschirme brauchen Sie 180, 192 und 512 Pixel, deshalb sollte die Ausgangsdatei mindestens 512 × 512 Pixel groß sein.

Kann ich einfach mein Logo nehmen?

Meist nicht unverändert. Ein Logo mit Schriftzug ist auf 16 Pixeln nicht lesbar. Nehmen Sie die Bildmarke allein oder den Anfangsbuchstaben auf einer Fläche in Ihrer Hausfarbe.

Warum zeigt Google mein Favicon nicht an?

Häufige Gründe sind ein nicht quadratisches Bild, eine falsche Größe, eine Einbindung nur auf Unterseiten oder eine Sperre in der robots.txt. Außerdem übernimmt Google Änderungen erst, wenn es die Startseite wieder besucht hat. Ob das Symbol am Ende erscheint, entscheidet Google.

Wie lange dauert es, bis das neue Favicon bei Google erscheint?

Das lässt sich nicht genau sagen. Google holt das Favicon beim nächsten Besuch der Startseite ab, das kann wenige Tage oder einige Wochen dauern. Eine Beschleunigung können Sie über die Search Console anstoßen, indem Sie die Startseite erneut zur Indexierung einreichen.

Ich sehe nach dem Hochladen immer noch das alte Symbol. Was ist los?

Ihr Browser hat das alte Favicon zwischengespeichert. Öffnen Sie die Seite in einem privaten Fenster oder auf einem anderen Gerät. Dort sehen Sie, was Ihre Besucher sehen.

Brauche ich eine ICO-Datei oder reicht PNG?

Alle aktuellen Browser kommen mit PNG zurecht. Eine favicon.ico im Hauptverzeichnis schadet nicht und hilft älteren Programmen, die automatisch an dieser Stelle nachsehen. Die gängigen Website-Systeme erzeugen die passenden Formate beim Hochladen selbst.

Darf das Favicon einen transparenten Hintergrund haben?

Das ist erlaubt, aber oft unpraktisch. Im Dunkelmodus verschwindet ein dunkles Zeichen ohne Fläche dahinter. Eine eigene Farbfläche hinter dem Zeichen ist die sicherere Wahl.

Verbessert ein Favicon meine Platzierung bei Google?

Nein. Das Favicon ist kein Rankingfaktor. Es sorgt dafür, dass Ihr Eintrag vollständig und gepflegt aussieht, und kann damit beeinflussen, ob jemand darauf klickt.