Was ist ein Favicon?
Favicons sind die kleinen, aber mächtigen Symbole, die eine große Rolle in der Benutzererfahrung einer Webseite spielen. Sie erscheinen in Browser-Tabs, Lesezeichen, Verlaufslisten und sogar auf dem Homescreen, wenn die Seite als Shortcut hinzugefügt wird.
Beispiel in den Tabs in der Browserleiste (Edge Browser Desktop)
Beispiel auf dem Smartphone in der Edge App als Vorschau-Miniaturbilder:
Warum ist das Miniaturbild so wichtig?
Ein gut gestaltetes Favicon stärkt die Markenidentität und Professionalität einer Website. Es erleichtert die Navigation und Orientierung, wenn viele Tabs geöffnet sind, und kann sogar die Suchmaschinenoptimierung (SEO) positiv beeinflussen, indem es die Sichtbarkeit und Wiedererkennung der Marke erhöht.
Favicons mögen klein sein, aber sie haben eine große Wirkung auf die Benutzererfahrung und Markenpräsenz im Internet. Sie sind ein unverzichtbares Werkzeug für Webdesigner und Markeninhaber, die ihre digitale Präsenz optimieren möchten. Also, das nächste Mal, wenn du ein Favicon siehst, denke daran, dass es mehr als nur ein kleines Bild ist – es ist ein Symbol für Identität und Wiedererkennung in der unendlichen Welt des Internets.
Favicon in Elementor einfügen
1. Öffne ausgehend vom Elementor-Bearbeitungsfenster die Website-Einstellungen
2. Öffne die Einstellungen unter den Website-Informationen
3. Füge hier dein Favicon-Bild hinzu
Format und Größe des Favicons:
Empfohlene Favicon-Abmessungen von Elementor sind 512 x 512 Pixel. Ich lade es immer als SVG-Format hoch. Du kannst aber auch ein PNG und ein JPG nehmen.
Ich empfehle einen eckigen oder runden Hintergrund mit Kontrast einzustellen. Ich habe ein dunkles Logo. Damit es immer gut sichtbar ist, auch auf dunklem Hintergrund (z.B. Darkmode-Einstellung) habe ich es auf einen weißen Kreis gelegt, damit es auf hellem und dunklem Hintergrund gut sichtbar ist.
Das musst du austesten, ob deine Farben auf hell und dunkel gut sichtbar sind. Dann geht natürlich auch ein Favicon mit transparenten Hintergrund.
Mit welchem Tool könnt ihr euer Favicon erstellen?
Für den schnellen Weg online:
Viele von meinen Kund:innen nutzen das Tool Canva:
… ansonsten fragt mich einfach als eure Webdesignerin. Ein Favicon ist schnell erstellt mit Adobe Illustrator.
Wenn ihr Hilfe benötigt, oder noch Fragen offen sind, meldet euch einfach bei mir!
Eure Chrissie