Favicon-Prüfer
Prüfe, welche Favicons eine Website deklariert und wie sie rendern
100 % kostenlos. Dieses Tool braucht unseren Server für die Arbeit. Was du sendest, wird dort verarbeitet und danach verworfen – nie gespeichert.
Über dieses Tool
Prüfe, welche(s) Favicon(s) eine Website deklariert hat - das kleine Icon in Browser-Tabs, Lesezeichen und Suchergebnissen - und zeigt, wie sie in verschiedenen Kontexten wirklich rendern. Nützlich, um zu verifizieren, dass dein Favicon-Setup vollständig ist und überall korrekt angezeigt wird, wo es sollte.
So verwendest du dieses Tool
- Website-URL eingebenHole deklarierte Favicon-Links und Icon-Manifest-Referenzen aus dem Seiten-Head.
- Icon-Varianten prüfenPrüfe `.ico`- und PNG-Größen für Tabs, Lesezeichen und Geräte.
- Renderqualität prüfenVerifiziere Klarheit bei kleinen Größen, wo unscharfe Icons meist scheitern.
- Icon-Set fixen und neu ausrollenErzeuge fehlende Größen neu und aktualisiere Head-Tags nach Bedarf.
Warum Google eine Weltkugel statt deines Favicons zeigt
Google zeigt ein Favicon in den Suchergebnissen nur, wenn es Seite und Icon crawlen kann. Das Icon muss quadratisch und mindestens 48 × 48 Pixel groß sein, auf der Startseite mit einem link rel=icon-Tag angegeben werden und darf nicht per robots.txt gesperrt sein.
Nach der Korrektur kann es Tage bis Wochen dauern, bis Google das Icon in den Ergebnissen aktualisiert. Auch Browser speichern Favicons zwischen – prüfe deshalb in einem privaten Fenster.
Warum es nutzen
- Erkennt unvollständige Favicon-Setups, bevor Nutzer kaputtes Branding merken.
- Verbessert Markenerkennung in Tab, Lesezeichen und Share-Oberflächen.
- Hilft, geräteübergreifende Icon-Abdeckung schnell zu validieren.
- Nützlich für Post-Launch-QA und Rebrand-Verifikation.
Häufige Anwendungen
- Favicon-Setup nach einem Website-Redesign auditieren.
- Fehlende Icons auf iOS-/Android-Homescreens debuggen.
- Markenkonsistenz über Browser-Kontexte prüfen.
- Verifizieren, dass Kundenlieferungen ein volles Icon-Pack enthalten.
Tipps für bessere Ergebnisse
- Stelle sowohl `.ico` als auch mehrere PNG-Größen für Kompatibilität bereit.
- Nutze vereinfachte Icon-Marks für winziges 16x16-Rendering.
- Leere den Browser-Cache nach Favicon-Updates beim Testen.
- Nimm Apple-Touch-Icon und Manifest-Referenzen auf, wo nötig.
Fehler, die du vermeiden solltest
- Ein großes Logo hochzuladen und sich nur auf Browser-Downscaling zu verlassen.
- Den Root-`favicon.ico`-Fallback-Pfad zu vergessen.
- Detaillierte textbasierte Logos zu nutzen, die bei kleinen Größen unscharf werden.
- Icon-Dateien zu ändern, ohne die Cache-Busting-Strategie zu aktualisieren.
Häufig gestellte Fragen
Unterschiedliche Plattformen (Browser-Tabs, mobile Homescreen-Icons, Suchergebnisse) erwarten oft unterschiedliche Favicon-Größen/Formate - eine der erwarteten Varianten zu fehlen kann bedeuten, dass das Icon in diesem konkreten Kontext nicht erscheint, auch wenn dein Haupt-Favicon fein funktioniert.
Eine gängige Basis umfasst eine Standard-.ico-Datei plus verschiedene PNG-Größen für unterschiedliche Geräte und oft ein Apple-Touch-Icon für iOS-Homescreen-Lesezeichen - den Bereich der Orte abdeckend, an denen ein Favicon angezeigt werden könnte.
Ja - gib eine beliebige öffentliche URL ein, um zu sehen, welche Favicons diese Site deklariert und wie sie konfiguriert sind.
Google braucht ein von der Startseite aus crawlbares Favicon in einer quadratischen Größe, die ein Vielfaches von 48 px ist, und die Aktualisierung nach einer Änderung kann Tage bis Wochen dauern.
Ja, wenn das Icon scharf aussehen soll, wenn jemand deine Seite auf dem Home-Bildschirm eines iPhones oder iPads speichert. Ein PNG mit 180 x 180 ist die Standardgröße.
Die meisten modernen Browser unterstützen SVG-Favicons, die in jeder Größe scharf bleiben und sich sogar an den Dunkelmodus anpassen können. Behalte ein PNG oder ICO als Fallback für Browser ohne Unterstützung.