CSS Sprite Generator
Publicado el Domingo 30 de Septiembre del 2007 @ 17:52 por Armonth.
Si a principios de mes os explicaba una técnica para ahorrar peticiones HTTP con las imágenes y CSS mediante el uso de “sprites” (imágenes pegadas unas con otras y llamando a cada imagen de forma individual con CSS) ahora toca mencionar CSS Sprite Generator.
CSS Sprite Generator es una herramienta online en la que subimos un ZIP con todas las imágenes, le decimos por donde cortar y nos generará las imágenes y el código CSS.
Esto nos resulta inútil si tenemos que cortar imágenes distintas pero si se trata de imágenes muy parecidas (los famosos iconos) nos ahorrará mucho trabajo.
La página también ha servido para conocer la única incompatibilidad importante con esta técnica:
Opera (at least as far as version 9.0) won’t recognise a background position greater than 2042px or smaller than -2042px using that boundary value instead.
Es decir, que no podemos usar imágenes de más de 2042 pixeles ya que el background: … -2042px no lo reconocerá. Aunque hay que ser basto para hacer cargar una imagen de 2042px a los usuarios, que el “diseño” de la página no suele tener tantas imágenes :-P
2 Comentarios (feed)
-
Hereldar nos comenta:
Es una técnica interesante, aunque supongo que, a menos que tengas un porrao de visitas diarias, no se notará mucho. De todas formas a ver si un día de estos lo pongo en mi web, nunca lo he probado y la verdad es que mi nivel de css es un poco básico :-|. Espero que esta herramienta pueda ayudarme.
-
Reboot nos comenta:
Ahora que lo pienso, para botones de afiliados vendría de coña.
