As I’m building sites I come across a whole range of useful tools and gadgets that help me work faster.

This little tool allows you to build sprites. What is a sprite I hear you cry? A sprite is collection of small images or tiles that have been grouped into on file.

Visit the Sprite Pad site

Why would I want to use one? A lot of emphasis has been placed on making websites load quicker and run faster. Using a sprite means you only have to download one file instead of lots.

Eh? There are a couple of reasons why this helps.

1) An picture isn’t just the image, you also have a header at the beginning of the file. The header tells the browser what type of file it is so it knows what to do with it. If you download just one sprite you only have to download one header instead of a header for each file (less waste).

2) When an image is included on your website a request is made for the file. It can take a fraction of a second for the server to reply and the download to start. Hang on “A fraction of a second”? Because the request for the file is made for each file you are multiplying the number of fractions you have to wait. In this way you save time by  requesting a bigger file (the sprite) than the individual files.

IcoMoon is a web app that creates fonts. These fonts are little different to the type you would normally use in a word processor, these fonts contain icons that can be used throughout your website. This is another size saving tool, a font file is smaller than storing lots of little images (yes you could use a sprite). The benefits of using a font is that they will scale to almost any size and will still look good, the downside is that a fonts are monochrome.

Visit the IcoMoon website