In der digitalen Welt ist es unerlässlich, dass Unternehmen sich von der Masse abheben. Ein kleines, aber entscheidendes Detail, das oft übersehen wird, ist das Favicon. Dieses kleine Icon ist in jedem Browser zu sehen und kann einen großen Unterschied in der Wahrnehmung Ihrer Marke machen.

→ So veröffentlichen Sie eine WordPress-Website [Leitfaden und Checkliste]

So sieht beispielsweise das HubSpot Favicon aus:

Screenshot eines Browser-Taps mit HubSpot Favicon

Quelle: Screenshot HubSpot

WordPress Favicon erstellen

Die Erstellung eines Favicons für die Verwendung mit WordPress kann auf verschiedene Weisen erfolgen:

  1. Motiv wählen: Wählen Sie ein Bild, das Ihre Marke repräsentiert. Dies kann Ihr Unternehmenslogo oder ein anderes repräsentatives Bild sein. Die Datei sollte im JPG- oder ICO-Format gespeichert werden, wobei ICO das gängigste Format für Favicons ist.
  2. Erstellen des Favicons mit einem Online-Tool: Es gibt viele Online-Tools wie RealFaviconGenerator, mit denen Sie ein Favicon passend zur Größe für WordPress erstellen können. Im RealFaviconGenerator könnte das so aussehen:

    Favicon erstellen: Screenshot des RealFaviconGenerator

    Quelle: Screenshot RealFaviconGenerator

  3. Code referenzieren: Nachdem Sie Ihr Favicon erstellt haben, müssen Sie den Code, der Ihnen dort angezeigt wird, in Ihre Website einfügen, um es korrekt anzuzeigen.

Screenshot Favicon Generator Optionen

Quelle: Screenshot RealFaviconGenerator

WordPress Favicon einfügen: So geht's

Es gibt verschiedene Möglichkeiten zum Einbinden des Favicons in WordPress, je nachdem, wie fortgeschritten Sie in der Bedienung der Programme sind.

Favicon einfügen mittels WordPress-Theme

  1. Viele WordPress-Themes bieten die Möglichkeit, ein WordPress Favicon direkt über den Customizer einzustellen. Dies ist häufig die einfachste Möglichkeit, ein Favicon hinzuzufügen.

    Screenshot mit Schritten, wie man das Favicon zu WordPress hinzufügt

  2. Von dem Customizer navigieren Sie sich zur Page „Identität der Website“.

    wordpress-favicon-05

  3. Unter „Symbol der Website“ können Sie jetzt ein neues Icon zum Einbinden auswählen: Ihr neues Favicon.

Favicon einfügen via WordPress-Plugin

Es gibt zahlreiche kostenfreie Plugins, wie beispielsweise das Favicon Plugin von RealFaviconGenerators, mit denen Sie Ihr Favicon einfach und ohne Coding-Kenntnisse einfügen können.

Installieren Sie zunächst das Plugin.

Screenshot aus dem Plug-in-Bereich im Backend

Wechseln Sie danach in den „Design“-Tab von Ihrem Dashboard aus. Dort wählen Sie das gewünschte Bild aus Ihrer Bibliothek, indem Sie auf den Button ganz rechts klicken. Wählen Sie das Bild aus, das Sie als Favicon einrichten möchten und das Programm lädt es hoch.

Favicon einfügen per FTP-Programm

Einfügen per FTP-Programm: Für fortgeschrittene Nutzende besteht die Möglichkeit, das Favicon direkt über ein FTP-Programm in den Dateiordner ihrer Website hochzuladen. Falls Sie es lieber eigenhändig machen möchten, können Sie ein Favicon zu Ihrer WordPress-Seite entweder über das File Transfer Protocol (FTP) oder den Datei-Manager hinzufügen.

Favicon manuell einfügen

Um ein Favicon in WordPress manuell hinzuzufügen, gehen Sie wie folgt vor:

  1. Öffnen Sie das Hauptverzeichnis Ihrer Website und laden Sie den Inhalt Ihres Favicon-Pakets (z. B. favicons.zip) dort hoch.
  2. Anschließend verwenden Sie den von RealFaviconGenerator bereitgestellten Code.
  3. Nun müssen Sie den Code im Header-Bereich Ihres Themes einbinden. Hier haben Sie zwei Möglichkeiten. Entweder Sie fügen den Code direkt in den <head>-Bereich Ihres Themes ein oder Sie binden den Code mithilfe eines Plugins, wie z. B. „Insert Headers and Footers“, ein.

WordPress Favicon ändern

Wenn Sie bereits ein Favicon haben, aber ein neues Design wünschen oder es aktualisieren möchten, gehen Sie gleich vor wie beim Einrichten eines Favicons.

  1. Gehen Sie auf Design und dann in den „Design-Customizer“.
  2. Klicken Sie anschließend auf „Website-Information“: Hier finden Sie die Option, Ihr Favicon mit dem Button „Bild wechseln“ und tauschen Sie ganz einfach das aktuelle Favicon mit dem neuen aus.

    Screenshot des Bereichs Website-Informationen

    Quelle: Screenshot Sven Hörig

  3. Wählen Sie die Datei aus Ihrer Bibliothek aus, die Sie nutzen möchten und laden Sie diese hoch.

WordPress Favicon wird nicht angezeigt: Was tun?

Es kann vorkommen, dass Ihr Favicon nicht sofort angezeigt wird. Hier sind einige Lösungsvorschläge:

  • Cache leeren: Oftmals wird das Favicon aufgrund von gespeicherten Cache-Daten nicht angezeigt. Leeren Sie den Cache Ihres Browsers und Ihrer Website.
  • Überprüfen Sie den Code: Stellen Sie sicher, dass der Code für das Favicon korrekt in Ihre Website eingefügt wurde.
  • Verwenden Sie ein anderes Format: Manchmal kann das Problem durch das Verwenden eines anderen Bildformats gelöst werden.

Die Vorteile eines WordPress Favicons

Ein professionell gestaltetes Favicon bringt zahlreiche Vorteile mit sich:

  • Marke stärken: Ein einzigartiges Favicon verleiht Ihrer Webseite einen professionellen Touch und stärkt Ihre Marke. Das Icon dient als visuelles Aushängeschild und vermittelt den Besuchenden sofort einen Eindruck von Ihrer Unternehmensidentität.
  • Wiedererkennungswert steigern: In der heutigen Zeit, in der Nutzende oft dutzende Tabs gleichzeitig im Browser geöffnet haben, ist es von unschätzbarem Wert, mittels eines Icons sofort erkannt zu werden. Ein gut gestaltetes Favicon sorgt dafür, dass Ihre Webseite schnell wahrgenommen wird, selbst wenn viele Tabs geöffnet sind. Es erleichtert den Nutzenden die Navigation und das schnelle Wiederfinden Ihrer Webseite.
  • Webauftritt professioneller gestalten: Ein Favicon zeigt, dass Sie Wert auf Details legen. Es ist oft das Erste, was Besuchende auf Ihrer Seite bemerken, und es kann den Unterschied ausmachen, ob jemand Ihre Seite als professionell und vertrauenswürdig wahrnimmt oder nicht. Ein durchdachtes Favicon kann das Vertrauen der Kundschaft in Ihre Webseite und Ihr Angebot erhöhen.
  • Branding: Ein konsistentes Favicon über alle Ihre Webseiten und Anwendungen hinweg stärkt Ihr Branding und fördert die Markenbindung. Das Icon sorgt für Einheitlichkeit in Ihrem digitalen Auftritt und hilft, eine kohärente Markenbotschaft zu vermitteln. Ein Favicon, das mit Ihrem Logo und Ihrer Markenfarbpalette übereinstimmt, kann dazu beitragen, dass Ihre Marke in den Köpfen der Nutzenden präsent bleibt.
  • SEO-Vorteile: Ein Favicon kann auch positive Auswirkungen auf Ihre Suchmaschinenoptimierung (SEO) haben. Suchmaschinen wie Google berücksichtigen die Benutzererfahrung als Ranking-Faktor. Ein Favicon kann dazu beitragen, die Klickrate (CTR) aus den Suchergebnissen zu erhöhen, da es die Sichtbarkeit und Erkennbarkeit Ihrer Webseite in den Suchergebnissen verbessert.
  • Reduzierte Absprungrate: Ein ansprechendes Favicon kann dazu beitragen, die Absprungrate zu reduzieren. Wenn Besuchende Ihre Webseite als professionell und vertrauenswürdig wahrnehmen, sind sie eher geneigt, länger zu bleiben und sich weiter umzusehen.

Fazit: Ein WordPress Favicon sollte nicht unterschätzt werden

Ein WordPress Favicon mag klein erscheinen, aber es hat einen großen Einfluss auf die Wahrnehmung Ihrer Marke. Es stärkt Ihr Branding, erhöht den Wiedererkennungswert und macht Ihren Webauftritt professioneller. Nehmen Sie sich die Zeit, ein ansprechendes Favicon zu erstellen und es korrekt in Ihre Webseite einzubinden. Es wird sich lohnen.

→ So veröffentlichen Sie eine WordPress-Website [Leitfaden und Checkliste]

 → So veröffentlichen Sie eine WordPress-Website [Leitfaden und Checkliste]

Titelbild: Filmstax / iStock / Getty Images Plus

Ursprünglich veröffentlicht am Dec 13, 2023 2:00:00 AM, aktualisiert am Dezember 13 2023

Themen:

Wordpress