Tuesday, March 9, 2010

Eigenes Favicon in Photoshop erstellen

Favicon ist das kleine Icon welches im Browser neben der Adresszeile einer Webseite erscheint. Standardmaessig kann man diese .ico in Photoshop aber nicht erstellen. Abhilfe schafft hier ein kostenloses Plug-in das man unter http://www.telegraphics.com.au/sw/ runterladen kann.

Die Installation:

1. Suchen Sie auf der Seite http://www.telegraphics.com.au/sw/ das passende Plug-in fuer Ihr Betriebssystem aus und laden es herunter.
Anmerkung: Unter Windows Vista scheint es haeufiger Probleme zu geben, einer Verwendung unter Vista waehre also abzuraten.

2. Entpacken Sie die gezippte Datei. In dem entpackten Ordner finden Sie ein Plugin mit dem Namen "ICOFormat"

3. Kopieren Sie das Plugin "ICOFormat" in:
C:\Program Files\Adobe\Photoshop CS\Plug-Ins\File Formats

4. Starten Sie Photoshop neu ( nur im Fall das Photoshop waehrend der Installation geoeffnet war).

Haben Sie das Plugin richtig installiert sollten Sie nun unter "Datei oeffnen" sowie "Datei speichern" das Dateiformat ICO ( Windows Icon) (*.ICO) zur Auswahl haben.

Checkliste:

Sollte Ihnen das .ICO Format nicht angezeigt werden, ueberpruefen Sie folgendes:
- Haben Sie Photoshop nach der Installation neu gestartet?
- Befindet sich das Plugin in dem richtigen Ordner? ...Adobe\Photoshop\ Plug-Ins \ File Formats
- Haben Sie das richtige Plug-In fuer Ihr Betriebssystem gewaehlt?
  • Fuer Windows = ICOFormat.8bi
  • Fuer OS X/Classic = icoformat
  • Fuer 68K MacOS = icoformat(68K)
Ein .ICO erstellen:
Favicon .ICO werden in 16x16 Pixel angelegt. Da es aber recht schwierig ist in 16x16 Pixel einen Entwurf anzulegen kann man auch den Entwurf in 64x64 Pixel anlegen und zum Schluss auf 16x16 Pixel verkleinern.
Oeffnen Sie also eine neue Datei in der Groesse 64x64 Pixel. Erstellen Sie Ihren Entwurf oder fuegen Sie Ihr bestehendes Logo ein. Bedenken Sie dabei das der Entwurf nicht zu viele Details beinhalten sollte, da die endgueltige Ausgabegroesse ja nur 16x16 Pixel betraegt.
Ist Ihr Entwurf fertig, verkleinern Sie die 64x64 Pixel Datei auf 16x16 Pixel und waehlen Sie "Bikubisch schaerfer" als Methode. Speichern Sie die Datei unter dem Namen "favicon" als
ICO ( Windows Icon) (*.ICO) .

Einbinden des Favicon in Ihre Webseite:

Wollen Sie das Ihr Favicon auf allen Ihren Seiten erscheint, dann legen Sie das Favicon im Hauptverzeichnis ( Root ) Ihrer Webseite ab. Bei CMS Systemen gegenbenenfalls in das Template Verzeichnis. Die meisten Browser finden das Favicon im Hauptverzeichnis. Sollte es trotzdem nicht gefunden werden, so fuegen Sie im Head Ihrer Seite diesen Metatag ein:

Soll das Favicon nur auf bestimmten Seiten erscheinen, so koennen Sie das Favicon auch in einem Unterverzeichnis abspeichern und in den betreffenden Webseiten ein Metatag im Head anlegen. Der Metatag sollte wie folgt aussehen:


Bei den Metatags muessen Sie natuerlich "pfad" sowie "Dateiname" mit Ihren Angaben ersetzen.

No comments:

Post a Comment