Anleitung

Favicon wird nicht angezeigt – Anleitung zur Fehlerbehebung

Sie haben ein Favicon hochgeladen, aber auf der Registerkarte wird immer noch ein allgemeiner Globus oder ein altes Logo angezeigt. In diesem Leitfaden werden die häufigsten Ursachen – Caching, falsche Pfade, fehlende Dateien und widersprüchliche <link>-Tags – in der Reihenfolge erläutert, in der Sie sie überprüfen sollten.

Browser speichern Favoriten aggressiver als fast jedes andere Asset. Eine Hard-Refresh (Strg+Umschalt+R oder Befehl+Umschalt+R) behebt viele Fehlalarme. Wenn dies fehlschlägt, hängen Sie einmal eine Versionsabfragezeichenfolge an: /favicon.ico?v=2.

Bestätigen Sie, dass die Datei unter der vom Browser angeforderten URL vorhanden ist. Öffnen Sie /favicon.ico direkt in einem neuen Tab. Ein 404 bedeutet, dass die Datei nicht dort bereitgestellt wird, wo Sie sie vermuten – häufig bei SPA-Builds, die nur index.html bedienen.

Überprüfen Sie Ihre <link rel="icon"> href-Pfade. Absolute Pfade (/favicon.ico) funktionieren auf jeder Seite; Relative Pfade (favicon.ico) brechen auf verschachtelten Routen wie /blog/post.

Wenn Sie ein CDN verwenden, bereinigen Sie die Favicon-Pfade nach der Bereitstellung. Einige CDNs speichern 404-Antworten für /favicon.ico im Cache, wenn die Datei bei der ersten Anfrage fehlte.

Mehrere <link rel="icon">-Tags können ältere Browser verwirren. Geben Sie zuerst favicon.ico ein, dann PNG/SVG-Varianten mit expliziten Typ- und Größenattributen.

WordPress, Shopify und statische Hosts fügen jeweils ihre eigenen Tags ein. Sehen Sie sich die Seitenquelle an und suchen Sie nach rel="icon" – doppelte oder überschriebene Tags sind eine häufige Ursache.

HTTPS-Warnungen zu gemischten Inhalten blockieren HTTP-Favicon-URLs auf sicheren Seiten. Stellen Sie jedes Symbol über HTTPS bereit.

Bei der lokalen Entwicklung verweigern einige Browser die Aktualisierung von Favicons, bis Sie die Site-Daten für localhost löschen.

So funktioniert es

  1. 1

    Überprüfen Sie die Datei-URL

    Öffnen Sie /favicon.ico in einem neuen Tab – erwarten Sie 200, nicht 404.

  2. 2

    Überprüfen Sie die <head>-Tags

    Quelle ansehen; Bestätigen Sie einen kanonischen favicon.ico-Link und keine Tippfehler.

  3. 3

    Cache einmal löschen

    Fügen Sie ?v=2 zum href hinzu, stellen Sie es bereit, aktualisieren Sie es hart und entfernen Sie dann die Abfrage, falls gewünscht.

Jetzt ausprobieren

Testen Sie Ihr Live-Favicon

Live-Favicon-Tester

FAQ

Warum funktioniert mein Favicon lokal, aber nicht in der Produktion?+

Produktions-Builds werden häufig in ein Unterverzeichnis oder ein CDN-Präfix ausgegeben. Stellen Sie sicher, dass der bereitgestellte Pfad mit Ihrem <link> href übereinstimmt und dass die Datei in der Build-Ausgabe enthalten ist.

Wie lange dauert es, bis Google mein Favicon in den Suchergebnissen aktualisiert?+

Nach dem erneuten Crawlen kann es bei Google Tage bis Wochen dauern. Stellen Sie sicher, dass das Symbol mindestens 48 x 48 groß, quadratisch und unter einer stabilen URL öffentlich zugänglich ist.

Versteckt der Adblocker- oder Datenschutzmodus Favicons?+

Selten für Erstanbieter-Icons. Favicon-Proxys von Drittanbietern können blockiert werden; Selbst gehostete Symbole auf Ihrer Domain sind davon nicht betroffen.

Soll ich den Browser-Favicon-Cache löschen?+

Löschen Sie die Site-Daten für Ihre Domain in den Browsereinstellungen oder testen Sie sie in einem privaten Fenster mit deaktiviertem Cache.

Verwandte Tools

Verwandte Tutorials

Tutorials

Weitere Anleitungen

Anleitungen

FetchFavicon entdecken

Kategorien

Konverter

Hilfsprogramme

Leitfäden

Anleitungen