Solution: 2-D images are sprites. Sprite is a big image which is made up of combining small images into one larger image. It is defined by X and Y coordinates. CSS background-position property is used to define the exact position that is to be displayed.

Solution: If there are so many small icons, images, buttons etc. on the web page it will take more time to load the web page. Hence image sprites are used, it combines small images in one and loading time is reduced. This also reduces the HTTP request.

Solution: For using image sprite we should try to round up to nearly 10 pixels, especially when working with Photoshop. We should also use simpler figures so that it will be easy to use ‘snap-to’ grids in photoshop, also for keeping things organized.

Solution: There are many sprite sheet generators such as Lemonade, Compass, SpriteMe, Fireworks CS6. Lemonade, Compass, and SpriteMe are available free of cost but Fireworks CS6 is not free of cost. Pixelomator is image editing software.

Solution: SpriteMe is brilliant sprite sheet viewer and generator. It is available at a free of cost. We can design our website using individual images. It is very simple to use. By using SpriteMe we can also view current sprite sheets that are already present on a website.

Solution: Sprite Cow does not generate sprites, instead it helps to get the dimensions of images that are within sprite sheet, SpriteRight is used for generating sprite sheets., here the CSS is created on the fly. CSS Sprites is also one of the sprite sheet generators. Glue is a command line tool that generates sprite sheets.

Solution: The .content property is a read-only property i.e a DocumentFragment which contains guts of template.
function support_temp() {return ‘content’ in document.createElement(‘template’);} if (supportsTemplate()) {//go !} else {//use another templating