SummArg | Cursos y recursos para webmasters

22/12/2010

SpriteGen: CSS Sprites Generator

Hace un tiempo habíamos hablado de CSS Sprites Generator, una herramienta online muy útil para incursionar en la técnica de Sprites. Ahora les traemos otro CSS Sprite Generator en spritegen.website-performance.org cuyo funcionamiento es similar al anterior. Tomamos las imagenes que vamos a utilizar en una web, las comprimimos dentro de un .zip, subimos el archivo comprimido en la web y acomodamos las opciones.

El website nos devolverá una única imagen conteniendo todas las que nosotros colocamos dentro del archivo comprimido y nos indicará el CSS a utilizar para mostrar en nuestra web cada uno de esas imagenes:

.sprite-icono1 { background-position: 0 0; width: 200px; height: 200px; }
.sprite-icono2 { background-position: 0 -220; width: 200px; height: 200px; }

En las opciones podemos elegir ciertas variantes del CSS (prefix de la clase, sufijos, mostrar o no ancho y alto, etc) y de la imagen misma (formato de imagen, disposición de las imagenes en su interior, calidad, cantidad de colores, etc).

Sin dudas un recurso muy útil para tener a mano.

Dejar un comentario