Favicon erstellen – Schritt für Schritt Anleitung

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 Masse 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.

 

Favicon erstellen – Schritt für Schritt Anleitung
Markiert in:                 

Kerstin Paar

Als Online-Marketing-Beraterin unterstützt Kerstin Paar Solo-Unternehmerinnen und Selbständige in ihren Marketingtätigkeit und im Netz mit eigener Website sichtbar zu sein. Über Einzelcoachings oder E-Mail-Services zeigt sie auf leicht verständliche, kompetente und sympathische Art die Vorzüge der Sozialen Medien und den wirkungsvollen Einsatz einer eigenen Website auf. Eine performante Website ist das Herzstück im Marketing. Ein Herzensprojekt der Online-Marketing-Fachfrau mit Reiselust ist das Bloggen auf ihrem Reiseblog "Sonnenfernweh". Als Reisebloggerin schreibt sie Reiseberichte, inspiriert von ihren Unternehmungen mit dem E-Bike und für Tourismusregionen. Im Mai 2018 war sie damit quer durch Deutschland unterwegs. Seit 2011 ist Kerstin Paar in sozialen Netzwerken als Beraterin tätig. Mit anschließender Zertifizierung zur Online-Marketing-Managerin unterstützte sie Unternehmen der Energiewirtschaft, Coaches, Autoren und Selbständige. Mit Lust und Freude an ihrer Arbeit schätzt sie die Einzelberatungen und den Teamgeist in Kleingruppen.