Site icon Free Tools

SpriteGen, accélérez le chargement des images avec CSS

SpriteGen est une application web 2.0 qui vous permet d’automatiser le processus de génération des Sprites CSS.

Les Sprites CSS sont un moyen de réduire le nombre de requêtes HTTP faites sur les ressources images de votre site. Les images sont regroupées en une seule grande image, et sont accessibles via leurs coordonnées X et Y au sein de l’image. En affectant l’image générée aux bons éléments de la page la propriété CSS background-position peut alors être utilisée afin de ne rendre visible que la zone cible de l’image Sprite.

Cette technique est utilisée afin d’améliorer les performances d’un site, le gain de performance est significatif dans beaucoup de situations notamment dans le cas où il y a beaucoup de petites images, telles que les icônes de menus. La page d’accueil de Yahoo!, par exemple, utilise exactement cette technique.

Pour générer votre sprite CSS, vous devez simplement fournir un fichier ZIP contenant au moins 2 images (GIF, PNG ou JPG) et SpriteGen génère l’image Sprite ainsi que les règles CSS associées pour afficher unitairement chaque image composant le Sprite.

L’outil possède des options que vous pouvez configurer pour modifier les caractéristiques de l’image Sprite générée ainsi que les CSS associés afin de mieux répondre aux spécificités de votre site web :

Site Internet : SpriteGen
Licence : GPL

Quitter la version mobile