Favicon Tool - Anleitung

Favicon Tool - Anleitung

Mit dem Favicon Tool erzeugst du aus einem Bild (oder einem KI-generierten Bild) alle relevanten Favicon-Dateien für deine Website.

Wege zur Generierung

Im Tool gibt es zwei Varianten:

  1. Upload-Flow: Eigenes Bild hochladen und Favicons generieren
  2. KI-Flow: Bild per Prompt oder URL erzeugen und daraus Favicons erstellen

Voraussetzungen

  • Empfohlenes Ausgangsbild: quadratisch, klar erkennbares Motiv
  • Sinnvolle Mindestgröße: 512×512 Pixel (besser höher)
💡 Tipp: Ein einfaches Logo ohne viele Details wirkt in kleinen Größen deutlich besser.

Option A: Upload-Flow

  1. Öffne Favicon Tool
  2. Wähle bei Bild hochladen dein Logo
  3. Klicke auf Favicons generieren
  4. Lade anschließend das ZIP oder einzelne Dateien herunter

Option B: KI-Flow

  1. Öffne den Bereich KI-Bilderstellung rechts im Tool
  2. Gib entweder einen Prompt oder eine Crawl-URL ein
  3. Klicke auf KI-Bild generieren
  4. Prüfe die Vorschau und klicke auf Bild verwenden
  5. SEOFUXX erstellt daraus die Favicons

Aktuell erzeugte Dateien

  • favicon.ico
  • favicon-16x16.png
  • favicon-32x32.png
  • favicon-48x48.png
  • apple-touch-icon.png
  • android-icon-192x192.png
  • android-icon-256x256.png
  • android-icon-512x512.png
  • badge-72x72.png
  • maskable_icon.png
  • push-192x192.png

Einbindung im HTML

Füge mindestens diese Tags in den <head> ein:

<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

Nach der Einbindung prüfen

  1. Browser-Cache leeren
  2. Seite neu laden
  3. Tab-Icon und mobile Darstellung kontrollieren

Häufige Probleme

Favicon wird nicht aktualisiert

  • Hartes Reload (Strg+F5) durchführen
  • Inkognito testen
  • CDN/Server-Cache leeren

KI-Bild ist nicht passend

  • Prompt präziser formulieren
  • Mit anderer Crawl-URL testen
  • Neues KI-Bild erzeugen und erneut verwenden
⚠️ Hinweis: In Suchergebnissen kann es dauern, bis neue Favicons sichtbar werden.
Zurück zur Übersicht
Wiki-Version 1.05