Favicon erstellen – Schritt für Schritt Anleitung

Icon erstellen, Erstellung eines Favicons

Ein unverwechselbares Aussehen erhält deine Website mit einem Favicon. Dieses kleine Icon wird dir in der oberen Browserzeile angezeigt. Speicherst du dir eine wichtige Website als Favorit in deine Lesezeichen ab, sieht man ebenfalls das Bild.

für Browser ein Icon einrichten

Dieses kleine Symbol hat einen wichtigen Wiedererkennungswert, wie ich finde. Zudem empfinde ich es bei einer Website-Erstellung wichtig zu beachten, dass dieses Icon erstellt wurde und gut sichtbar in jedem Fenster eines Browsers angezeigt wird. Dazu teste ich auch während der Website-Erstellung einzelne Browser (wie Chrome, Firefox, Safari, Internet-Explorer, Bing oder den Windows 10 internen von Microsoft, „Edge“) durch, um zu sehen, wie es angezeigt wird. Alternativ falls es nicht angezeigt wird, die Website im „Facebook Debugger“ durch die Fehlerbehebung durchlaufen lassen.

Quadratisch ansprechend – Icon erstellen

Das Icon-Bild ist in der Größe von 16 x 16 Pixel klein. Um es gut sichtbar und in hoher Qualität im Browser-Tab zu platzieren, verwende ich gerne die Maße 32 x 32 Pixel und achte darauf, dass es möglichst ein Symbol ist, aus dem das Bild besteht. Also nicht allzu viele kleine Details, die so nicht sichtbar sind.

Mit dem Hilfswerkzeug von http://www.favicon-generator.org/ wird das Bild mit der Endung .jpg oder .png umgewandelt in das kleinere Format und erhält die Endung .ico.

Dieses neu erstellte Favicon lädst du im Backend von WordPress hoch. Nun liegt es am Server deines Webhosters.

Im letzten Schritt positionierst du das Favicon / Icon im Theme. Ein Theme kann man als Programmierer selbst codieren oder setzt ein bestehendes „Rahmengerüst“ farblich, textlich und grafisch an die eigenen Bedürfnisse und Logo-Vorgaben um (dabei kann ich dir gerne behilflich sein).

icon hochladen - Favicon erstellen
In WordPress integrierst du das Icon unter „Design“ -> „Seitenoptionen“ -> „Logo“ (variiert je nach gewähltem WordPress Theme).

Icon hochladen – mach deine Website in der Browseransicht schön

Meist findest du im Dashboard von WordPress unter „Design“ ► „Theme Optionen“ ► im Reiter „Logo“ die Möglichkeit, das Favicon hochzuladen. Ab dann ist es quasi im Webspace und dem von dir „angemieteten Raum im Internet“. Bitte das Speichern nicht vergessen!

Nach einem Drücken der Taste F5 bei Windows (bei Mac „cmd + R“) erscheint das Favicon im Browser-Tab.

Weitere Beiträge vertiefen das Thema „Website“:

Webseite erstellen – mit einem Vergleich von den Versionen WordPress.org gegenüber WordPress.com

Du bist in all deinen Tätigkeiten nicht allein und kannst dir Unterstützung und Hilfe holen.

 

Als Beraterin unterstütze ich Tourismusregionen, Selbstständige und Solo-Unternehmerinnen in ihrer Sichtbarkeit. In Einzelberatungen zum Blog- und Social-Media-Marketing erfahren die Teilnehmer*innen auf leicht verständliche Art, warum die Website und der Blog die Schaltzentrale und das Herzstück im Marketingmix sind. Welche Rolle die sozialen Netzwerke spielen und wie darin die Kommunikation gelingt. Seit 2012 bin ich in sozialen Netzwerken als Beraterin tätig und zertifizierte mich als Online-Marketing-Managerin. Ein weiteres Herzensprojekt ist der Radreiseblog Sonnenfernweh. Der Blog berichtet zu Radtouren aus der Metropolregion Hamburg, der Lüneburger Heide und deutschlandweit.
Beitrag erstellt 97

Verwandte Beiträge

Beginne damit, deinen Suchbegriff oben einzugeben und drücke Enter für die Suche. Drücke ESC, um abzubrechen.