In dem heutigen Tutorial zeige ich euch, wie ihr mit Adobe Photoshop ganz einfach ein Favicon erstellen könnt.
Das Favicon ist ein 16×16 oder 32×32 Pixel großes Symbol, Icon oder Logo, welches in der Adresszeile eures Internet Explorers neben der URL angezeigt wird. Das Favicon dient dazu, die zugehörige Website auf wieder erkennbare Weise zu markieren. Das Favicon taucht ebenso bei den Registerkarten (Tabs) unter Windows beim Speichern oder in der Lesezeichenleiste auf.
Mit dieser Codezeile
<link rel=”shortcut icon” href=”favicon.ico” type=”image/x-icon” />
wird das Favicon direkt im Head-Bereich eures Quelltextes eingefügt. Die erstellte Grafik muss den Namen „favicon.ico“ tragen, um im Browsern richtig erkannt zu werden.
Wenn ihr selbst kein Photoshop zur Verfügung habt, könnt ihr auch einen Favicon Generator verwenden, welchen ihr beispielsweise kostenlos auf http://www.favicon-generator.de/ findet. Hier könnt ihr ein HTML Favicon aus einem Bild oder eigenen Zeichnungen generieren lassen.
Ich wünsche euch viel Spaß beim Ausprobieren und Anfertigen eures eigenen Favicons!















Sehr schön, aber mit welchen Einstellungen ich das favicon speicher wird nicht erklärt
Ja, das mit dem Speichern ist auch mein Problem -.-
es genügt, das Favicon als bmp-Datei mit der Endung .ico zu versehen. Für
Fotos und Logos ohne Adobe Photoshop kannst du ein Konvertierungsprogramm
aus der Liste http://www.favicons.de/#tools auswählen, um das Icon-Format zu
erzeugen. Hier noch die Größen für die Farbtiefe.
Defaultgröße und -Farbtiefe:
Für ICO: 16×16 oder 32×32 und 16 bis 16 Millionen Farben.