Through getting some answers here and some research, I've come across a new approach to implementing icons. Rather than as images or css background, it seems you can approach icons as a font.
Will this method ultimately mean creating a one file font set that has each icon assigned to a character? Because this method is so new to me I really want to sure I approach it correctly first (I see great potential... so much better than creating different icons, exporting each as it's own .png file for every different color and size).
If that's the case, it'll take a bit of memorization (especially since I have over 26 icons). For those more experienced with fontforge, is there a way to say a specific word = character?
Also, in regards to implementing this on the website. I would then need to specify the font type within the css class/id (i.e. font=icons; ). And then I could change the size, color, etc. with css as well? Man, if this really is true. I wish I found out earlier... hours and hours could have been saved.
Anyway, any help with this is greatly appreciated. I'm about to get fontforge and start learning (if there's better free software for font creation, let me know). Hopefully this works out.
I've successfully created a few icon fonts for my websites and the Inkscape FontForge approach as outlined in this how-to is pretty solid, and if you're used to using software such as Inkscape, it's also pretty easy too. Here's the steps I take:
I'll often leave this plain SVG document open, pasting in new icons and centering and sizing according to the last. This way there is size and position consistency across the icon set (and you don't have to keep choosing the directory to save your plain SVGs).
Change the following:
In the main window, choose File > Generate Fonts and save to TrueType (ignoring any errors).
Hope that's of help.