CSS Sprites for On-Page Optimization
Optimizing Web pages involves a lot more than trying to get Web pages as high as possible within search engine results. Optimizing is also about Web pages performance. Optimized Web page should load as fast as possible even though it has lots of graphics and text.
Since connections via Web user's browser are limited, the load time depends on factors such as number of images, number of CSS and Java Script files. Each file uses the browser's connection. Therefore, it is important to lower the number of files a Web page uses to display the content.
One method is to use one larger image instead of many. A proven technique is to use CSS sprites. Accessing parts of the image with CSS positioning is relatively easy, but requires pixel calculations. Without going into much detail, you can visit the invaluable links below for information on how to use the technique on your Web pages.
Related links:
- How to make CSS Sprites
- Creating easy and useful CSS Sprites
- Creating & Using CSS Sprites
- CSS Sprite Navigation Tutorial