Quick Sprites 1.9

A new release of Quick Sprites is being published on the Mac App Store and will be shortly available for everyone.

Version 1.9 enables you to create sprite sheets with different versions of the same sprite: one for normal users and one that will be seen only on Retina displays. It’s as easy as importing the two images in the proper size (the Retina one should be 2x on each dimension) and ticking a checkbox: 🙂

The Retina flag in QuickSprites

Setting the Retina flag on a sprite means that it’s a version that should be used only by Retina display users. In this case, make sure you have also added a smaller image for normal users, using the same selector.

In some cases, it might be worth creating two documents: one with the normal sprites and one with only the Retina display overrides, so that normal users won’t have to download the higher resolution graphics. Remember to load both style sheets in your HTML page: first the normal one, then the one for Retina users.

Quick Sprites debuts on the Mac App Store

The use of CSS sprites is a valuable techique for any web developer who wishes to optimize his web site, making it both faster for users and better ranked by search engines.

However, it usually involves more work to pack the images in a single sprite sheet and to update them when the site evolves.

If you never used this technique for this reason, now you won’t have any excuse left: Quick Sprites makes creating and maintaining sprite sheets a breeze 🙂

You can see how easy is to work with Quick Sprites in this short video: