What are Image Sprites ::
This might be the question arising in your minds that what are exactly are image sprites I am talking about, well image sprites is the collection of images bundled into one single image for single http request and fast blog. Well your blog contains many images like it can some small feed icons, email icons and other stuff when someone loads your blog all the images are cached using many http requests and hence more requests are created that slows your speeds. So creating one image and showing part of image where its needed can be easier way.
So implementing image sprites earlier was a headache means you needed to have perfect CSS knowledge for positioning your images and blah blah, but with modern online tools such as SpriteMe that makes your process just one click. SpriteMe can easily show all the images that can be sprited in your blog and creates a image sprite for you easily.
- Now visit your blog or website and click SpriteMe to see if your have any images available that can be converted into image sprites.
- So now as soon as you click on the SpriteMe link a popup will be shown saying that finding images and after that Suggested Sprites will be shown.
- Now all the images shown under Suggested Sprites can be converted into one image and http requests will be reduced.
- Now just click on Make all than will create all the supported sprites and will how you one image than can be used instead of many.
- So now after your one image is created just click on the export CSS option to see how you can apply that one image instead of many images.
- Now you can see the temporary image is created, make sure to download and upload it to your own server or blogger server. You can also see the CSS modifications as you can see just search for the CSS styles as mentioned and change the image url with the one mentioned and also add the position.
- Now make change to all the CSS styles and you will have one image sprite running on your blog containing all the images and hence http requests will be reduced and your blog will be more faster.
So now this is an easy way for creating CSS Sprites, well there are many more online websites that allows you to create CSS sprites but SpriteMe is easier as it automatically cerates and shows you CSS modifications. So come-on apply sprites now and fasten your blog out. If you face any problems just comment below.