Donnerstag, 11. Januar 2007

Favicon

Wer kennt sie nicht, die kleinen Bildchen, die entweder in den Favoriten oder links oben im Tab- oder Browserfenster sitzen, und als Erkennungszeichen einer Webseite dienen? Bei google reicht z.B. ein schlichtes "G", um sofort zu sehen, auf welche Seite man zugreift, ohne dass man noch einen Buchstaben lesen müsste. Andere nutzen grafische Elemente oder Bilder, um der eigenen Seite einen höheren Wiedererkennungswert zu geben.

Auch ich habe mich entschlossen, das Standard-Blogger-Icon mit weißem "B" auf orangenem Hintergrund durch ein eigenes Icon zu ersetzen. Mit Paintshop Pro (natürlich gehen auch andere Grafikprogramme wie z.B. Photoshop, Gimp, etc.) habe ich einen quadratischen Ausschnitt meines Forumsavatars erstellt und abgespeichert.

Auf der Seite Chami.com habe ich den Favicon-Generator genutzt, um mir von meiner erstellten Vorlage ein Favicon erstellen zu lassen. Schon nach wenigen Sekunden kann man das erstellte Icon entweder erst im Browser testen oder gleich herunterladen. Ist man mit dem Ergebnis unzufrieden, verwirft man den Download und generiert mit einer anderen Vorlage ein neues Icon.

Ist der Download abgeschlossen, hat man ein Zip-File auf der Platte liegen, welches sowohl eine Datei "Favicon.ico" in der Größe 32x32 Pixel, als auch eine Datei namens preview_16x16.png" enthält.
Favicon

Die meisten (kostenlosen) Bild-Hoster unterstützen allerdings keine ico-Dateien, daher habe ich das png-File hochgeladen und verlinkt; die meisten Browser verstehen auch das mittlerweile. Wer eine eigene Domain mit Webspace besitzt, sollte natürlich die "saubere" Variante wählen, und das ico-File verlinken.

Hierzu ist in der Vorlage nur noch die Zeile

<link rel="shortcut icon" href="Hier die Adresse des Favicons einfügen" />

im Header zwischen <head> und </head> im oberen Bereich einzugeben.

Probiert's einfach mal aus und gebt Eurem Blog sein eigenes Erkennungszeichen.

Gruß Riddick



5 Kommentare:

S.A.F.E - Instruktor hat gesagt…

finde favicons auch nett :-)

Riddick hat gesagt…

Vorallem hat Deins 'nen enorm hohen Wiedererkennungseffekt. Da kann ich nicht mithalten.

Gruß,
Riddick

Monte hat gesagt…
Dieser Kommentar wurde vom Autor entfernt.
Monte hat gesagt…

Schön umgesetzt, Respekt.
Bei mir hat's leider nur zu einem Ausschnitt des Hintergrunds der HP gereicht, den ich aber leider nicht auf den Blog bekomme.

Das Avatar so klein zu kriegen und erkennbar zu lassen ist gut.

Chapeau!

Gruß,

Monte

showman hat gesagt…

Ich check des net. Wo muß ich was hinladen und einfügen damit des Dings erscheint.

Gruß Showman