Over the past few years as I gain more and more experience in not only building software and products but also in leading teams and projects…
When making the new design of this blog, I inevitably come to the dilemma of whether to use traditional CSS sprites (i.e. to use background image positions to locate the images) or to use Data URI sprites (i.e. to use Data URI / MHTML to replace the actual image files).
First of all, during the design and development stage, everything was built without any sprites in mind. It is just so much easier to build the template without worrying about background image positions.
After the template is finalised, I then used the sprite tools to generate the sprites.
Unfortunately, the limitation of Data URI and MHTML, namely, the 32KB length limit in IE 8, makes this approach less feasible.
In the end, I generated the CSS sprites using the CSS Sprite Generator and manually replaced those CSS attributes.