Erstgespräch →
Allgemein

Favicon

Ein Favicon ist das kleine Website-Symbol, das Browser, Lesezeichen und Suchoberflächen neben einer Seite oder Domain anzeigen.

Das Favicon ersetzt kein Logo, stärkt aber Wiedererkennung und Orientierung an vielen kleinen, häufig gesehenen Kontaktpunkten.

★Das Wichtigste in Kürze
  • ✓Favicon bedeutet Favorite Icon.
  • ✓Es erscheint unter anderem in Tabs, Lesezeichen und mobilen Oberflächen.
  • ✓Quadratische, einfache Motive funktionieren in kleinen Größen am besten.
  • ✓Mehrere Dateiformate und Größen erhöhen die Kompatibilität.
  • ✓Ein korrektes Favicon unterstützt Marke und Bedienbarkeit, ist aber kein Rankinghebel.

Was ist Favicon?

Das Favicon ist eine kompakte grafische Kennzeichnung einer Website. Es wird meist über HTML-Metadaten oder eine Datei im Webroot eingebunden und kann je nach Gerät und Oberfläche unterschiedlich skaliert oder zugeschnitten werden.

Wie funktioniert Favicon?

Der Browser liest einen Link-Verweis im Kopfbereich der HTML-Seite oder sucht nach einer Standarddatei. Das Symbol wird zwischengespeichert und bei Tabs, Verlaufseinträgen oder gespeicherten Verknüpfungen dargestellt.

Favicon in der Praxis

Ein detailreiches Logo wird in 16 mal 16 Pixeln unlesbar. Erfolgreiche Favicons reduzieren die Marke auf ein klares Zeichen mit ausreichend Kontrast und testen helle wie dunkle Browseroberflächen.

💡
Cache berücksichtigen

Nach einem Austausch kann das alte Symbol länger sichtbar bleiben, weil Browser und Suchdienste Favicons zwischenspeichern. Eine technisch korrekte Einbindung ist wichtiger als häufiges erneutes Hochladen.

Favicon sinnvoll optimieren

Empfohlener Ablauf

  1. 1
    Motiv vereinfachen

    Ein prägnantes Zeichen wird ohne feine Schrift und unnötige Details entwickelt.

  2. 2
    Quadratisch anlegen

    Das Motiv erhält sicheren Abstand zu den Rändern und funktioniert bei kleinen Größen.

  3. 3
    Formate bereitstellen

    Mindestens ein verbreitetes Browserformat und passende größere Icons werden eingebunden.

  4. 4
    HTML prüfen

    Link-Elemente, Pfade, MIME-Typen und erreichbare Dateien werden kontrolliert.

  5. 5
    Auf Geräten testen

    Tabs, Lesezeichen, Mobilgeräte sowie helle und dunkle Oberflächen werden geprüft.

Ein Favicon technisch korrekt einrichten

Ein Favicon ist das kleine Markensymbol, das unter anderem in Browser-Tabs, Lesezeichen und teilweise in Suchergebnissen erscheint. Es erleichtert die Wiedererkennung einer Website, besonders wenn mehrere Tabs geöffnet sind. Das Motiv sollte auch in sehr kleiner Darstellung klar erkennbar sein, weshalb einfache Formen und starke Kontraste meist besser funktionieren als detailreiche Logos oder lange Schriftzüge.

Für eine saubere Einbindung sollten gängige Größen und Formate bereitgestellt und im HTML beziehungsweise über das CMS korrekt referenziert werden. Moderne Browser unterstützen unter anderem PNG, SVG und klassische ICO-Dateien; zusätzliche Varianten können für Apple-Geräte oder Web-Apps sinnvoll sein. Nach einem Austausch kann das alte Symbol wegen Browser- oder Suchmaschinen-Caches noch eine Zeit lang sichtbar bleiben.

Häufig gestellte Fragen

Häufige Fragen

Welche Größe sollte ein Favicon haben?+

Mehrere quadratische Größen sind sinnvoll; klassische Browserdarstellungen beginnen oft bei 16 mal 16 Pixeln.

Welches Format ist am besten?+

PNG oder ICO bieten breite Kompatibilität; SVG kann ergänzend genutzt werden.

Warum wird mein neues Favicon nicht angezeigt?+

Häufig wegen Cache, falschem Pfad, nicht erreichbarer Datei oder verzögerter Aktualisierung.

Ist ein Favicon wichtig für SEO?+

Es ist vor allem für Marke und Nutzerorientierung wichtig, nicht als direkter Rankingfaktor.

Kann ich mein vollständiges Logo verwenden?+

Ja, wenn es auch sehr klein klar erkennbar bleibt; meist funktioniert ein vereinfachtes Signet besser.

← Zurück zum Glossar