Die Bedienung des Tools ist einfach, zumal es eine deutsche Version davon gibt. Man erstellt seine Grafiken wie gewohnt, packt diese in ein ZIP-File, lädt sie hoch und bekommt ein Sprite-Bild – wahlweise als PNG-, GIF- oder JPEG-Grafik – und CSS-Regeln zurück. Die Optionen sind grösstenteils selbsterklärend. Nähere Erläuterungen findet man unter dem Menüpunkt “Hilfe”.
http://spritegen.website-performance.org/
// Was sind „Sprites“?
CSS Sprites ist eine Technik, mir der man die Anzahl von HTTP Verbindungen der Seite herunterschrauben kann. Jede HTTP Verbindung die während des Ladens der Seite erstellt wird verlangsamt die Seite. Die Idee von CSS Sprites ist das man anstatt von vielen Bildern ein einziges verwendet und nur Teile dieses Bildes mittels der background-position Regel von CSS anzeigt.
Diese Technik kann sehr effektiv sein, besonders dann wenn man viele kleine Bilder wie Icons auf einer Seite verwendet. Zum Beispiel sind alle Bilder im linken Menu auf der Yahoo! Anfangsseite in einem einzigen File.
f300.wordpress.com 