I don’t see image sprites used that much anymore, but it’s still a good technique for reducing downloaded decorative image assets when you have multiple on a page. The big idea is combining all the graphics into one and then shifting around the size and background-position to reveal one at a time.

Say you’re site needs dozens or hundreds of country flags — that’s a perfect opportunity for a sprite. Michael P. Cohen has built a generator site to help build just what you need.

My first thoughts was… why not SVG? Michael says:

Why not use SVG? Many flags adapt very well to this format. I’m a fan of SVG but it wasn’t the right tool for this. The problem is too many flags have a lot of detail in crests and icons and imagery, and those details quickly increase svg file sizes far more than they do for index color files.

Direct Link to ArticlePermalink

The post Freak Flags appeared first on CSS-Tricks.