We've been having a few discussions about what we should use for our icons throughout the Adapt framework. For a bit of background - we have icons for items like correct items ('tick'), incorrect items ('cross'), menu button ('three horizontal bars') etc. We originally started with a font-icon set and this worked great. We were able to change the colour of the fonts with ease and in our css files. They're scalable and work across the core browser spec for the framework.
We moved over the png sprites because some graphical artists wanted more control over layered or highly detailed icons. However this has only been done once on a course and we are now using completely flat icons like an icon font set.
I've spoken to a few people involved and we looked at:
* SVG for modern browsers and a fall back to web icon fonts. This would mean keeping two sets of icons.
* SVG for modern browsers and a fall back to png sprites. This would mean keeping two sets of icons.
* Sprites. Would mean we have to keep two sets up to date for retina display devices.
* Use a font icon set. Means it's one set to keep up to date. Is scalable like SVG. We can import a large icon font set and not worry too much about file size like a PNG alternative. There is a few rendering issues with IE8, but I guess a user using IE8 is use to this kind of rendering issue. (blurry edges).
As you can see. I'm slightly towards icon fonts but would welcome any ideas or suggestions to either use or research.