Projekt kalkulieren
Ein Favicon (kurz für „Favorite Icon“) ist ein kleines Symbol oder Logo, das in der Adresszeile des Browsers, im Tab, in Lesezeichen und teilweise auch in Suchergebnissen angezeigt wird. Es repräsentiert eine Website visuell und trägt maßgeblich zur Wiedererkennung einer Marke oder eines Unternehmens im digitalen Raum bei.
Das Favicon ist ein visuelles Branding-Element und signalisiert dem Nutzer schnell, um welche Website es sich handelt – auch wenn mehrere Tabs geöffnet sind. Es steigert die Markenidentität, sorgt für Vertrauen und verbessert das Nutzererlebnis.
Das traditionelle Format ist .ico, jedoch unterstützen moderne Browser auch:
Für maximale Kompatibilität wird oft eine Kombination aus mehreren Formaten verwendet.
Die empfohlene Standardgröße ist 16×16 Pixel, aber es gibt viele weitere Größen – z. B. für Retina-Displays, App-Symbole oder Android/iOS-Icons:
Die einfachste Methode ist die Einbindung im <head>-Bereich des HTML-Dokuments:
<link rel="icon" href="/favicon.ico" type="image/x-icon">Für eine breitere Geräte- und Browser-Unterstützung empfiehlt sich die Nutzung mehrerer <link>-Tags mit unterschiedlichen Formaten.
In WordPress kannst du ein Favicon direkt über den Customizer hinzufügen:
WordPress erzeugt automatisch verschiedene Größen und bindet die Icons sauber ein – responsiv und SEO-freundlich.
Ein Favicon ist zwar kein direkter Rankingfaktor, aber es hat Einfluss auf die Klickrate (CTR) in den Suchergebnissen – vor allem mobil. Zudem signalisiert es Professionalität und Vertrauenswürdigkeit, was sich positiv auf das Nutzerverhalten auswirken kann.
Ein Favicon ist klein, aber unverzichtbar: Es ist ein visuelles Aushängeschild deiner Website, stärkt deine Markenidentität und verbessert die User Experience. Die richtige Integration lohnt sich – für SEO, Branding und Wiedererkennbarkeit.
Rechtlich nein – aber aus UX- und Branding-Sicht unbedingt empfehlenswert. Websites ohne Favicon wirken unfertig oder unprofessionell.
Ja, du kannst jedes Grafikprogramm verwenden. Wichtig ist nur, das Bild in der richtigen Größe und dem passenden Format zu exportieren.
Mögliche Gründe: Falscher Pfad, Caching-Probleme oder fehlende Dateiformate. Prüfe deine <head>-Einbindung und leere den Browser-Cache.