If you want to find out how you can convert your icons to a web form, this article is just for you! Here you can find 6 steps to do it easily.
1. Convert the SVG to TTF
Just visualize that you have already created some useful and beautiful icons and saved it in SVG format. Now you need to convert it to a web form. The first thing you should do is converting SVG to TTF format, which is a great format for installation and for distribution. It also has all the features to meet web claims. Here are some online services that allow you converting fonts between these 2 formats: http://onlinefontconverter.com/, http://www.fontconverter.org/ and http://www.font2web.com/.
All you have to do is uploading the element and pressing the convert button.
2. Edit font’s meta info
After you have converted it to TTF format, you should edit the font’s meta data. By renaming and editing the font, you make it ready for installation , embedding and distribution. It’s also a great opportunity to demonstrate that this is your own work. The ones, who use Windows can use Microsoft Font Properties Editor to do it.
3. Make the font embeddable
Now after editing the meta info, it’s the right time to run your TTF in Font Squirrel’s @font-face generator. There are some options you should mention in the generator’s expert mode to make the font as effective as it’s possible.
Subsetting: This option lets you use only those symbols and symbols which you’ve already delegated, so you can reduce the size.
Remove kerning: Your icon appears in isolation so kerning is not important here: By removing it, you can reduce the size as well.
4. Distribute the font
So, now if you want distribute your font, you should have a license, so in this case, many font websites won’t use your font without getting permission to do so. Since all the sources mentioned above were free, this one is also not an exception. For example GNU General Public License and SIL Open Font License are perfect ones. So by licensing your name,other designers can only use it if they name it differently. As a result, the crimes against icon design won’t be associated with your name
So, here are 4 easy steps to convert your icons to a web form. Do you have other ideas to do so? Let us know by sharing your ideas in the comments below.
Here’s another article you might like: Top 10 Mistakes Designers Make in Icon Design