Crear sprites online con CSS Sprites

Los sprites son muy utilizados en la actualidad por webmasters y diseñadores, se trata de una técnica utilizada en sitios web con trafico alto para no saturar los servidores, y tiene como objetivo utilizar una única imagen de altas dimensiones donde se ubicaran los iconos, barras, entre otras imágenes para que estos sean utilizados en la página, luego de esto dividir las imágenes por medio de código CSS, repartiendo así cada icono o barra de menú para ser utilizadas en las páginas web.

Para quienes no entienden la aplicación de estos “sprites” en las páginas web, podemos explicarlo con un ejemplo más sencillo y cotidiano. Imagina la creación de una casa, el transporte en el primer caso será un carro, se tardarían más de 100 vueltas para transportar los materiales al lugar, ahora imagina 1000 personas construyendo sus casas. La idea de enviar toda la información en una imagen es precisamente enviar la información de una sola vuelta y en un solo conjunto para después dividirlo, en el ejemplo de la casa se utilizaría un tráiler de carga para llevar así los materiales de construcción usando uno por persona y sumando un total de 1000 tráileres.

CSS Sprites permitirá el uso de un solo sprite, bastara con subir todas las imágenes y colocarlas al gusto para ahorrar espacio o simplemente repartidas por medio de una herramientas que ofrece la página. La propia herramienta nos brindara el código CSS listo para copiar pegar en nuestra hoja de estilos para nuestra página.

Enlace | CSS Sprites.