Praxis: Internet Explorer 9 optimieren

High-Res Icon

High-Res Icon
Durch die Integration in die Taskleiste wird die Webseite wie ein Programm angezeigt und kann über diese Verknüpfung direkt gestartet werden. Als Icon wird das Favicon der Webseite genutzt. Wenn man aber die Webseite an die Taskleiste anheften möchte, benötigt Windows 7 ein Icon mit einer höheren Auflösung. Die Taskleiste ist um einiges grösser als das klassische Favicon. Internet Explorer 9 nutzt Icons mit folgenden
Auflösungen:
Adressleiste (16 x 16)
Neue Registerkarte (32 x 32)
Taskleiste (32 x 32)
Browser UI einer angehefteten Webseite (24 x 24)
Angeheftete Webseiten nutzen darüber hinaus:
Aufgaben in Sprunglisten (16 x 16)
Vorschaubilder von Toolbar-Buttons (16 x 16)
Überlagernde Icons (16 x 16)
Ein Favicon kann mehrere Bilder in unterschiedlicher Auflösung beherbergen. Für die beste Darstellung mit dem Internet Explorer 9 empfehlen wir folgende Auflösungen: 16 x 16, 32 x 32, 48 x 48; optimal: 16 x 16, 24 x 24, 32 x 32, 64 x 64
Wenn eine Webseite kein Icon in geeigneter Auflösung zur Verfügung stellt, wird das vorhandene nicht einfach hochskaliert. Dabei auftretende unschöne Pixelartefakte aufgrund der geringen Quellgrösse würden das Gesamtbild deutlich trüben. Daher wird das bestehende Icon in Originalgrösse eingebunden und mit einem weissen Rahmen umgeben. Es empfiehlt sich daher durchaus, ein hochauflösendes Favicon anzulegen. Dieses speichert man im ICO-Format auf der eigenen Webseite. Meistens platziert man das Favicon im Wurzelverzeichnis der Webseite und bindet es über ein Link-Element in den <head>-Bereich der Webseite als neues Favicon ein:<link rel="shortcut icon" href="/favicon.ico" />
Zu beachten ist, dass das Favicon bei jedem Webseitenzugriff geladen wird. Bei populären Webseiten kann bei der Verwendung eines High-Res-Icon durchaus der Traffic um GB zunehmen. Daher ist es ratsam, im Webserver das clientseitige Caching des Favicons über den HTTP-Header einzuschalten. Der Internet Explorer 9 beachtet hier die Elemente max-age und expires date. Zusätzlich kann für die Datei die GZIP-Komprimierung aktivieren, sodass die Dateigrösse während der Auslieferung um ungefähr die Hälfte verringert werden kann.Weitere Informationen rund um Favicons stellt Microsoft im Microsoft Developer Network zur Verfügung:



Kommentare
Avatar
Gaby Salvisberg
04.04.2011
.... Opera, Lynx, Konqueror, Amaya, Flock, Seamonkey, Mosaic, Epiphany!!???!! Wir können nicht in jedem Artikel jede Geschmacksrichtung abfangen. Leider!

Avatar
Juerg Schwarz
04.04.2011
und wann kommen die Tipps für Safari, Firefox, Chrome, .....????!!!!!!!! Aber aber - brauchts die? Die sind doch von Haus aus schon um Welten besser als der IE :P