22 Die i-tüpfelchen: Favicons. Schenken Sie Ihrer URL ein eigenes Icon. Wo werden Favicons überall angezeigt? Wie kommen Favicons in die Adressleiste?

Transkript

1 22 Die i-tüpfelchen: Favicons Schenken Sie Ihrer URL ein eigenes Icon Wo werden Favicons überall angezeigt? Wie kommen Favicons in die Adressleiste? So erstellen Sie Favicons auf Windows und Mac Ein Favicon für unsere eigene Website

2 Website zu Favicons Auf der Website erhalten Sie weitere Tipps zu Favicons. Dort finden Sie nicht nur Anleitungen zur Erstellung von Favicons, sondern auch eine große Galerie. Was sind Favicons? Das sind kleine Symbole, die neben den Webadressen in der Adressleiste des Browsers erscheinen. Diese kann man mit speziellen Programmen ganz einfach erstellen und mit Dreamweaver auf den Webserver laden. Favicons sind kleine Icons, genau 32 x 32 Pixel groß, zusammengesetzt aus maximal 256 Farben und abgespeichert im ICO-Format. Abbildung 22.1 Die Favicons von Apple, Heise-News und Spiegel Online erscheinen neben der URL in der Adressleiste des Webbrowsers. Viele namhafte Websites setzen Favicons ein, um Ihr Logo auch in der Adressleiste und in den Favoriten bzw. Bookmarks in den Browsern zu präsentieren. Unter Windows können Favicons zusätzlich auch in der Taskleiste, im Windows-Startmenü und auf dem Desktop angezeigt werden. Abbildung 22.2 Favicons werden von den meisten Webbrowsern auch im Bookmark-Menü angezeigt. Favicons sind nicht dringend erforderlich für eine Website. Sie sind jedoch so etwas wie ein i-tüpfelchen und sehen ungemein professionell aus. Für die Erstellung von Favicons gibt es spezielle Programme. Im Folgenden werden wir uns anschauen, wie damit Favicons für Mac und Windows gebaut werden. Für den Mac gibt es ein hervorragendes Programm, mit dem Sie Favicons erstellen können. Mit der Software GraficConverter (ausgezeichnet mit dem MacUser Award 2003) von Thorsten Lemke kann man nicht nur Bilder in alle erdenklichen Grafikformaten importieren und exportieren, sondern auch Grafiken erstellen und bearbeiten. 318

3 Sie können die Software von der Website downloaden und ausprobieren. Der GraficConverter ist Shareware. Gegen eine geringe Gebühr können Sie ihn lizensieren. Abbildung 22.3 Mit der Software GraficConverter kann man auf dem Mac Bilder ins ICO-Format exportieren. Schritt für Schritt: Favicon unter Mac OS erstellen Erstellen Sie mit einer beliebigen Grafiksoftware (z. B. Photoshop oder Fireworks) ein Bild in der Größe 32 x 32 Pixel und mit 256 Farben. Sie können das Bild auch direkt mit dem Programm GraficConverter erstellen. 1. Favicon entwerfen Speichern Sie das Bild im BMP-Format (8 Bit bzw. 256 Farben) unter dem Namen favicon.bmp ab. Öffnen Sie das Bild in GraficConverter mit Ablage Öffnen. Speichern Sie es dann unter Ablage Speichern wieder ab. Sie sollten im erscheinenden Dialogfenster die folgenden Einstellungen vornehmen: 2. Bild im GraficConverter öffnen Geben Sie unter 1 den Namen favicon.ico ein. Wählen Sie dann den Ordner aus, in dem das Favicon abgespeichert werden soll. Damit es vom Webbrowser erkannt wird, muss es sich im gleichen Ordner befinden wie die Homepage 2 index.html. Wählen Sie in der Format-Liste 3 Windows Icon aus. 319

4 Wählen Sie schließlich noch WWW-Ready 4 aus, damit keine Ressource (speziell für Mac) mit abgespeichert wird. Ende Wirklich kostenlos? Beachten Sie, dass von Bitmap to Icon nur die ältere Version kostenlos ist. Neuere Versionen sind kostenplichtig. Für die Erstellung einfacher Favicons reicht die ältere Version aber völlig aus. Klicken Sie auf Sichern 5, um das Favicon zu erstellen. Wenn Sie das Favicon mit Dreamweaver auf den Webserver übertragen, wird es im Browser der Besucher Ihrer Website angezeigt. Unter Windows ist es nicht einmal nötig, eine Software zu lizenzieren. Sie können hier das kostenlose Tool Bitmap to Icon von der Firma QTam verwenden. Zum Herunterladen finden sie es auf der Website 320

5 Schritt für Schritt: Favicon unter Windows erstellen Auch hier müssen Sie die Grafik für das Icon zunächst in der Größe 32 x 32 Pixel und mit 256 Farben erstellen und im BMP-Format abspeichern. Öffnen Sie das Bild nun mit dem Tool Bitmap to Icon, indem Sie darin auf die Schaltfläche Open BMP klicken. 1. Favicon entwerfen 2. Bild öffnen Klicken Sie auf die Schaltfläche Save ICO, um das Bild im ICO-Format zu speichern. Es öffnet sich ein Dialogfenster, indem Sie den Zielordner und den Dateinamen eingeben können. 3. Bild konvertieren 321

6 Geben Sie den Namen favicon ein und wählen Sie den Ordner aus, in dem es gespeichert werden soll. Damit es vom Webbrowser erkannt wird, muss es auch hier im gleichen Ordner gespeichert werden, wie die Homepage index.html. Klicken Sie auf Speichern, um das Favicon zu erstellen. Ende Übertragen Sie das Favicon mit Dreamweaver auf den Webserver und es wird in der Adresszeile angezeigt, wenn ein Besucher auf Ihre Website kommt. 322