Como fazer CSS Sprites sem saber CSS
10 de janeiro de 2012 21 de janeiro de 2016 Gigaconteúdo	html, sites, wordpress
CSS Sprites é uma técnica que visa unir todas ou diversas imagens de uma página num único arquivo, fazendo com que o tempo de carregamento do site seja diminuído. O principal efeito dessa técnica é diminuir drasticamente o número de requisições HTTP que, quando em grande quantidade, atrasa o carregamento da página.
A lógica é a seguinte: se seu site possui 10 imagens, cada vez que o visitante visualizá-la, o navegador terá que buscar cada uma delas.
Utilizando CSS Sprites, essas 10 imagens serão transformadas em apenas uma, e os linkas associados à cada uma delas serão posicionados através de regras CSS, o que é feito automaticamente quando o navegador carrega o CSS.
Exemplo de efeito obtido com CSS sprites
Para criar esse tipo de efeito do zero, é necessário saber CSS. No entanto, existem sites que fazem automaticamente quase tudo. Basta apenas enviar as imagens e, caso queira, fazer alguns ajustes, e pronto.
Vou listar alguns sites que geram automaticamente CSS Sprites, disponibilizando, em seguida, tanto a imagem quanto o código CSS. São eles: Spritegen, csssprites.com e o spritebox.net..